profile
블로그 이사 🚚 https://wonsss.github.io/
태그 목록
전체보기 (95)자바스크립트(32)자료구조(13)클린코드(13)알고리즘(12)회고(10)우테코(9)React(6)정렬 알고리즘(4)DOM(4)개발이랑은 딱히 상관없는 그냥 한 주 이야기(4)TIL(3)우아한테크코스(3)array.length(2)nodejs(2)DFS(2)너비우선탐색(2)stack(2)queue(2)JavaScript(2)구조분해할당(2)git(2)퀵소트(2)깊이우선탐색(2)재귀함수(2)트리(2)BFS(2)우선순위 큐(2)insertAdjacentHTML(1)선입선출(1)virtual DOM(1)타입 검사(1)객체 변경 방지 메서드(1)object(1)배열(1)Manifest(1)동등 연산자(1)이벤트 위임(1)비차단(1)proto(1)크롬익스텐션(1)else if(1)순수함수(1)불변성(1)코드컨벤션(1)선택 정렬(1)참같은값(1)컴포넌트 합성(1)ReactDOM(1)싱글스레드(1)이벤트루프(1)Graph(1)radix sort(1)stopPropagation(1)거짓같은값(1)애자일(1)eqeqeq(1)해시(1)해시맵(1)priority queue(1)heap(1)프로미스(1)그래프 순회(1)단축평가(1)함수형 프로그래밍(1)객체(1)제너레이터(1)이중 연결 리스트(1)시간복잡도(1)커스텀 이벤트(1)null 병합 연산자(1)instanceof(1)버블 정렬(1)reconciliation(1)해시 테이블(1)dijkstra(1)다익스트라(1)라우팅(1)프로토타입(1)비동기반복(1)매개변수(1)CRLF(1)공간복잡도(1)null(1)early-return(1)Prototype(1)이벤트 흐름(1)NaN(1)유사배열객체(1)props drilling(1)고차 함수(1)react redux(1)부정조건문(1)composition(1)getElementsByClassName(1)async(1)비동기(1)코드리뷰(1)책리뷰(1)Document 노드(1)linkedlist(1)&&(1)singly linked list(1)선형 검색(1)LF(1)타입스크립트(1)nodeList(1)typeof(1)this바인딩(1)Element 노드(1)의존성역전원칙(1)prefix-suffix(1)조건문(1)break(1)Node(1)querySelectorAll()(1)continue(1)Object.prototype.toString.call()(1)min-max(1)object.freeze(1)Computed property Name(1)Object.isFrozen()(1)props.children(1)검색 알고리즘(1)OR 연산자(1)배열 고차함수(1)산책(1)async/await(1)이진 힙(1)Big O(1)context(1)삼항연산자(1)tree traversal(1)타입(1)후입선출(1)길 찾기(1)리팩토링(1)this(1)first-last(1)begin-end(1)CSS(1)CSS Module(1)styled components(1)가중 그래프(1)드모르간의 법칙(1)함께 자라기(1)퀵정렬(1)useCallback(1)import 모듈(1)useselector(1)FIFO(1)preventDefault(1)prettierrc(1)기타(1)(1)InnerHTML(1)분기다루기(1)이진 탐색 트리(1)이진 검색(1)appendChild(1)스택(1)array(1)트리구조(1)단일 연결 리스트(1)무방향 그래프(1)클래스 컴포넌트(1)graph traversal(1)캡처링 단계(1)doubly linked list(1)자막번역(1)LIFO(1)재조정(1)환경설정(1)components(1)버블링 단계(1)isNaN(1)for await of(1)lookup table(1)병합 정렬(1)DOM 이벤트(1)일치 연산자(1)다크모드(1)HTMLCollection(1)try catch(1)default case(1)Binary Search Tree(1)그래프(1)Hash Table(1)선언적 프로그래밍(1)Naive String Search(1)인접 리스트(1)(1)동시성(1)else(1)robots(1)삼항조건연산자(1)트리 순회(1)기수 정렬(1)binary heap(1)redux(1)EOL(1)eslintrc(1)Real DOM(1)stopImmediatePropagation()(1)합성(1)vscode(1)노션(1)디버그(1)최적화(1)React.memo(1)경계(1)undefined(1)eqeq(1)
post-thumbnail

[클린코드 JS] 배열의 length와 유사배열객체

1. Array.length Array.length는 배열의 길이보다는 배열의 마지막 인덱스를 의미하는 것에 가깝다. 배열의 길이를 0으로 설정하면 배열이 초기화된다. Array.length의 이러한 특성을 염두하고 주의해서 사용해야 한다. 2. 유사 배열 객체 유사배열객체는 말 그대로 '배열'이 아닌 '객체'이다. 그런데 아래 코드처럼, length 속성과 인덱싱된 요소를 가진 유사배열객체를 Array.from() 메서드를 사용하여 신기하게도 새로운 배열을 만드는 것을 볼 수 있다. 유사 배열 객체 (length 속성과 인덱싱 된 요소를 가진 객체) arguments나 webAPI의 node list 도 유사배열객체다. 유사배열객체는 배열의 고차함수 메서드를 사용할 수 없다. Array.from() 메서드를 통해 배열로 변환해야 배열의 고차함수 메서드를 사용할 수 있다.

2021년 12월 14일
·
0개의 댓글
·
post-thumbnail

[클린코드 JS] 배열 요소에 접근하기

배열 요소에 접근하기 arr[0], arr[1] 처럼 배열의 인덱스로 배열 요소에 접근하는 것은 해당 인덱스가 무엇을 의미하는지 알기 어려워 가독성이 떨어진다. 이를 해결하기 위해, 변수 선언 및 할당시 배열을 구조분해할당을 하여 해당 배열 요소의 역할을 명시적으로 표현할 수 있다. 또는, 함수에서 매개변수로 받을 때부터 구조분해할당을 하는 방법도 있다. dom에서 엘리먼트를 가져올 때 배열 형태로 가지고 오게 되는데 이런 경우에도 위 방법을 활용하면 좋다. 심지어 배열의 요소가 하나라고 하더라도 구조분해할당을 써서 배열 요소의 기능을 명시적으로 표현하는 것이 좋다.

2021년 12월 14일
·
0개의 댓글
·