명시적 변환, 암시적 변환, Nominal, 구조화, 덕 타이핑 이번 Concept에서는 Type Coercion이라는 띠용하는 친구에 대해 알아보겠습니다. console.log(4 + "hello"); console.log(4 + 4 + "hello"); console.log("" == true); console.log(1 == true); console.log(66 + true); 위의 코드를 봅시다. 타입이 서로다른 아이들로 어떠한 작업을 하고 있는데요~ 보통 다른 프로그래밍 언어에서는 이렇게 타입이 다른 것들끼리 무엇인가 할 수 있게 되어 있지 않습니다. 하지만 자바스크립트는 위의 코드가 가능합니다. 자바스크립트가 맘대로 바꿔서 말이죠! 위의 결과는 아래와 같이 나옵니다. 4hello 8hello..

서버가 없었다면 우리는 정적으로 웹페이지를 만들게 될 것이다. 정적이란 한 번 만들면 변하지 않는 것들을 의미한다. 예를 들어 HTML파일은 한 번 짜고 브라우저에 로드시키면 내가 직접 HTML코드를 바꿀 수 있는 수단이 존재하지 않다. 매우 간단한 웹페이지를 만든다면 HTML파일 하나로도 충분하지만 스크롤을 100번 넘게해도 끝나지 않을때는 어떻게 해야할까? 100번 스크롤해도 끝나지 않는 HTML코드를 내 손으로 직접 작성한다는 것은 시간이 매우매우매우~ 후달린다. 이러한 문제점 때문에 내가 손수 코드를 작성하지 않아도 어떠한 상호작용을 통해 코드가 계속해서 바뀔 수 있도록 한다는 개념이 동적이라고 한다. Express에서 정적과 동적파일을 다루는 방법이 조금 다른데 정적파일은 Node가 한번 실행되..

상속, 다형성, 코드의 재사용성 이번 Concept은 상속과 다형성 그리고 코드의 재사용성에 대해서 이야기 해보겠습니다. 상속 상속은 부모가 자식에게 무엇인가 물려줄 때 사용되는 말입니다. 클래스 상속은 한 클래스가 다른 클래스를 상속하는 방법으로 기존 기능 위에 새로운 기능을 만들 수 있습니다. 클래스가 있다고 가정해 봅시다. class Animal { constructor(name) { this.speed = 0; this.name = name; } run(speed) { this.speed = speed; alert(`${this.name} runs with speed ${this.speed}.`); } stop() { this.speed = 0; alert(`${this.name} stands s..

함수 범위, 블록 범위, 렉시컬(lexical) 범위 이번 Concept은 Scope에 대해서 알아보겠습니다. Scope는 자바스크립트에서 변수가 어디까지 접근이 가능한지를 정의합니다. Scope는 크게 2가지로 분류할 수 있습니다. Global Scope 변수가 함수 바깥이나 {}(컬리 브라켓) 바깥에 선언되어 있다면 이것은 Global Scope에 정의되었다고 합니다. 글로벌 스코프로 선언이 되면 코드 내 어디서든 사용이 가능합니다. 밑의 코드처럼 말이죠. const hello = 'Hello CSS-Tricks Reader!' function sayHello () { console.log(hello) } console.log(hello) // 'Hello CSS-Tricks Reader!' sayH..

값 타입(Value Type)과 참조 타입(Reference Type) 이번에 다룰 Concept는 매우 흥미로운 내용이다. 컨셉을 다루기전에 먼저 밑의 코드를 보면서 생각해보는 시간을 가져봅시다. console.log([10] === [10]); console.log({'a': 20} === {'a': 20}); 위 코드를 보면서 결과를 어떻게 도출하셨나요? true라고 생각하시는 분들도 계실테고 false라고 생각하시는 분들도 계실 것 같습니다. 저는 처음에 당연히 true가 나와야 정상 아니야?… 라고 생각했지만! 결과는 false false 입니다. 이 컨셉에 대해 설명을 시작하겠습니다 :) 지난 강의에서 Primitive Type에 대해서 다뤘습니다. 이것은 변경될 수 없는 값을 가지며 Stri..