TIL

0

JavaScript

목록 보기
2/4


Today I learn a code of Java Script.

forEach

It's so simple to read arrays. Look next line.

const aaa = [1, 2, 3, 4];

for(let i = 0; i < aaa.length; i ++){
  console.log(aaa[i])
}

function print(i){
  console.log(i);
}
aaa.forEach(print)

aaa.forEach(function(i){
  console.log(i);
})

aaa.forEach(i =>{
  console.log(i);
})

All of that is same values. but you have to understand about 'forEach' first.

map

map code makes new array that is like next line.

const array = [1, 2, 3, 4, 5, 6, 7, 8];

const squared = [];
for (let i = 0; i < array.length; i++) {
  squared.push(array[i] * array[i]);
}

console.log(squared);

//It's same to this
const squared = array.map(n => n * n);
console.log(squared);

I can understand but What is certain that it has been simplified. Simple👏🏻!

indexOf

You can find index with indexOf code.

const superheroes = ['아이언맨', '캡틴 아메리카', '토르', '닥터 스트레인지'];
const index = superheroes.indexOf('토르');
console.log(index);

But you can't find a key or value in object array. You need findIndex code.

findIndex

const todos = [
  {
    id: 1,
    text: '자바스크립트 입문',
    done: true
  },
  {
    id: 2,
    text: '함수 배우기',
    done: true
  },
  {
    id: 3,
    text: '객체와 배열 배우기',
    done: true
  },
  {
    id: 4,
    text: '배열 내장함수 배우기',
    done: false
  }
];

const index = todos.findIndex(todo => todo.id === 3);
console.log(index);

find

find code similars of findIndex code, but It find all of object values.

const todo = todos.find(todo => todo.id === 3);
console.log(todo);

// values is like that. {id: 3, text: "객체와 배열 배우기", done: true}

filter

filter is good to make material being useful.

const todos = [
  {
    id: 1,
    text: '자바스크립트 입문',
    done: true
  },
  {
    id: 2,
    text: '함수 배우기',
    done: true
  },
  {
    id: 3,
    text: '객체와 배열 배우기',
    done: true
  },
  {
    id: 4,
    text: '배열 내장함수 배우기',
    done: false
  }
];

const tasksNotDone = todos.filter(todo => todo.done === false);
console.log(tasksNotDone);

splice

const numbers = [10, 20, 30, 40];
const index = numbers.indexOf(30);
numbers.splice(index, 1);
console.log(numbers);
// [10, 20, 40]

slice

It's like splice code but It doesn't change of array that is origin.

const numbers = [10, 20, 30, 40];
const sliced = numbers.slice(0, 2); // 0부터 시작해서 2전까지

console.log(sliced); // [10, 20]
console.log(numbers); // [10, 20, 30, 40]

shift & pop

shift code puts out the first value, And pop code puts out the last things.

const numbers = [10, 20, 30, 40];
const value = numbers.shift();
console.log(value);
console.log(numbers);
// 10
// [20, 30, 40]
const numbers = [10, 20, 30, 40];
const value = numbers.pop();
console.log(value);
console.log(numbers);
// 40
// [10, 20, 30]

unshift

unshift code is reverse with shift code, look next line.

const numbers = [10, 20, 30, 40];
numbers.unshift(5);
console.log(numbers);
// [5, 10, 20, 30, 40]

concat & join

concat code is array + array, look next line.

const arr1 = [1, 2, 3];
const arr2 = [4, 5, 6];
const concated = arr1.concat(arr2);

console.log(concated);

But, join code's value is not array, just text. there are not similar.

const array = [1, 2, 3, 4, 5];
console.log(array.join()); // 1,2,3,4,5
console.log(array.join(' ')); // 1 2 3 4 5
console.log(array.join(', ')); // 1, 2, 3, 4, 5

reduce

'reduce' means 줄이다. 'reduce' code simplified codes to make funcition. If you make 'sum' function, you can make with 'for' sentance or reduce function.

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

let sum1 = 0;
numbers.forEach(n => {
  sum += n;
});
console.log(sum1);

let sum2 = array.reduce((accumulator, current) => accumulator + current, 0);

console.log(sum2);

and you can make average function with reduce code.

const numbers = [1, 2, 3, 4, 5];
let sum = numbers.reduce((accumulator, current, index, array) => {
  if (index === array.length - 1) {
    return (accumulator + current) / array.length;
  }
  return accumulator + current;
}, 0);

console.log(sum);
profile
I want to be digital nomad!

1개의 댓글