# 2 Ways to Repeat Strings
2 ways to repeat strings in JavaScript 🎉 I’ve always used “Array.fill” to do any repetitions. “repeat” is a recent discovery 🤩
const canada = '🇨🇦';
// Repeat method
canada.repeat(3);
// Fill method
Array(3)
.fill(canada)
.join('');
// result
('🇨🇦🇨🇦🇨🇦');
# How repeat works
The repeat method simply repeats your string. It returns a new string that concatentates the specified number of copies you indicated.
'🇨🇦'.repeat(3); // '🇨🇦🇨🇦🇨🇦'
'Hey'.repeat(2); // 'HeyHeyHey'
'Blank'.repeat(0); // ''
# How fill works
// Step 1: Create an new array with 3 empty items
Array(3)
// Step 2: Fill each empty slot with '🇨🇦'
.fill('🇨🇦')
// Step 3: Join all the elements into a string
.join('');
# Community Examples
# Using for loop
A classic example of repeating strings using the for loop 👍
const canada = '🇨🇦';
const arr = [];
for (let i = 1; i <= 3; i++) {
arr.push(canada);
}
arr.join(''); // '🇨🇦🇨🇦🇨🇦'
Thanks: Alen H.
# Using join only
A even shorter shortcut to repeat string using just the join method. Cool ✌️
Array(4).join('🇨🇦');
// returns '🇨🇦🇨🇦🇨🇦'
Thanks: Diogo D.
# Using Array.from
This is an interesting example
Array.from({ length: 3 }, () => '🇨🇦').join('');
// returns '🇨🇦🇨🇦🇨🇦'
Thanks: @oliverturner
# ☝️ How that works?
Let me break down Oliver's example and explain it a bit more.
1.
The length property of the from() method is 1. So we set the length property to 3, which initializes the array with 3 corresponding undefined in each position.
Array.from({ length: 3 });
// returns [undefined, undefined, undefined]
2.
Now we utilize the 2nd parameter, which is a map function that will make a call on every element of the array. Here we are replacing all the undefined with '🇨🇦'. Notice I've split this into two lines with {}, hence I need to use a return.
Array.from({ length: 3 }, () => {
return '🇨🇦';
});
// returns ['🇨🇦', '🇨🇦', '🇨🇦']
3.
Finally we call join() to combine all the elements in the array into a string.
Array.from({ length: 3 }, () => {
return '🇨🇦';
}).join('');
// returns '🇨🇦🇨🇦🇨🇦'
