My Boundary As Much As I Experienced

선택적 체이닝은 있을수도 있고, 없을 수도 있는 데이터를 다룰 때 유용하다. 아래와 같은 user 2명이 있다고 해보자. const userA = { name: "bumang", age: 20, address: { country: "korea", city: "gimpo", }, }; const userB = { name: "neo", age: 20, }; userA는 address라는 속성과 값을 가지고 있지만, userB는 가지고 있지 않다. 이 상황에서 getAddress라는 함수를 만들어서 사용하고자 할 때, function getAddress(user) { return user.address.city; } console.log("!", getAddress(userB)); //reference er..

구조 분해 할당은 객체나 배열을 해체하여 각각의 인자들을 한꺼번에 다른 변수의 값으로 설정해주는 문법이다. 한 배열의 인자들을 각기 다른 변수에 할당하고 싶을 때 구조 분해 할당을 이용하지 않을 시, const arr = [1,2,3,4,5] const arg1 = arr[0] const arg2 = arr[1] const arg3 = arr[2] const arg4 = arr[3] const arg5 = arr[4] arr에 있는 값들을 하나하나 원하는 변수에 지정해줘야 한다... 그러나 구조 분해 할당을 이용한다면, arr = [1, 2, 3, 4, 5]; const [a, b, c, d, e] = arr; 매우 간편하게 a,b,c,d,e라는 변수에 arr의 인자들을 할당할 수 있다! 이뿐만이 아니라..

포지션 속성으로 원하는 좌표 기준에 따라 요소를 정렬할 수 있다. top, right, bottom, left 값에 따라 offset을 적용할 수 있는데, 그 기준이 좌표 기준은 아래와 같다. 속성값 특징 static (기본값) 특별한 특징 없음 relative 원래 자기 자신의 위치를 좌표 삼아 움직임 absolute 다른 레이아웃과의 관계를 벗어나 고정적인 위치를 갖는다. 자신에게 가장 가까운 포지션 값이 있는 상위 요소를 기준으로 삼게 된다. fixed 뷰포트(Viewport)를 기준으로 고정값을 가진다. 스크롤이 발생해도 뷰포트에서 고정적인 위치값을 갖는다. sticky 요소를 일반적인 문서 흐름에 따라 배치하고, 가장 가까운 스크롤이 가능한 조상과 가장 가까운 블록 레벨 조상을 기준으로 top,..