JavaScript

[자바스크립트] let, const 키워드를 사용하자.

이전 글 [자바스크립트] var 키워드를 사용하지 말아야 하는 이유 자바스크립트에서 변수를 선언하는 방법으로는 var, const, let 3가지 키워드가 있다. 사실 EcmaScript5 전까지는 var 키워드만 존재했으며 이후로 const, let이 추가된 것이다. 이 var 키워드는 독특한 특징 gobae.tistory.com var 키워드의 단점을 보완하기 위해 등장한 const, let 키워드는 어떤 특성을 가지는지 알아보자. let 키워드 1. 동일한 식별자를 중복 선언할 수 없다. var a = 1; let a = 1; // 'a' has already been declared. var 키워드와 달리, let 키워드는 동일한 식별자 변수를 중복 선언하면 에러가 발생한다. 2. 블록 레벨 스코..

[자바스크립트] var 키워드를 사용하지 말아야 하는 이유

자바스크립트에서 변수를 선언하는 방법으로는 var, const, let 3가지 키워드가 있다. 사실 EcmaScript5 전까지는 var 키워드만 존재했으며 이후로 const, let이 추가된 것이다. 이 var 키워드는 독특한 특징들이 있어 사용에 주의해야 한다. var 키워드를 왜 사용하면 안될까? 1. 동일한 식별자를 중복 선언할 수 있다. var a = 1; var b = 1; ... var a = 100; console.log(a, b); // 100 1 위 코드와 같이 동일한 이름의 변수를 선언해도 에러가 발생하지 않는다. 의도치 않게 이미 선언했던 중요한 변수 값이 변경되어 심각한 문제를 일으킬 수 있다. 2. 함수 레벨의 스코프를 가진다. 변수는 항상 스코프를 가지는데, var 키워드로 선..

[자바스크립트] 렉시컬 스코프

스코프와 스코프 체인 스코프란, 식별자의 유효 범위를 말한다. 스코프 체인이란, 이 식별자의 유효 범위를 뜻하는 스코프가 계층적으로 연결된 것을 의미한다. 함수에서 스코프를 결정하는 방식으로는 동적 스코프와 정적 스코프 방식이 있다. 동적 스코프와 정적 스코프의 차이는 var x = 1; function fun1(){ var x = 2; fun2(); } function fun2(){ console.log(x); } fun1(); // 결과1 = ? fun2(); // 결과2 = ? 에서 결과1, 결과2가 어떤 형태일 지 예측해보면 된다. (1) 2 1 출력 (2) 1 1 출력 2가지 경우로 예측할 수 있을 것이다. 실제로 이 스코프에 대해 공부하게 된 계기도 이 코드와 유사한데, 알고리즘 문제를 풀면서..

[자바스크립트] 동등 비교 연산자 "==" 와 일치 비교 연산자 "==="

비교 연산자 사용하기 비교 연산자 설명 비교 연산자는 연산자를 기준으로 좌항과 우항의 피연산자를 비교하여 그 결과를 불린 값으로 반환한다. 주로 if문, for문과 같은 제어문의 조건식에서 사용한다. 자바스크립트에서 비교 연산자는 다음의 4가지가 있다. 비교 연산자 의미 예시 설명 == 동등 비교 x==y x와 y의 값이 같다 != 부동등 비교 x!=y x와 y의 값이 같다 === 일치 비교 x===y x와 y의 값, 타입이 같다 !== 불일치 비교 x!==y x와 y의 값, 타입이 다르다 동등 비교 연산자와 일치 비교 연산자가 모두 비교 연산자의 역할을 하지만, 비교하는 엄격성에서 차이가 있다. 동등 비교 연산자는 느슨한 비교를 하고, 일치 비교 연산자는 엄격한 비교를 수행한다. 동등 비교 연산자 "=..

[VanillaJS] 바닐라JS만으로 To Do List 만들어보자 3

이전글 [VanillaJS] 바닐라JS만으로 To Do List 만들어보자 2 2021.04.30 - [JavaScript/VanillaJS] - [VanillaJS] 바닐라JS만으로 To Do List 만들어보자 1 [VanillaJS] 바닐라JS만으로 To Do List 만들어보자 1 Vanilla JavaScript(순수한 자바스크립트)만을 사용해서 To Do.. gobae.tistory.com To Do 삭제하기 마지막 To Do 삭제 기능이다. 삭제를 위해서는 어떤 것이 필요할까? 삭제를 위한 버튼이 필요하다. 삭제 버튼을 클릭하면, 해당하는 to Do가 삭제되어야 한다. 이전 2편에서 완성한 코드를 가지고 시작해보자. 이전 포스팅 JS 코드 const toDoForm = document.que..

[VanillaJS] 바닐라JS만으로 To Do List 만들어보자 2

1편 [VanillaJS] 바닐라JS만으로 To Do List 만들어보자 1 Vanilla JavaScript(순수한 자바스크립트)만을 사용해서 To Do List를 만들어보자. 왜 귀찮게 VanillaJS로 구현하는가? 만약에 하나의 기능을 구현하는 데 100줄, 200줄 정도의 코드를 요구한다고 하자. 이미 gobae.tistory.com 1편에 이어서, toDo의 저장을 위해 Local Storage를 활용해보자. Local Storage mdn 설명 항상 자바스크립트를 공부하면서 모르는 것이 있다면 구글을 열어서, keyword mdn 으로 검색하자. 예) local storage mdn 혼자 모르는 개념을 알아야 할 때 아주 좋고 상세하게 설명되어 있는 곳이다. local storage란? 간단..