React 배열

Map

배열 내의 모든 요소 각각에 대하여 주어진 함수를 호출한 결과를 모아 새로운 배열을 반환한다.

      - for문을 대체한다.(for문 사용하지 않음)
      - 배열의 요소를 하나씩 반복한다.
      - 원래자리로 되돌아간다.

	const classmates = ["철수", "영희", "훈이"]

	classmates.map((el) => el + "어린이") 

	▶︎ ["철수어린이", "영희어린이", "훈이어린이"]	
     

Filter

배열을 순회하며 각 요소에 마다 주어진 함수의 결과를 모아 새로운 배열로 반환한다.

	- for문의 break,continue 대신 사용한다.

    const classmate = [
      {name: "철수", age: 10, school: "토끼초등학교"},
      {name: "영희", age: 13, school: "토끼초등학교"},
      {name: "훈이", age: 11, school: "토끼초등학교"},
     ]

    classmate.filter((el) => (el.age === 11))

  ▶︎ {name: '훈이', age: 11, school: '토끼초등학교'}

🤲 Map은 결과를 넣어주고 Filter는 평가한다.

템플릿 리터럴(Template literals)

내장된 표현식을 허용하는 문자열 리터럴이다. 

- 따옴표를 쓰지 않고 `백틱`을 사용한다.
- 문자열 연결시 '+' 연산자를 사용하지 않고 간략히 문자열을 삽입할 수 있다.
- ${~~}을 이용해서 문자열에 변수를 대입할 수 있다.

//이전방식
let aaa = 'hello';
let bbb = 'world';
console.log('My' + aaa +' ' + bbb + '!';
            
//템플릿 리터럴 
`My'${aaa}${bbb}!`;