자바스크립트 48

[js 딥다이브] 30장 Date

Date Date 생성자 함수 new Date(밀리초) //서버의 시간 기준이 UTC인지 KST에 따라 사용에 주의할 것 new Date(86400000); new Date(24 * 60 * 60 * 1000); //시간, 분, 초, ms로 나눠서 기록 new Date(문자열) new Date('2020/03/26/10:00:00'); //KST (node에서는 설정따라) new Date(년월일…) new Date(2020, 2, 26, 10, 00, 00, 0); //KST (node에서는 설정따라) Date 메서드 Date.now UTC 기준(1970년 1월 1일 00:00:00)부터 현재시간까지의 밀리초 Data.parse UTC 기준(1970년 1월 1일 00:00:00)부터 전달된 지정시간(문자..

[js 딥다이브] 29장 Math

Math Math.PI 원주율 반환 Math 메서드 Math.abs 절대값 반환(0 또는 양수) Math.round 반올림 Math.ceil 올림 Math.floor 내림 Math.sqrt 제곱근 Math.random 0~1 미만의 실수 const random = Math.floor((Math.random() * 10) + 1); console.log(random); // 1에서 10 범위의 정수 Math.pow 두번째 인수를 지수로 거듭제곱한 결과 반환 //ES7 지수 연산자가 보기 더 좋음 2 ** 2 ** 2; //16 Math.max 최대값 Math.min 최소값

[js 딥다이브] 27장 배열

배열 배열이란? 자바스크립트의 모든 값을 배열의 요소가 될 수 있음. 배열은 객체타입 일반 객체와 배열을 구분하는 가장 명확한 차이는 '값의 순서’와 ‘length’ 프로퍼티 자바스크립트 배열은 배열이 아니다 해시 테이블로 구현된 객체이다. 모던 자바스크립트 엔진은 배열을 일반 객체와 구별하여 좀 더 배열처럼 동작하도록 최적화가 되어있다. (일반객체보다 더 빠르다는 이야기) length 프로퍼티와 희소 배열 length 값보다 작은 숫자를 할당하면 배열의 크기가 줄어듬 반대로 큰 숫자를 할당해도 크기가 늘어나진 않음. const sparse = [, 2, , 4]; // 희소 배열의 length 프로퍼티 값은 요소의 개수와 일치하지 않는다. console.log(sparse.length); // 4 co..

[js 딥다이브] 28장 Number

7주차 number number 프로퍼티 EPSILON 부동소수점 연산에 활용. 기존 곱하기, round등을 활용한 방법보다 정확 function isEqual(a, b){ // a와 b를 뺀 값의 절대값이 Number.EPSILON보다 작으면 같은 수로 인정한다. return Math.abs(a - b) < Number.EPSILON; } isEqual(0.1 + 0.2, 0.3); // true number 메서드 Number.isFinite 유한수인지 검사. Number.isInteger 정수인지 검사. Number.isSafeInteger 안전한 정수인지 검사. 안전한 정수값은 -(2^53 - 1)과 2^53 - 1 사이의 정수값이다. EEE-754 배정도수 형태로 정확히 표현될 수 있는 수이고 ..

[js 딥다이브] 26장 ES6 함수의 추가 기능

ES6 함수의 추가 기능 함수의 구분 ES6 함수의 구분 constructor prototype super arguments 일반 함수(Normal) ◯ ◯ ✕ ◯ 메서드(Method) ✕ ✕ ◯ ◯ 화살표 함수(Arrow) ✕ ✕ ✕ ✕ 결론 : 불필요한 prototype을 없애는게 성능면에서 이득 메서드 메서드 축약 표현으로 정의된 함수만을 의미. 메서드는 생성자 함수로 호출할 수 없음. 자신을 바인딩한 객체를 가리키는 내부 슬롯 HomeObject를 갖는다. 메서드가 아닌 함수는 HomeObject가 없기때문에 super키워드를 사용할 수 없음. const obj = { x: 1, foo() { //foo는 메서드 return this.x; }, bar: function() { //bar는 일반 함..

[js 딥다이브] 25장 클래스

6주차 클래스 클래스는 프로토타입의 문법적 설탕인가? 클래스 생성자 함수 new 연산자 없이 호출 불가능 일반함수로 호출 extend, super 제공 미제공 호이스팅X처럼 동작 함수 선언문이면 함수 호이스팅, 함수 표현식은 변수 호이스팅 암묵적 strict mode 암묵적 strict mode 없음 constructor, 프로토타입 메서드, 정적 메서드는 Emuerable값이 flase, 즉 열거되지 않음 클래스 정의 일급 객체임. 클래스 호이스팅 클래스는 함수로 평가됨 class Person {} console.log(typeof Person); 호이스팅이 발생하나 let, const처럼 일시적 사각시대가 있음 인스턴스 생성 클래스는 생성자 함수이며 new 연산자와 함께 호출 class Person ..

[js 딥다이브] 24장 클로저

클로저 정의 - 함수와 함수가 선언된 렉시컬 환경과의 조합 렉시컬 스코프 렉시컬 환경의 “외부 렉시컬 환경에 대한 참조”에 저장할 참조값, 즉 상위 스코프에 대한 참조는 함수 정의가 평가되는 시점에 함수가 정의된 환경(위치)에 의해 결정된다. 이것이 바로 렉시컬 스코프다. 함수 객체의 내부 슬롯 함수가 정의된 환경(위치)과 호출되는 환경(위치)은 다를 수 있다. 함수는 자신의 내부 슬롯 Environment에 자신이 정의된 환경, 즉 상위 스코프의 참조를 저장한다. 클로저와 렉시컬 환경 외부 함수보다 중첩 함수가 더 오래 유지되는 경우 중첩 함수는 이미 생명 주기가 종료한 외부 함수의 변수를 참조할 수 있다. 이러한 중첩 함수를 클로저closure라고 부른다. const x = 1; // ① functi..

[js 딥다이브] 23장 실행 컨텍스트

실행 컨텍스트 소스코드의 타입 타입 설명 전역코드 최상위 전역 스코프 생성. var와 전역함수를 전역객체의 프로퍼티와 메서드로 바인딩 함수코드 지역 스코프 생성. 지역변수, 매개변수, arguments를 관리. 생성한 지역 스크로를 전역스코프에서 시작하는 스코프 체인에 연결. eval코드 독자적인 스코프 생성. 이하 생략 모듈 코드 모듈별로 독립적인 모듈 스코프 생성. 모듈 내부의 함수, 클래스등의 내부 코드는 포함되지 않는다. 각각의 코드가 평가되면 실행 컨텍스트가 생성된다. 소스코드의 평가와 실행 소스코드의 평가와 실행 2단계로 나뉨. 평가과정 실행 컨텍스트 생성. 변수, 함수의 선언문만 먼저 실행하여 생성된 변수와 함수 식별자를 키로 실행 컨텍스트의 스코프에 등록한다. 실행 평가과정이 끝나면 선언문..

[js 딥다이브] 22장 this

this this 키워드 this는 자신이 속한 객체 또는 자신이 생성할 인스턴스를 가리키는 자기 참조 변수self-referencing variable다. this를 통해 자신이 속한 객체 또는 자신이 생성할 인스턴스의 프로퍼티나 메서드를 참조할 수 있다. this가 가리키는 값, 즉 this 바인딩은 함수 호출 방식에 의해 동적으로 결정된다. // 객체 리터럴 const circle = { radius: 5, getDiameter() { // this는 메서드를 호출한 객체를 가리킨다. return 2 * this.radius; } }; // 생성자 함수 function Circle(radius) { // this는 생성자 함수가 생성할 인스턴스를 가리킨다. this.radius = radius; }..

[js 딥다이브] 21장 빌트인 객체

21 빌트인 객체 표준 빌트인 객체 모든 js 환경 호스트 객체 브라우저 또는 node 제공 사용자 객체 사용자가 정의한 객체 표준 빌트인 객체 Math, Reflect, JSON를 제외한 표준 빌트인 객체는 인스턴스를 생성할 수 있는 생성자 함수 객체 원시값과 래퍼 객체 원시값에 .으로 접근시 래퍼 객체(임시) 생성 래퍼 객체의 처리가 종료되면 가비지 컬렉션의 대상이 됨 전역 객체 브라우저 node window, self, this 등 global //ES11 이상 // 브라우저 환경 globalThis === this // true globalThis === window // true globalThis === self // true globalThis === frames // true // Node..

728x90