일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
- 스프링부트
- 코멘토 #코멘토실무PT #실무PT후기 #실무강의 #리액트강의 #웹프로그래밍 #react #웹개발실무
- 유효시간 설정 url
- bucket4j
- redis
- 프론트엔드
- 프론트엔드 과제
- 프로그래머스
- 프리코스
- 우아한테크코스
- oauth
- NestJS
- 자바스크립트
- AWS
- this
- 음악 url 파일 다운로드
- 파일 url
- api 비동기처리
- api 요청 수 제한
- invalid_grant
- 검색
- 모던 자바스크립트
- compateto
- 딥다이브
- 우아한 테크코스
- concurrency limit
- Deep Dive
- Dev-Matching
- 타입스크립트
- TypeORM
- Today
- Total
목록학습일지/모던 자바스크립트 Deep Dive (19)
개발 알다가도 모르겠네요
특정 패턴과 일치하는 문자열을 검색, 추출, 치환할 수 있는 기능 정규 표현식 생성 정규 표현식 리터럴과 RegExp 생성자 함수를 사용하는 방법 2가지가 존재 일반적으로 정규 표현식 리터럴을 사용한다. 정규 표현식 리터럴은 패턴과 플래그로 구성 RegExp 메서드 RegExp.prototype.exec 메서드 인수로 전달받은 문자열에 대해 정규 표현식의 패턴을 검색하여 매칭 결과를 배열로 반환 매칭 결과가 없는 경우 null 반환 g 플래그를 지정해도 첫 번째 매칭 결과만 반환하므로 주의 필요 const target = "Is this all there is?"; const regExp = /is/; console.log(regExp.exec(target)); // [ 'is', index: 5, in..
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 프로퍼티를 동적 생성한다. - 생성된 전역 객..
this 는 자신이 속한 객체 또는 자신이 생성할 인스턴스를 가리키는 자기 참조 변수(self-referencing variable) this 를 통해 자신이 속한 객체 또는 자신이 생성할 인스턴스의 프로퍼티나 메서드를 참조할 수 있음. this 는 자바스크립트 엔진에 의해 암묵적으로 생성. [ 💡 this 바인딩 ] + 바인딩(binding) : 식별자와 값을 연결하는 과정 + this 바인딩 : this와 this가 가리킬 객체를 바인딩하는 것 객체 리터럴의 메서드 내부에서 this는 메서드를 호출한 객체. // 객체 리터럴 const circle = { radius: 5, getDiameter() { // 여기서 this 는 메서드를 호출한 객체 return 2 * this.radius; }, };..
자바스크립트 객체는 크게, 3가지 객체로 분류됨. 표준 빌트인 객체 : ECMAScript 사양에 정의된 객체를 의미, 애플리케이션 전역에 공통 기능을 제공, 전역 객체의 프로퍼티로 제공되므로 별도의 선언 없이 전역 변수처럼 언제나 참조가능 호스트 객체 : ECMAScript 사양에 정의되어 있지는 않지만, 브라우저 환경 or Node.js 환경에서 추가로 제공하는 객체를 의미 사용자 정의 객체 : 사용자가 직접 정의한 객체를 의미 표준 빌트인 객체 표준 빌트인 객체는 인스턴스를 생성할 수 있는 생성자 함수 객체. 자바스크립트는 Object, String, Number, Boolean, Symbol, Array, Map/Set, Function 등 40여 개의 표준 빌트인 객체를 제공 프로토타입 메서드와..
객체지향 프로그래밍 객체(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 }; // 함수는 ..
생성자 함수(constructor) : new 연산자 와 함께 호출하여 객체(인스턴스)를 생성하는 함수 인스턴스(instance) : 생성자 함수에 의해 생성된 객체 자바스크립트에서는 Object 생성자 함수 이외에도 String, Number, Boolean, Function, Array, Date, RegExp, Promise 등의 빌드인(built-in) 생성자 함수를 제공 객체 리터럴({ })에 의한 객체 생성 방식의 문제점 자바스크립트에서 객체를 생성하는 방법 중, 객체 리터럴({ ... }) 에 의한 객체 생성 방식은 직관적이고 간편하다. 단, 객체 리터럴에 의한 객체 생성 방식은 단 하나의 객체만 생성 const person1 = { name: "WI", getPersonName() { re..
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 는 함수 레벨 스코프 // 고로,..
변수도 생명 주기(life cycle) 가 있음. 변수는 선언에 의해 생성 → 할당을 통해 값을 갖음 → 언젠가는 소멸 변수에 생명주기가 없다면 한번 선언된 변수는 프로그램을 종료하지 않는 한 영원히 메모리 공간을 점유하게 된다. 지역변수 생명 주기 지역 변수의 생명 주기는 함수의 생명 주기와 일치 즉, 함수가 호출되어 실행되는 동안에만 유효. function foo() { var x = "local"; console.log(x); // local return x; } foo(); console.log(x); // ReferenceError: x is not defined