TIL

다시 자바스크립트(22.10.22TIL)

jingwook 2022. 10. 22. 23:57

다시 리액트를 다루는 주간으로 돌아왔다. 저번에 노아님이 말씀해주신 내용에 따르면 리액트를 사람들이 잘 못다루는 이유는 자바스크립트 실력이 부족해서라고 한다. 이전에 읽었던 자바스크립트 코딩의 기술에서 읽었던 깔끔한 함수형 코드를 짜기위한 방법들을 정리하고 적용해보려고 한다.

 

배열 메서드 or 배열을 반환하는 메서드

filter :  데이터의 형태를 변하지 않고 컬렉션의 길이는변경하고 싶을때

map:  컬렉션의 길이는 변하지 않고 데이터의 형태를 변경하고 싶을때 

reduce: 컬렉션의 길이와 형태를 모두 변경하고 싶을 때 ( 초기값에 따라 컬렉션을 반환받을 수도 있다.)

Object.keys() -> 객체의 키에 해당하는 배열을 반환한다.

Object.entries() -> 객체의 key-value쌍에 해당하는 2차원 배열을 반환한다.

 

특수한 컬렉션

Map(배열메서드 맵 말고) -> 객체와 달리 key-value 데이터를 순회할 수 있다.

Set -> 중복된 값을 제거해서 고윳값을 관리할 수 있따.

 

조건문을 깔끔하게 작성하기

어수선한 if문을 줄이려면?

삼항연산자를 활용하기

단락평가를 활용해서 조건문을 축약하기

거짓으로 평가되는 값들을 단락평가로 간단하게 줄일 수 있다.

거짓으로 평가되는 값들

-> false, null, 0, NaN, '', ""

단락평가

|| && 를 이용해 우리가 원하는 값을 걸러내는 조건으로 이용할 수 있다.

exp1 || exp2 → 둘중 참인 표현식 반환

exp1이 참이면 exp1반환, exp2이 참이면 exp2반환

exp1 && exp2 → exp1이 거짓이면 exp1반환, 둘다 거짓이면 exp2반환

 

매개변수와 return문을 깔끔하게 정리하기

매개변수에 명시적으로 기본값을 넣어줄 수 있다.

구조분해할당으로 객체속성에 접근하기

나머지 매개변수로 여러개의 인수를 손쉽게 전달할 수 있다.

 

뒷부분을 조금 남기고 아직 못읽은 부분이 있는데, 이번주간은 리액트와 함께 못다읽은 자바스크립트 책을 읽으면서 코드에 적용해보자.