JavaScript

결론 빨리 알고 싶을 땐 정리 로 이동해서 보믄 된다 📌 그냥 쓸 때 : window 태그 안에 바로 this 를 쓰면 window를 뜻한다 📌 일반 함수 : window window란?window 는 모든 전역변수, 함수, DOM을 보관하고 관리하는 전역객체이다. 전역변수를 선언하면 window 객체에 저장된다. 함수도 마찬가지이다. 🔎 그냥 쓰거나, 함수 안에서의 this 는 window 를 뜻한다 📌 strict mode 일 때 함수 안에서의 this : undefined strcit mode에선 var 키워드 없이 변수를 선언하거나, 변수를 arguments라는 키워드로 선언하거나 하는 실수들을 방지해준다. 📌 method(오브젝트 내의 함수) 안에서의 this : 해당 오브젝트 그 자체..

null 타입 null 타입의 값은 null 이 유일하다. 자바스크립트는 대소문자를 구별하므로 null, Null, NULL 등과 다르다. 프로그래밍 언어에서 null은 변수에 값이 없다는 것을 의도적으로 명시(의도적 부재, intentional absence)할 때 사용한다. 변수에 null을 할당하는 것은 변수가 이전에 참조하던 값을 더 이상 참조하지 않겠다는 의미이다. 함수가 유효한 값을 반환할 수 없는 경우 명시적으로 null을 반환하기도 한다. 예를 들어, HTML 요소를 검색해 반환하는 document.querySelector 메서드는 조건에 부합하는 HTML 요소를 검색할 수 없는 경우 에러 대신 null 을 반환한다. 심벌 타입(Symbol) 심벌은 ES6에서 추가된 7번째 타입으로, 변경..

템플릿 리터럴 ES6부터 템플릿 리터럴(template literal)이라고 하는 새로운 문자열 표기법이 도입되었다. 템플릿 리터럴은 런타임에 일반 문자열로 변환되어 처리된다. 백틱(` `)을 사용한다. var str = `Template literal`; console.log(str); // Template literal 멀티라인 문자열 일반 문자열 내에선 줄바꿈(개행)이 허용되지 않는다. 일반 문자열 내에서 줄바꿈 등의 공백을 표현하려면 백슬래시(\)로 시작하는 이스케이프 시퀀스(escape sequence)를 사용해야 한다. var template = '\n\tHome\n' console.log(template); 템플릿 리터럴 내에서는 이스케이프 시퀀스를 사용하지 않고도 줄바꿈이 허용되며, 모든 ..

자바스크립트의 모든 값은 데이터 타입을 갖는다. 자바스크립트(ES6)는 7개의 데이터 타입을 갖는다. 7개의 데이터 타입은 원시 타입(primtive type), 객체 타입(object/reference type)으로 분류할 수 있다. (ES11에서는 새로운 원시값 BIgint가 추가되었다. Bigint는 숫자값을 안정적으로 나타낼 수 있는 최대치인 2^53-1보다 큰 정수를 표현할 수 있는 새로운 원시값이다.) 숫자 타입(number) C나 자바같은 경우, 정수와 실수를 구분해서 int, long, float, double 등과 같은 다양한 숫자 타입을 제공한다. 하지만 자바스크립트는 하나의 숫자 타입만 존재한다. ECMAScript 사양에 따르면 숫자 타입의 값은 배정밀도 64비트 부동소수점 형식을 ..

값(value) 값: 식(표현식)이 평가(evaluate)되어 생성된 결과 평가: 식을 해석해서 값을 생성하거나 참조하는 것 // 10 + 20은 평가되어 숫자 값 30을 생성한다 10 + 20; // 30 모든 값은 데이터 타입을 가진다. 메모리에 2진수, 즉 비트의 나열로 저장된다. 메모리에 저장된 값은 데이터 타입에 따라 다르게 해석된다. ex) 메모리에 저장된 값 0100 0001 을 숫자로 해석하면 65지만 문자로 해석하면 'A'이다. 변수는 하나의 값을 저장하기 위해 확보한 메모리 공간 자체 또는 그 메모리 공간을 식별하기 위해 붙인 이름이다. 따라서 변수에 할당되는 것은 값이다. // 변수에는 10 + 20이 평가되어 생성된 숫자 값 30이 할당된다. var sum = 10 + 20; sum..

변수 선언의 실행 시점과 변수 호이스팅 console.log(score); // undefined var score; // 변수 선언문 위의 코드를 실행하면 참조 오류가 발생할 것 같지만, 참조 에러가 발생하지 않고 undefined가 출력된다. 그 이유는 변수 선언이 코드가 한줄 씩 순차적으로 실행되는 시점, 즉 런타임(runtime)이 아니라 그 이전 단계에서 먼저 실행되기 때문이다. 자바스크립트 엔진은 소스코드를 한 줄씩 순차적으로 실행하기에 앞서 먼저 소스코드의 평가 과정을 거치면서 소스코드를 실행하기 위한 준비를 한다. (소스코드 평가 과정 -> 소스코드 실행 순) 소스코드 평가 과정에서 자바스크립트 엔진은 모든 선언문(변수 선언문, 함수 선언문 등)을 소스코드에서 찾아내 먼저 실행한다. 그리고..

변수란 무엇일까? 결론부터 말하자면, 변수는 값이 저장된 메모리 공간에 상징적인 이름을 붙인 것이다. 컴퓨터는 CPU를 사용해 연산하고, 메모리를 사용해 데이터를 기억한다. 메모리(memory)란, 데이터를 저장할 수 있는 메모리 셀(memory cell)의 집합체다. 메모리 셀 하나의 크기는 1바이트(8비트)이며, 컴퓨터는 메모리 셀의 크기(=1바이트) 단위로 데이터를 저장하거나 읽어들인다. 각 셀은 고유의 메모리 주소(memory address)를 갖는다. 이 메모리 주소는 메모리 공간의 위치를 나타낸다. 컴퓨터는 모든 데이터를 2진수로 처리한다. 따라서 메모리에 저장되는 모든 데이터는 데이터의 종류(숫자, 텍스트 등)와 상관없이 모두 2진수로 저장된다. 자바스크립트는 개발자의 직접적인 메모리 제어를..

# 참조에 의한 전달과 외부 상태의 변경 원시 값: 값에 의한 전달(pass by value) 객체: 참조에 의한 전달(pass by reference) 매개변수도 함수 몸체 내부에서 변수와 동일하게 취급되므로 매가변수 또한 타입에 따라 값에 의한 전달, 참조에 의한 전달 방식을 그대로 따른다. (즉 매개변수 = 변수와 동일 취급) // 매개변수 'primitive'은 원시 값을 전달받고, 매개변수 'obj'는 객체를 전달받는다. function change(primitive, obj) { primitive += 100; // 함수 내부에서 원시값 변경 obj.name = 'Kim'; // 함수 내부에서 객체의 프로퍼티 값 변경 } var num = 0; var person = { name: 'Lee' ..

🍀 함수 호출함수 호출 연산자 내에는 0개 이상의 인수를 쉼표로 구분해서 나열한다. 함수를 호출하면 현재의 실행 흐름을 중단하고 호출된 함수로 실행 흐름을 옮긴다.매개변수에 인수가 순서대로 할당된다. 📝 매개변수(parameter)와 인수(argument)매개변수를 통해 인수를 전달한다. 인수는 값으로 평가될 수 있는 표현식이어야 한다. 인수는 함수를 호출할 때 지정하며, 개수와 타입에 제한이 없다.// 함수 선언문function add(x, y) { return x + y;}// 함수 호출// 인수 1과 2가 매개변수 x, y에 순서대로 할당되고 함수 몸체의 문들이 실행된다.var result = add(1, 2);매개변수는 함수 몸체 내부에서 변수와 동일하게 취급된다. 즉, 함수가 호출되면 ..

# Function 생성자 함수 자바스크립트가 기본 제공하는 빌트인 함수인 Function 생성자 함수에 매개변수 목록과 함수 몸체를 문자열로 전달하면서 new 연산자와 함께 호출하면 함수 객체를 생성해서 반환한다. new 연산자 없이 호출해도 결과는 동일하다. 생성자 함수란? 생성자 함수는 객체를 생성하는 함수를 말한다. 생성자 함수에 대한 자세한 내용은 뒤에서 다룰 예정이다! var add = new Function('x', 'y', 'return x+y'); console.log(add(2, 5)); // 7 Function 생성자 함수로 함수를 생성하는 방식은 일반적이지 않고 바람직하지도 않다. 그 이유는 무엇일까? 클로저(closure)를 생성하지 않는 등, 함수 선언문이나 함수 표현식으로 생성..