본문 바로가기

자바스크립트41

자바스크립트 배열 관련 API 와 예제들 배열에 대해 잘 몰랐던 부분: 1. 배열에 프로퍼티를 만들 수 있다. const arr = [];// 배열에 요소(element) 추가arr[0] = 1;arr['1'] = 2;// 프로퍼티 추가 (배열도 객체에 속하기 때문에 아래와 같이 프로퍼티를 추가할 수 있다.)arr['foo'] = 3;arr.bar = 4;arr[1.1] = 5;arr[-1] = 6;console.log(arr) // [1, 2, foo: 3, bar: 4, 1.1: 5, -1: 6], 배열의 length 는 2 이다.  2. 배열에서 delete 연산자를 사용할 수 있다. const arr = [1, 2, 3];delete arr[1];console.log(arr) // [1, empty, 3], 배열의 length 는 3이다.. 2024. 6. 10.
(내용무) 인스턴스의 이름 가져오기 → instance.constructor.name 2023. 10. 13.
bind 함수 구현 우연히 유튜브 영상을 시청 중 유튜버 바닐라코딩님의 영상 중 "라이브 코딩 테스트 'Bind 함수' 구현이라는 영상을 보게되었다.https://youtu.be/xR2YkQxOtI4  ■ 문제 function bind(fn, context){ // TODO...}const obj = { title: "vaco" };function logTitle(){ console.log(this.title)}const fn = bind(logTitle, obj); ■ 정답#1 function bind(func, context){ return () => func.call(context);}function myFunc(){ console.log("text: " + this.text);}const obj = { t.. 2022. 12. 23.
실행컨텍스트(Excution Context) ■ 실행컨텍스트 정의 코드를 실행하는데 필요한 환경을 제공하는 객체 환경: 코드 실행에 영향을 주는 조건이나 상태 ■ 실행컨텍스트 특징 - 자바스크립트 엔진은 stack이라는 자료구조를 사용해 실행컨텍스트의 실행순서를 결정한다. ■ 실행컨텍스트 종류 (대표적인 것) - 전역 실행컨텍스트 (Global Excution Context) - 함수 실행컨텍스트 (Function Excution Context) *아래 그림참고 ■ 실행컨텍스트의 구성 1. 렉시컬 환경 (Lexical Environment) ㄴ 2-1. 함수 환경 레코드 ㄴ 2-1. 전역 환경 레코드 (Global Environment Record) ㄴ 4-1. 객체 환경 레코드 (Object Environment Record) ㄴ 4-2. 선언적.. 2022. 11. 29.
반복문의 동기적(for), 비동기적(forEach, map) 처리 구분 두개 모두 같은 목적으로 작성된 코드이다. 하지만 결과는 다르다. forEach 또는 map 함수로 비동기코드를 호출해 tempArray라는 빈 배열에 비동기 코드의 결과값을 담려고했다. 결과를 먼저 보자면... forEach 또는 map, 해당 배열과 관련된 매서드를 사용해 비동기 코드를 반복시켰을때 console.log가 먼저 실행되고, for 반복문을 실행시켰을때는 내가 원하는데로 작동이되었다. forEach와 map은 비동기로 작동된다. 하지만 for문은 동기식이기 때문에 그렇다. 만약 for문 안에서 어떠한 오류가 발생될 경우 순차적으로 코드를 작동시키는 동기식이기 때문에 오류가 감지되는 즉시 스크립트는 다음 코드로 실행되지 않는다. 만약 반복문 다음에 중요한 코드가 있다면 이는 문제가 될 수 .. 2022. 9. 30.
Deep, Shallow comparison (깊은, 얕은 비교 / mutable, immutable) 데이터의 종류는 크게 두가지이다.원시타입(Primitive type) vs 객체타입(Object type) const pA = "chanki"const pB = "chanki"pA === pB // true 하지만... const oA = { name: "chanki" }const oB = { name: "chanki" } oA === oB // false 원시타입은 변수에 값이 그대로 할당되고 메모리에 저장되지만 객체타입은 너무 크기때문에 조금 더 복잡한 형태로 메모리에 저장된다.객체타입은 메모리에 바로 할당되는 것이 아니라 메모리안의 어떤 공간에 저장되어 주소가 할당된다. 그렇기 때문에 oA와 oB를 비교했을때 값을 비교한 것이 아니라 메모리의 주소를 비교하게된 것이기 때문에 false라는 결과가 나.. 2022. 9. 22.

티스토리툴바