TIL day3 Iterators (methods)

Winney·2020년 8월 12일
0

Javascript 개념

목록 보기
3/8

1. .forEach

forEach() is used to execute the same code on every element in an array but does not change the array and returns undefined.

fruit = ['apple', 'banana', 'pineapple', 'grape'];
fruit.forEach(fruit => console.log('I want to eat a ' + fruit));

/*
output:
I want to eat a apple
I want to eat a banana
I want to eat a pineapple
I want to eat a grape
*/

2. .map()

.map() executes the same code on every element in an array and returns a new array with the updated elements.

const numbers = [1, 2, 3, 4, 5];

const bigNumbers = numbers.map(number => {
		return number * 10
});

console.log(bigNumbers); 
// output: [ 10, 20, 30, 40, 50 ]

3. .filter()

Like .map(), .filter() returns a new array.
.filter() checks every element in an array to see if it meets certain criteria and returns a new array with the elements that return truthy for the criteria.

const words = ['chair', 'music', 'pillow', 'brick', 'pen', 'door'];

const shortwords = words.filter(word => { 
		return word.length < 6;
});

console.log(shortwords);
//[ 'chair', 'music', 'brick', 'pen', 'door' ]

4. .findIndex()

.findIndex() returns the index of the first element of an array which satisfies a condition in the callback function. It returns -1 if none of the elements in the array satisfies the condition.

const jumbledNums = [123, 25, 78, 5, 9];
const lessThanTen = jumbledNums.findIndex(num => {return num < 10;
});
console.log(lessThanTen);
//output: 3 
// index가 3이므로 값은 5이다.

const greaterThan1000 = jumbledNums.findIndex(num => {
			return num > 1000;
});
console.log(greaterThan1000);
//output: -1
//1000초과하는 값이 없음. fa1lse.

5. .reduce()

.reduce() iterates through an array and takes the values of the elements and returns a single value.

const numbers = [1, 2, 4, 10];
const summedNums = numbers.reduce((accumulator, currentValue) => {
		return accumulator + currentValue;
});
console.log(summedNums);
/*
output: 17
1 + 2 = 3
3 + 4 = 7 
7 + 10 = 17
*/

6. .some()

The .some() method tests whether at least one element in the array passes the test implemented by the provided function. It returns a Boolean value.

const words = ['unique', 'uncanny', 'pique', 'oxymoron', 'guise'];
const lessThan6 = words.some(word => {
		return word.length < 6;
});
console.log(lessThan6);
//output: true

7. .every()

The .every() method tests whether all elements in the array pass the test implemented by the provided function. It returns a Boolean value.

8. .includes()

The .includes method determines whether an array includes a certain value among its entries, returning a Boolean value.

const animal = ['cat', 'dog', 'bird', 'goat', 'tiger'];
console.log(animal.includes('dog')); // true
console.log(animal.includes('cow')); // false
console.log(animal.includes('bird', 2)); //true
;console.log(animal.includes('bird', 3)); //false
console.log(animal.includes('bird', -1)); //false

출처 codeacademy, MDN

profile
프론트엔드 엔지니어

0개의 댓글