1. map vs filter
map이란??
const classmates = ['철수', '영희', '훈이']
classmates.map((el) =>(el +'어린이'))
el= elements
const classmates =[
{name:"철수"},
{name:"영희"}, ←{ name: 영희어린이 }
{name:"훈이"}
]
↑
name:'철수↓ = { name: 영희어린이 }
classmates.map( (el) => ( {name: el.name + '어린이'} ) )
classmates.map( (el) => ( {name: el.name, school:"다람쥐초등학교"} ) )
key값 추가도 가능함
소괄호 생략
classmates.map( (el) => el.name + '어린이' )
함수이름은 동사
변수이름은 명사
return은 값 반환, 함수종료를 의미함
2. 화살표 함수의 return 생략
화살표 함수에 return과 {사이에 아무것도 없으면 return생략하고 ()로 붙힐 수 있다.
const add = (aaa, bbb) => {
return (aaa + bbb)
}
==>
const add = (aaa, bbb) => (aaa + bbb)
const add = (aaa, bbb) => aaa + bbb
()도 생략할 수 있음
3. jsx와 연결하기
const classmates = ['철수', '영희', '훈이']
const aaa = classmates.map ( (el) =>
=== const aaa = [
return
데이터인데 변경이 없는데이터는 변수명을 대문자로 씀
위에 하드코딩한 데이터는 export default function 위에다가 import부분에 위치함
jsx와 연결할때는 따로 변수로 만들지 않고 때려박음
use로 되있는건 리랜더안됨
나머지는 리랜더링됨
4. filter
filter
원본의 갯수는 넘어갈 수 없음
const classmates =[
{name:"철수", age: 13},
{name:"영희", age: 10},
{name:"훈이", age: 11}
]
classmates
filter ( (el) => (el.age>=11) )
5. map함수 key, index
Each child in a list should have a unique "key" prop.
= key가 없다 얘들이 누군지 모르겠다
key는 완전고유한 아이디나, 넘버써줘야 한다
map((el, index))
index는 map이 실행시켜준 순서
map에서는 index를 key로 주면 안된다.
6. <>과 의 차이
<>에는 key를 쓸 수 없다
에는 key를 쓸 수 있다
7.스코프체인
외부 환경정보를 수집해올 때 바로 위 식별자의 enviroment 참조
이 말은 실행 컨텍스트의 외부환경 수집때문에 스코프 체인이 발생한다는 뜻
8. 리페치쿼리스
데이터가 바뀌었을 때 그 바뀐 데이터를 불러오는 것
