변수의 선언을 변수 범위 맨위로 끌어오는 현상변수를 만나면 선언부분을 강제로 맨위로 끌어올림그래서 함수 선언식을 아래에 작성하고 위에서 함수를 호출해도 실행된다.선언 단계초기화 단계할당 단계선언 및 초기화 단계할당 단계초기화: undefined를 할당 해주는 단계선언단
함수 안에서 var for문 안에서 var if문 안에서 var
쓰임: 비슷한 객체 여러 개 만들때, 사용하면 유용new 함수명( ); 하면하지만, 그냥 함수명( ); 하면2줄이 생기지 않는다. (즉, 일반함수 호출이 됨)JavaScript의 클래스는 ECMAScript 2015 (ES6)부터 도입되었으며 이전에는 생성자 함수가 클
// 식 자체를 넣는 것도 가능함const test = { 2 + 4 : 6, "안녕"+"반가워" : "hello",}console.log(test); // { 6: 6, 안녕반가워: 'hello' }
첫번째 인자 { }는 초기화 시키기 위함두번째 인자 user가 객체의 첫번째 값으로 저장됨
둘다 문자를 숫자로 변화해준다Number는 숫자만 있어야한다ex)paresInt는 문자와 있어도 가능(숫자부분만 바꿔주며, 처음시작이 문자라면 오류)ex)
특정 요소 지움arr.splice(n, m); // n:시작, m:개수특정 요소 지우고 추가arr.splice(n, m, x); // n:시작, m:개수, x:추가할 값(여러 개 가능)arr.slice(n, m); // n~m까지 배열로 반환 (m전까지 반환)arr.c
기본 사용 법기본값 사용swap 쉽게 하는 법기본 사용 법기본값 사용은 배열과 같음새로운 변수 이름으로 할당
원시값을 복사b는 a와 다른 메모리 공간에서 값만 복사했기 때문에 b의 값을 변경해도 a는 변화 없음배열 또는 객체를 복사하면 일어남 (같은 주소값을 가리키고 있기 때문)obj2는 obj1과 같은 주소값을 참조하고 있기 때문에 참조된 값을 변경하면 ob1, obj2에
number, bigint, string, boolean, null, undefined, symbol원시 타입은 변경이 불가능한 값(immutable type)위 코드를 메모리에서 바라보면 처음 a는 0x001에 10이라는 값이 저장그리고 a = 20;이라고 작성하면0
모던 웹브라우저에서 스크립트들은 대부분 html보다 무겁다즉, 용량이 커서 다운받는데 오래걸림브라우저는 html 읽다가 스크립트 만나면 스크립트를 먼저 실행해야 함그래서 DOM 생성을 멈춤1\. 스크립트에서는 스크립트 아래에 있는 DOM 요소를 접근 못함즉, DOM 요
(OR 연산자와 피연산자가 여러 개인 경우)연산 수행 순서1\. 가장 왼쪽 피연산자부터 연산2\. 각 피연산자를 boolean형으로 변환 후 값이 true면 연산을 멈추고 값을 반환마지막 피연산자까지 모두 false인 경우 마지막 피연산자를 반환OR 연산자의 동작 원리
||는 첫번째 Truthy 값을 반환??는 첫번째 정의된 값을 반환
명시적 형변환String()암시적 형변환'' +하기명시적 형변환Number(문자);parseInt(문자, 진법);parseFloat(문자, 진법);암시적 형변환숫자 이외의 글자가 들어간 문자열을 숫자형으로 변환하려고 하면 NaN됨숫자형으로 변환 시 주의undefined
setTimeout 함수는 for문이 끝나면 실행된다. (비동기)그래서 i는 이미 6이된 상태임으로 6이 5번 출력된다.setTimeout 함수는 for문이 끝나면 실행된다. (비동기)이 상황은 var를 사용했을 때와 같다.하지만, let을 사용했기에 유효범위가 블록
데이터 타입을 문자열로 반환7가지 중 하나로 반환함"number""string""boolean""undefined""symbol""object""function"문제: typeof null을 하면 null이 아닌 “object”를 반환이유: JavaScript 초기버전
드래그하면 보임1번: <span style="color:2번: <span style="color:처음 s1은 song이라는 값을 새로운 메모리 주소 공간에서 할당받음 (참조하지 않음)그래서 student.name = 'park'이후에도 여전히 song이라는
constructor를 내장 (constructor는 들어있는 게 많아서 무거움)객체의 메서드로 많이 사용 (this를 찾기 위해)일반함수에서 사용하는 this: 나를 호출한 대상을 찾음constructor를 내장하지 않음메서드 안의 함수로 많이 사용 (상위 this를
함수 선언식 함수명 필수 호이스팅(hoisting)으로 선언식이 아래 작성돼도 정상 동작 함수 표현식 함수명 없어도 됨 (거의 없이 사용) 호이스팅(hoisting)이 되긴 하지만 IIFE (즉시 실행 함수 표현식) 객체에 함수(메서드) 작성하는 법
: 변수, 식별자를 참조(접근)할 수 있는 유효한 범위전역 스코프 (Global scope)지역 스코프 (Local scope)JS는 함수 레벨 스코프를 지원하지만, ES6에서 let, const가 도입됨let, const는 블록 레벨 스코프를 지원1번 (드래그 하면
iterable protocoliterator protocoliterable하기 위한 충족 조건: object는 iterator 메서드를 구현해야 함 (속성으로 Symbol.iterator을 가져야 함을 뜻함)사용자가 직접 만든 것이라도 iterable하다면 사용가능배
forfor inforEach: 배열이 아닌 객체 순환 용도 (이유는 속도 때문, 순서 보장X)기본적으로 배열만 활용 가능break, continue 사용 못 함ES6부터 새롭게 지원iterable protocol을 준수하는 객체만 사용 가능반복 가능한 객체(배열, N
js는 날짜, 오류, html 요소 등을 다룰 수 있게 해주는 다양한 내장 객체(built-in Object)를 제공이 객체들은 고유한 프로퍼티와 메서드를 가짐이런 기능을 사용하면 시스템 자원이 많이 소모됨그래서 객체는 원시값보다 무겁다문자열, 숫자같은 원시값을 다룰
document가 js요소가 아닌 브라우저 환경에서 제공되는 것이기 때문웹 개발에서 사용되는 document 객체는 브라우저에서 제공하는 window 객체의 한 요소window.document 객체를 DOM이라 분류Web API에는 DOM, BOM, ... 등이 있음브
: 어떤 사건을 의미이벤트 발생하는 시점이나 순서는 사전에 인지 불가능그래서 일반적인 제어 흐름과 다른 접근 방식이 필요즉, 이벤트 발생을 감지하고 대응해주는 것이 필요브라우저는 이벤트를 감지할 수 있으며 대응해준다.이 과정이 사용자와 웹페이지를 상호작용(Interac
프로토타입 (Prototype) js는 프로토타입을 기반으로 한 객체지향언어 요즘 대세는 class 기반 객체지향 ex) TypeScript, Java, 최신JS 하지만, JS가 프로토타입 기반이라 알아두면 JS를 이해하는데 도움이 됨 JS에 모든 객체는 Obje
: 자주 사용되는 이벤트, 함수들의 실행 빈도를 줄여 성능 향상시킴일정 시간을 두고 데이터 가져오기 (Throttle)입력이 끝난 후 데이터 가져오기 (Debounce): 입력 주기를 방해하지 않고, 일정 시간 동안의 입력을 모아 정해진 시간마다 이벤트를 호출: 입력
"어떻게"에 초점하나 하나 디테일하게 설명하는 방식ex) for문은 초기화, 조건, 증감 등을 작성해야 함 목적을 달성하기 위해 어떻게 하는지 가이드 하는 게 중요함"무엇을"에 초점한 마디로 설명하는 방식ex) map은 배열.map만 작성하면 됨 목적을 달성하기만 하면