전체 글

공부한거 기록하는 블로그입니다!!
프로그래밍 언어/JavaScript

[자바스크립트 필기] #15 - this란?

*이 필기는 웹 프로그래밍 튜토리얼에서 보고 작성합니다. 1. this 키워드 this는 자신이 속한 객체 또는 자신이 생성할 인스턴스를 가리키는 자기 참조 변수이다. 이걸로 프로퍼티와 메서드를 참조할 수 있다. 그렇다면 이 this가 가리키는 값은 어떻게 결정될까 바로 함수 호출 방식에 따라서 결정된다. 2. 함수 호출 방식과 this 바인딩 아까 말했듯이, this 바인딩은 함수 호출 방식 즉 함수가 어떻게 호출되었는지에 따라 동적으로 결정된다. 그러면 함수 호출 방식은 어떻게 되어있는지 보자. 일반 함수 호출 메서드 호출 생성자 함수 호출 Function.prototype.apply/call/bind 메서드에 의한 간접 호출 일반 함수 호출 기본적으로 this에는 전역 객체가 바인딩된다. 그리고 일..

프로그래밍 언어/JavaScript

[자바스크립트 필기] #14 - 빌트인 객체

*이 필기는 웹 프로그래밍 튜토리얼에서 보고 작성합니다. 1. 자바스크립트 객체의 분류 표준 빌트인 객체 : 자바스크립트 환경에 관계없이 공통적으로 기능을 제공한다. 호스트 객체 : 자바스크립트 환경에 따라서 추가적으로 제공하는 객체들을 말한다. 사용자 정의 객체 2. 표준 빌트인 객체 자바스크립트에는 40여 개의 표준 빌트인 객체가 제공되는데 여기서 Math, Reflect, JSON을 제외한 객체들은 모두 인스턴스를 생성할 수 있는 생성자 함수이다. 그리고 표준 빌트인 객체가 생성한 인스턴스의 프로토타입은 표준 빌트인 객체의 prototype 프로퍼티에 바인딩된 객체이다. ex) String으로 만든 인스턴스의 프로토타입은 String.prototype 3. 원시값과 래퍼 객체 왜 문자열이나 숫자 등..

프로그래밍 언어/JavaScript

[자바스크립트 필기] #13 - 프로토타입

*이 필기는 웹 프로그래밍 튜토리얼에서 보고 작성합니다. 1. 상속과 프로토타입 상속은 객체지향 프로그래밍의 핵심 개념으로, 객체의 프로퍼티나 메서드를 다른 객체가 받아서 그대로 사용할 수 있는 것을 말한다. 그리고 자바스크립트에서는 프로토타입을 통해 상속을 구현하는데, 이를 통해 불필요한 중복을 줄일 수 있다. // 생성자 함수 function Circle(radius) { this.radius = radius; } // Circle 생성자 함수가 생성한 모든 인스턴스가 getArea 메서드를 // 공유해서 사용할 수 있도록 프로토타입에 추가한다. // 프로토타입은 Circle 생성자 함수의 prototype 프로퍼티에 바인딩되어 있다. Circle.prototype.getArea = function ..

프로그래밍 언어/JavaScript

[자바스크립트 필기] #12 - 함수와 일급 객체

*이 필기는 웹 프로그래밍 튜토리얼에서 보고 작성합니다. 1. 일급 객체 다음 조건을 만족하는 객체를 일급 객체라 한다. 무명의 리터럴로 생성 가능 - 즉, 런타임에 생성 가능 변수나 자료구조(객체, 배열 등)에 저장할 수 있음 함수의 매개변수에 전달할 수 있음 - 가장 큰 특징 함수의 반환값으로 사용 가능 // 함수는 무명의 리터럴로 생성할 수 있다. // 함수는 변수에 저장할 수 있다. const increase = function (num) { return ++num; }; // 함수는 객체에 저장할 수 있다. const predicates = { increase }; // 함수의 매개변수에 전달할 수 있다. // 함수의 반환값으로 사용할 수 있다. function makeCounter(predic..

프로그래밍 언어/JavaScript

[자바스크립트 필기] #11 - 생성자 함수와 객체 생성

*이 필기는 웹 프로그래밍 튜토리얼에서 보고 작성합니다. 1. Object 생성자 함수 new 연산자와 함께 Object 생성자 함수를 호출하면 빈 객체를 생성하여 반환한다. 이후 프로퍼티와 메서드를 추가하면 객체를 완성할 수 있다. const person = new Object(); person.name = 'Lee'; person.sayHello = function () { console.log('Hello!'); }; 생성자 함수 : new 연산자와 함께 호출하여 객체(인스턴스)를 생성하는 함수를 말한다. 인스턴스 : 생성자 함수에 의해 생성된 객체를 말한다. Object 생성자 함수 말고도 많은 생성자 함수들이 있다. 무조건 Object 생성자 함수를 써야하는건 아니고 객체 리터럴을 쓰는 것이 더..

프로그래밍 언어/JavaScript

[자바스크립트 필기] #10 - let, const 키워드

*이 필기는 웹 프로그래밍 튜토리얼에서 보고 작성합니다. 1. var 키워드로 선언한 변수의 문제점 변수 중복 선언 허용 함수 레벨 스코프 - 함수 레벨 스코프는 전역 변수를 남발할 가능성을 높임 변수 호이스팅 - 변수 호이스팅으로 인해 변수 선언문이 스코프의 선두로 끌어 올려진 것처럼 동작함. 2. let 키워드 변수 중복 선언 금지 - let 키워드로 중복 선언을 하면 문법 에러가 발생함 블록 레벨 스코프 - 코드 블록(함수, if 문, for 문, while 문, try/catch 문 등)을 지역 스코프로 인정하는 블록 레벨 스코프를 따른다. 변수 호이스팅 - let 키워드에서는 변수 호이스팅이 발생하지 않는 것처럼 동작한다. console.log(foo); // foo is not defined ..

프로그래밍 언어/JavaScript

[자바스크립트 필기] #9 - 전역 변수의 문제점

*이 필기는 웹 프로그래밍 튜토리얼에서 보고 작성합니다. 1. 변수의 생명 주기 변수는 생성되고 소멸되는 생명 주기가 있다. 전역 변수의 생명 주기는 프로그램의 생명 주기와 같다. 즉, 프로그램이 끝날 때 전역 변수도 끝난다는 말이다. 함수 내부에서 선언된 지역 변수는 함수가 호출되면 생성되고 함수가 종료되면 소멸된다. - 지역 변수의 생명주기는 함수의 생명주기와 같다. 그리고 다음의 예제를 보자 var x = 'global'; function foo() { console.log(x); // ?? var x = 'local'; } foo(); console.log(x); // global 여기서 foo 함수 내부에서 console.log(x) 를 실행하기 전에 지역변수 x가 이미 선언되었고 undefin..

프로그래밍 언어/JavaScript

[자바스크립트 필기] #8 - 스코프

*이 필기는 웹 프로그래밍 튜토리얼에서 보고 작성합니다. 1. 스코프란? 우리는 이를 함수에서 경험하였는데 함수의 매개변수는 함수 몸체 내부에서만 사용할 수 있고 외부에서는 사용할 수 없다. 따라서 함수 매개변수의 스코프는 함수 몸체로 제한된 것이다. 변수 이름을 비롯한 모든 식별자는 선언된 위치에 따라서 식별자를 참조할 수 있는 유효 범위가 결정되는데 이를 스코프라고 한다. 2. 스코프의 종류 구분 설명 스코프 변수 전역 코드의 가장 바깥 영역 전역 스코프 전역 변수 지역 함수 몸체 내부 지역 스코프 지역 변수 전역 변수는 어디서든지 참조할 수 있다. 지역 변수는 자신의 지역 스코프와 하위 지역 스코프에서 유효하다. 3. 스코프 체인 함수는 중첩될 수 있으므로, 지역 스코프 또한 중첩될 수 있다. 따라..

SpaceCowboy
공부한거 기록하는 블로그