05_12_ 간단 자바스크립트 복습

이병관·2021년 5월 12일
0
post-thumbnail

Map

const classmates = ["철수", "영희", "훈이"]
function childrenMap(classmates){
  let arr = classmates.map(function (el) {
  return el+'어린이';
    })
    console.log(arr);
}

간단하긴 하지만 map을 한번 다시 복습하는 기념으로 적는다
map은 매개변수(el)로 classmates array를 가져와 특정 함수를 실행 후
새로운 배열을 만든 후 종료한다.

What is Map

map() 메서드는 배열 내의 모든 요소 각각에 대하여 함수를 실행, 그 결과들을 새로운 배열로 반환하게 해주는 녀석이다.
for of 문이나 forEach처럼 배열 내 요소들을 순회하는 반복문이나, 다른 부분은 배열을 만들어 낸다는것이 특이점.

let Mcc = [1, 2, 3, 4, 5];
const Mccommmi = myArr.map((currentElement, index, array)

map메서드는 파라미터로 콜백함수를 받는다.

currentElement :요소
index : 인덱스
array : map메서드를 호출한 배열이다.

중요한것은 만약 map메서드의 콜백 함수가 아무것도 리턴하지 않을 경우에는,
호출한 배열의 길이만큼의 undefined가 채워진 배열이 리턴된다.

const Mccommmi = Mcc.map(() => {});
console.log(Mccommmi); // [undefined, undefined, undefined, undefined, undefined]

Foreach


const classmates = [
  { name: "철수", homework: true },
  { name: "영희", homework: false },
  { name: "훈이", homework: false },
  { name: "민수", homework: true },
]


function giveMoney(classmates){
  classmates.forEach(element => {
    element.money = element.homework === true ? 2000 : 500;
  });
  console.log(classmates);
}
giveMoney(classmates)

foreach는 좀더 직관적인데

classmates 객체의 요소들이 callback 함수에 element가 되어 순서대로 호출되는 모습을 볼 수 있다.
for문에 비해 좀 더 깔끔하고, 직관적.

foreach는 오직 Array객체 안에서만 사용이 가능하고(물론 지금 es6버전은 Map도 있다)배열의 요소들에 대해 반복작업을 용이하게 해준다.

forEach((currentElement, index, array)

currentElement: 현재 요소
index: 현재 요소의 인덱스
array: 현재 메소드를 호출한 배열.

Map메소드처럼 사용하지 않는 콜백함수의 파라미터들은 뒤에서부터 순차적으로 생략할 수 있다.
만약 Return할떄 새로운 배열을 만들어 주는것이 아니라면 Map보단 Foreach가 더 나을것이다
물론 그것은 나중에 코딩할때의 문제겠지만...

나누어 떨어지는 숫자 배열

function solution(arr, divisor) {
    var answer = [];
    arr.forEach(el =>{
        el = (el % divisor) === 0 ? answer.push(el) : answer.push();
    })
    
    answer.sort(function(a, b)  {
    return a - b;
    });
    
    if(answer.length === 0)
        answer.push(-1);
    
    return answer;
}

foreach문으로 요소를 검사해서 answer에 담아주는데 오름차순 정렬이 필요하기에 끝에 오름차순 정렬을 넣어준다.

profile
뜨겁고 매콤하고 화끈하게

0개의 댓글