Programming 271

[코어 JS] 5.2 - 숫자형

5.2 숫자형 숫자형 모던 JS에서 숫자를 나타내는 두가지 자료형 1. 일반적인 숫자는 '배정밀도 부동소수점 숫자(double precision floating number)'로 알려진 64비트 형식의 IEEE-754에 저장 2. 임의의 길이를 가진 정수 BigInt, 일반적인 숫자의 범위 2-53 ~ 253 밖의 숫자 숫자를 입력하는 다양한 방법 let billion = 1000000000; //0의 갯수가 많아서 오류가 생길 수 있음 let billion = 1e9; // 10억, 1과 9개의 0 alert( 7.3e9 ); // 73억 (7,300,000,000) 'e' 의 오른쪽에 오는 수만큼 10의 거듭제곱 1e3 = 1 * 1000 1.23e6 = 1.23 * 1000000 1마이크로초(백만 ..

[코어 JS] 5.1 - 원시값의 메서드

5.1 원시값의 메서드 JS는 원시값(문자열, 숫자 등)을 객체처럼 다룰 수 있게 함 (ex. 메서드 호출) 원시값 vs 객체 원시값 - 원시형 값 - 문자(string), 숫자(number), bigint, 불린(boolean), 심볼(symbol), null, undefined 총 7가지 객체 - 프로퍼티에 다양한 종류의 값 저장 가능 - 대괄호{}를 사용해 생성, 함수도 객체의 일종 함수를 프로퍼티로 저장할 수 있다는 객체의 장점 let john = { name: "John", sayHi: function() { alert("친구야 반갑다!"); } }; john.sayHi(); // 친구야 반갑다! //객체 John //메서드 sayHi JS는 날짜, 오류, HTML 요소 등을 다룰 수 있게 하는..

[코어 JS] 4.8 - 객체를 원시형으로 변환하기

4.8 객체를 원시형으로 변환하기 obj1 + obj2처럼 객체끼리 연산을 하는 경우에 객체->원시값으로 자동형변환 발생 후 연산이 수행됨 1. 객체는 논리 평가 시 true를 반환, 예외x, 따라서 객체는 숫자형이나 문자형으로만 형 변환 발생 2. 숫자형으로의 형 변환은 객체끼리 빼는 연산을 할 때나 수학 관련 함수를 적용할 때 발생 ex) 객체 Date끼리 차감할 때 (date1 - date2) 두 날짜의 시간차이가 반환됨 3. 문자형으로의 형 변환은 대게 alert(obj)같이 객체를 출력할 때 발생 - ToPrimitive 특수 객체 메서드를 사용하여 형변환을 숫자형or문자형 중 원하는대로 조절가능 객체 형 변환은 세 종류로 구분되는데 'hint'(=목표로 하는 자료형)라 불리는 값이 구분 기준 ..

[코어 JS] 4.7 - 심볼형

4.7 심볼형 JS는 객체 프로퍼티 키로 숫자형, 불린형은 불가능하고 오직 문자형과 심볼형만 허용 심볼(symbol) 심볼은 유일한 식별자를 만들고 싶을 때 사용, Symbol()을 사용하여 심볼값 생성 // id는 새로운 심볼이 됩니다. let id = Symbol(); 심볼을 만들 때 심볼 이름이라 불리는 설명을 붙일 수 있음, 디버깅시 유용 // 심볼 id에는 "id"라는 설명이 붙습니다. let id = Symbol("id"); 심볼은 유일성이 보장되는 자료형이므로 설명이 동일한 심볼 여러개를 만들어도 각 심볼값은 다름, 심볼에 붙은 설명(심볼 이름)은 어떤 것에도 영향을 주지않는 이름표 역할 let id1 = Symbol("id"); let id2 = Symbol("id"); alert(id1 ..

[코어 JS] 4.6 - 옵셔널 체이닝 '?.'

4.6 옵셔널 체이닝 '?.' 추가된지 얼마되지않은 문법, 구식 브라우저는 폴리필이 필요함 - 옵셔널 체이닝이 필요한 이유 //1. 여러명의 사용자 중 주소 정보를 가지지않은 사용자가 있을 때 error 발생 let user = {}; // 주소 정보가 없는 사용자 alert(user.address.street); // TypeError: Cannot read property 'street' of undefined //2. 페이지에 존재하지않는 요소에 접근해 요소의 정보를 가져오려할 때 // querySelector(...) 호출 결과가 null인 경우 에러 발생 let html = document.querySelector('.my-element').innerHTML; //?.가 추가되기 전 해결 방법 ..

[코어 JS] 4.5 - 객체: new 연산자와 생성자 함수

4.4 new 연산자와 생성자 함수 복수의 사용자, 메뉴 내 다양한 아이템 객체 표현 등 유사한 객체를 여러개 만들어야 하는 경우 'new' 연산자 - 생성자 함수(constructor function) 1. 함수 이름의 첫 글자는 대문자로 시작 2. 반드시 'new' 연산자를 붙여 실행 function User(name) { this.name = name; this.isAdmin = false; } let user = new User("보라"); alert(user.name); // 보라 alert(user.isAdmin); // false new User()를 사용했을 때 알고리즘 1. 빈 객체를 만들어 this에 할당 2. 함수 본문 실행, this에 새로운 프로퍼티 추가, this 수정 3. th..

[코어 JS] 4.4 - 객체: 메서드와 this

4.4 메서드와 this 객체는 사용자(user), 주문(order) 등과 같이 실제 존재하는 개체(entity)를 표현하고자 할 때 생성 let user = { name: "John", age: 30 }; - 메서드 만들기 let user = { name: "John", age: 30 }; user.sayHi = function() { alert("안녕하세요!"); }; user.sayHi(); // 안녕하세요! //객체 프로퍼티에 할당된 함수 = 메서드(method) //메서드 : user.sayHi(); // 선언된 함수를 메서드로 등록 user.sayHi = sayHi; + 객체 지향 프로그래밍(object-oriented programming, OOP) _ 객체를 사용하여 개체를 표현하는 방식 ..

[코어 JS] 4.3 - 객체: 가비지 컬렉션

4.3 가비지 컬렉션 눈에 보이지 않는 곳에서 메모리 관리를 수행하는 JS가 쓸모없어진 메모리를 처리하는 방법 - 가비지 컬렉션 기준 JS는 도달가능성(reachability- 어떻게든 접근하거나 사용할 수 있는 값) 개념을 사용헤 메모리 관리를 수행 1. 태생부터 도달 가능하여 명백한 이유없이 삭제되지 않는 값 ex) 루트(root) - 현재 함수의 지역 변수와 매개변수 중첩 함수의 체인에 있는 함수에서 사용되는 변수와 매개변수, 전역 변수 등 2. 루트가 참조하는 값, 체이닝으로 루트에서 참조할 수 있는 값은 도달 가능한 값이 됨 ex) 전역 변수에 객체가 저장되어 있을 때, 해당 객체의 프로퍼티가 또 다른 객체를 참조할 경우 프로퍼티가 참조하는 객체는 도달 가능한 값이 됨, 객체가 참조하는 다른 모..

[코어 JS] 4.2 - 객체: 참조에 의한 객체 복사

4.2 참조에 의한 객체 복사 객체와 원시 타입의 근본적인 차이 _ 원시값(문자열, 숫자, 불린값)은 값 그대로 저장, 할당, 복사되는 반면 참조에 의해(by reference)저장, 복사됨 //원시형 let message = "Hello!"; let phrase = message; console.log(message); //Hello console.log(phrase); //Hello //객체형 let user = { name: "John" }; let admin = user; // 참조값을 복사함 admin.name = 'Pete'; //참조 값이 변경됨 alert(user.name); // 'Pete'가 출력됨. 참조 값이 변경되었으므로 'admin' 또한 변경됨 : 변수엔 객체가 그대로 저장되는 ..

[코어 JS] 4.1 - 객체: 기본

4.1 객체 자바스크립트는 일곱가지의 원시형과 한가지의 객체형이 존재 중괄호{ }로 구성된 객체는 "키(key-문자형) : 값(value-자료형)"으로 구성된 프로퍼티로 구성 //빈 객체를 만드는 두가지 방법 let user = new Object(); //'객체 생성자'문법 let user = {}; //'객체 리터럴' 문법 - 리터럴과 프로퍼티 let user = { //객체 name : "John", //키(이름, 식별자): name, 값: John age : 30 //키(이름, 식별자): age, 값: 30 }; 점 표기법(dot notation)을 이용한 프로퍼티 값 읽기 //프로퍼티 값 얻기 alert( user.name ); //John alert( user.age ); //30 프로퍼티 값..

반응형