20220608 TIL

javascript

deep copy & shallow copy

let a = 10;
let b = a;
a = 30;
console.log(a,b)//30 , 10

let a = {value:1}
let newA = a;
newA.value = 2;
console.log(newA.value) //2
console.log(a.value) //2
console.log(a === newA) //true

얕은복사이기 때문에 값이 같이 바뀜.

   const user = {
        name : '철수',
        hobby :{
            a:'러닝',
            b:'등산',
        },
    }
    const newUser = Object.assign({},user);
    newUser.hobby.a = '강아지산책';//dep2 같이바뀜
    newUser.name = '철수';
    console.log(user)
    console.log(newUser)

1dep만 안바뀌고
2dep은 값이 같이 바뀜

   const obj = {
        name : '철수',
        address : '서울',
        hobby : {
            a:'game',
            b:'music',
        },
    }

    const newObj = JSON.parse(JSON.stringify(obj));
    newObj.hobby.a = 'book';
    console.log(obj)
    console.log(newObj)

JSON.stringify : 문자열로 바꿔줌JSON.stringify() 메서드는 JavaScript 값이나 객체를 JSON 문자열로 변환합니다.
JSON.parse : 문자열을 객체로 바꿔줌.JSON 문자열의 구문을 분석하고, 그 결과에서 JavaScript 값이나 객체를 생성합니다.

loop

forEach

map

배열을 순회 후 새 배열을 반환함.
반복된 결과값을 받아야 하기 때문.

key
react에서 어떤 항목을 추가 변경할 때 식별자로 사용하기 위해서 key 값을 적용한다. (인덱스값 key값으로 쓰면 안됨 : 인덱스번호는 고유한 값이 아니라 바뀔 가능성 있음.)

npx create-react-app foldername

public폴더에 넣으면 압축이 되지 않음(이미지 원본에 손상 x 용량 커질수 있음.)
src폴더에 넣으면 압축이 됨.