일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | ||
6 | 7 | 8 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 | 21 | 22 | 23 | 24 | 25 | 26 |
27 | 28 | 29 | 30 |
- 우아한테크코스
- 우아한 테크코스
- compateto
- Dev-Matching
- 프리코스
- Deep Dive
- 검색
- bucket4j
- 모던 자바스크립트
- 유효시간 설정 url
- 스프링부트
- api 요청 수 제한
- redis
- 파일 url
- invalid_grant
- 프론트엔드
- concurrency limit
- 프론트엔드 과제
- oauth
- 코멘토 #코멘토실무PT #실무PT후기 #실무강의 #리액트강의 #웹프로그래밍 #react #웹개발실무
- NestJS
- TypeORM
- 음악 url 파일 다운로드
- api 비동기처리
- 프로그래머스
- AWS
- this
- 타입스크립트
- 자바스크립트
- 딥다이브
- Today
- Total
목록모던 자바스크립트 (14)
개발 알다가도 모르겠네요
ES6 이후 에는 함수를 사용 목적에 따라 명확히 세 가지 종류로 구분 ES6 함수의 구분 constructor prototype super arguments 일반 함수 O O X O 메서드 X X O O 화살표 함수 X X X X 메서드 ES6 이후 , 메서드는 메서드 축약 표현으로 정의된 함수만을 의미 const obj = { x: 1, // foo는 ES6 기준, 메서드다. foo() { return this.x; }, // bar는 ES6 기준, 메서드가 아니다. bar: function () { return this.x; }, }; console.log(obj.foo()); // 1 console.log(obj.bar()); // 1 ES6 메서드 는 인스턴스를 생성할 수 없는 non-const..
암묵적 전역 다음은 use strict 모드를 반영하지 않았을 경우, 우리가 아는 일반적인 자바스크립트 작동 방식. → 암묵적 전역 현상 이는, 개발자의 의도와는 상관없는 다양한 오류를 발생시키는 원인이 될 가능성이 큼. 따라서, 반드시 ES6 에 도입된 const, let 키워드를 사용하여 변수를 선언한 다음 사용하는 것이 일반적 function foo() { x = 10; } foo(); console.log(x); // 10 /* - foo 함수가 실행 - foo 함수 내부에서 x를 선언한 것은 없기 때문에, 스코프 체인에 의해 변수 x를 검색한다. - 전역 스코프까지와 왔지만, x는 존재하지 않는다. -> 자바스크립트 엔진은 암묵적으로 전역 객체에 x 프로퍼티를 동적 생성한다. - 생성된 전역 객..

객체지향 프로그래밍 객체(object)의 집합 으로 프로그램을 표현하는 것. 실세계의 실체를 인식하는 철학적 사고를 프로그래밍에 반영한 것 추상화 추상화(abstraction) : 객체의 다양한 속성 중에서 프로그램에 필요한 속성만 간추려 내여 표현하는 것 객체에는 크게 2가지 요소로 구성 상태를 나타내는 프로퍼티 상태를 조작하는 행동을 표현하는 메서드 // person 이라는 객체 // "name(이름)", "address(주소)"라는 속성(property)으로 표현하도록 가정 const person = { name: "WI", address: "Incheon", }; // circle 이라는 객체 const circle = { // 원의 반지름 프로퍼티(상태) radius: 5, // 원의 지름을 구..
일급 객체 조건 무명의 리터럴로 생성할 수 있다. 즉, 런타임에 생성이 가능하다. 변수나 자료구조(객체, 배열 등)에 저장할 수 있다. 함수의 매객변수에 전달할 수 있다. 함수의 반환값으로 사용할 수 있다. // 함수는 무명 리터럴로 생성가능 // 함수는 변수에 저장 가능 // 런타임 시점에 함수 리터럴이 평가되어 함수 객체가 생성되고 변수에 할당 된다.(정확히는 함수 객체의 참조값이 할당 된다.) const increase = function (num) { return ++num; }; const decrease = function (num) { return --num; }; // 함수는 객체에 저장할 수 있다. const predicate = { increase, decrease }; // 함수는 ..

var 키워드 문제점 1. 변수 중복 선언 허용 var x = 1; // x변수 선언 & 초기화 동시에 var y = 1; // y변수 선언 & 초기화 동시에 var x = 100; // 선언 문 O, 초기화 문도 X var y; // 선언 문은 O, 초기화 문이 X (암묵적 무시) console.log(x); // 100 console.log(y); // 1 2. 함수 레벨 스코프 함수 외부에서 var 키워드로 선언한 변수는 코드 블록 내에서 선언해도 모두 전역 변수가 된다. → 함수 레벨 스코프함수 레벨 스코프는 전역 변수를 남발할 가능성을 높인다. → 의도치 않게 전역 변수가 중복 선언되는 경우가 발생 var x = 1; // 코드 블록(블록 레벨), 하지만 var 는 함수 레벨 스코프 // 고로,..

스코프(scope)란? 식별자(identifier)가 유효한 범위 (자바스크립트 엔진이 식별자를 검색할 때 사용하는 규칙) var var1 = 1; // 코드의 가장 바깥 영역에서 선언한 변수 if (true) { var var2 = 2; // 코드 블록 내에서 선언한 변수 if (true) { var var3 = 3; // 중첩된 코드 블록 내에서 선언한 변수 } } function foo() { var var4 = 4; // 함수 내에서 선언한 변수 function bar() { var var5 = 5; // 중첩된 함수 내에서 선언한 변수 } } console.log(var1); // 1 console.log(var2); // 2 console.log(var3); // 3 console.log(va..

실행 컨텍스트(execution context)는 자바스크립트의 동작 원리를 담고 있는 핵심 개념. 실행 컨텍스트를 바르게 이해하면 아래 이해 가능. 자바스크립트가 스코프 기반으로 식별자와 식별자 바인딩(식별자에 바인딩 된 값)을 관리하는 방식과 호이스팅이 발생하는 이유 클로저의 동작 방식 태스크 큐와 함께 동작하는 이벤트 핸들러와 비동기 처리의 동작 방식 소스코드의 타입 ECMAScript 사양은 소스코드(ECMAScript Code)를 4가지 타입으로 구분. 4가지 타입의 소스 코드는 실행 컨텍스트를 생성. 소스코드를 4가지로 구분하는 이유는 소스코드의 타입에 따라 실행 컨텍스트를 생성하는 과정과 관리 내용이 다르기 때문. 전역 코드 global code 전역에 존재하는 소스코드. 전역에 정의된 함수..

코드의 재사용 동일한 작업을 반복적으로 수행하는 코드를 함수로 만들어 사용하는 것이 효율적. 유지보수 편의성 & 코드의 신뢰성 같은 코드의 중복으로 인한 수정에 걸리는 시간과 사람의 실수를 억제하고 재사용성을 높일 수 있음. 코드의 가독성 함수는 객체 타입의 값. 적절한 함수 이름은 함수 내부 코드를 이해하지 않고도 함수의 역할을 파악할 수 있게 돕고, 이는 코드의 가독성을 향상시킴. // 변수에 "함수 리터럴"을 할당 var f = function add(x, y) { return x + y; }; 리터럴(literal) 은 문자 or 약속된 기호를 사용해 값을 생성하는 표기 방식. 위에 코드는 함수 리터럴 을 변수에 할당 한 것. 즉, 함수 리터럴도 평가되어 값을 생성하며, 이 값은 객체(object..

1. 원시 타입의 값 === 원시 값 은 변경 불가능한 값(immutable value) 객체 타입의 값 === 객체 는 변경 가능한 값(mutable value) 2. 원시 값을 변수에 할당하면 변수(확보된 메모리 공간)에는 실제 값이 저장. 객체를 변수에 할당하면 변수(확보된 메모리 공간)에는 참조 값이 저장. 3. 원시 값을 갖는 변수를 다른 변수에 할당하면 원시 값이 복사되어 전달 → 값에 의한 전달(pass by value) 객체를 가리키는 변수를 다른 변수에 할당하면 원본의 참조 값이 복사되어 전달 → 참조에 의한 전달(pass by reference) 원시 값 원시 값은 변경 불가능한 값(immutable value) == 읽기 전용(read only) 값 변경 불가능하다. 변수는 하나의 ..

객체란? 원시 값: 변경 불가능한 값 (immutable value) 객체 값: 변경 가능한 값 (mutable value) 프로퍼티: 객체의 상태를 나타내는 값. 메서드: 프로퍼티를 참조하고 조작할 수 있는 동작. (프로퍼티 값이 함수일 경우 일반 함수와 구분하기 위해 메서드라 부름) 프로퍼티 접근 마침표 프로퍼티 접근연산자(.)를 사용하는 마침표 표기법 대괄호 프로퍼티 접근 연산자([...])를 사용하는 대괄호 표기법 var person = { name: 'Lee' } //마침표 표기법에 의한 프로퍼티 접근 console.log(person.name); //대괄호 표기법에 의한 프로퍼티 접근 console.log(person['name']); person.last-name 에서 Node.js 환경과 ..