.forEach

forEach문은 기존에 우리가 배웠던 for문을 대체 시킬 수 있다. for문과 마찬가지로 반복적인 기능을 수행 할 때 사용한다.
하지만 for문 처럼 index와 조건식, increase를 정의하지 않아도 callback함수를 통해 기능을 수행 할 수 있다.

forEach문의 구문은 다음과 같다.

array.forEach(callbackFunction(currentValue, index, array), thisArg);

매개변수로는 callbackFunction과 thisArg가 있다.
array의 인자값 만큼 callbackFunction이 반복되고, thisArg는 거기서 this값이 되는 것이다.
currentValue : 배열 내 현재 값
index : 배열 내 현재 값의 인덱스
array : 현재 배열

다음과 같은 배열 이 있다고 가정하자.

const superheroes = ["아이언맨", "캡틴 아메리카", "토르", "닥터스트레인지"];

만약, 배열 안에 있는 모든 원소들을 모두 출력해야 한다면 for문을 사용하여 다음과 같이 구현 할 수 있다.

const superheroes = ["아이언맨", "캡틴 아메리카", "토르", "닥터스트레인지"];

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

하지만 배열의 forEach함수를 사용하면 다음과 같이 구할 수 있다.

const superheroes = ["아이언맨", "캡틴 아메리카", "토르", "닥터스트레인지"];

superheroes.forEach(hero=>{
  console.log(hero);
});

참고
https://aljjabaegi.tistory.com/314
https://learnjs.vlpt.us/basics/09-array-functions.html

.map

map은 배열 안의 각 원소를 변활 할 때 사용되며, 이 과정에서 새로운 배열이 만들어 진다.

구문은 다음과 같다.

array.map(callbackFunction(currentValue, index, array), thisArg)

예를들어 다음과 같은 배열이 있다고 가정해보자.

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

만약에 배열 안의 모든 숫자를 제곱해서 새로운 배열을 만든다고 생각해 보자.

const array = [1,2,3,4,5,6,7,8];
const squared = array.map( n => n * n);
console.log(squared);

map함수는 filter함수와 같이 오브젝트도 컨트롤 할 수 있다.

(function test(){
  let testJson = [{name:"고갱", salary : 50000000},
                  {name:"홍길동", salary : 1000000},
                  {name:"헤리", salary : 3000000},
                  {name:"수지", salary : 5000000},
                  {name:"로제", salary : 8000000},
  let newJson = testJson.map(function(element, index){
    let returnObj = {}
    returnObj[element.name] = element.salary;
    return returnObj;
  });
  console.log(newJson);
})();

참고
https://learnjs.vlpt.us/basics/09-array-functions.html
https://aljjabaegi.tistory.com/315?category=640138

.filter

filter함수는 배열에서 특정 조건을 만족하는 값들만 따로 추출하여 새로운 배열을 만든다. 이름 그대로 요소들을 걸러내는 것이 목적이다.

정수 배열에서 5의 배수인 정수만 모아보자.

let arr = [4, 15, 377, 35, 395, 400, 1024, 3000];
let arr2 = arr.filter(function(n){
  return n%5 == 0;
});
console.log(arr2); // [15. 35, 395, 400, 3000]

이번에는 map함수와 같이 사용하여 5의 배수만 구해서 각 요소를 2배 해보자.

let arr = [4, 15, 377, 35, 395, 400, 1024, 3000];
let arr2 = arr.filter(function(n){
  return n%5 == 0;
}).map(function(n){
  return n * 2 ;
});
console.log(arr2); // [30, 70, 790, 800, 6000]

이번에는 todos 배열에서 done값이 false인 항목들만 따로 추출해서 새로운 배열을 만들어 보자.

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

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

참고
https://learnjs.vlpt.us/basics/09-array-functions.html
https://bblog.tistory.com/300

.indexOf

Javascript에서 특정 문자열에서 문자나 문자열을 찾을때 indexOf()함수를 사용한다.
indexOf의 구문은 다음과 같다.

array.indexOf(item, start)

다음과 같은 문장이 있을 때,

let str = "Hello world, welcome to the universe.";
let n = str.indexOf("welcome");

이럴 경우 n의 값을 13이 나오게 된다. welcome의 문자열이 13번째에 시작되기 때문이다.

만약 문자열이 없을 경우 -1을 반환한다.
그리고 welcome이라는 문자가 문자열 내 여러개 있을 경우, 맨 처음 발견되는 위치로 반환한다.

다음과 같은 배열이 있다고 해보자.

const superheroes = ['아이언맨', '캡틴 아메리카', '토르', '닥터 스트레인지'];

여기서 캡틴아메리카가 몇 번째 항목에 있는지 알고 싶다고 해보자.
다음과 같이 입력한다.

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

idx값은 1이 된다.