드림코딩 by 엘리. JavaScript 기초 강의(3) - 데이터타입, data types, let vs var, hoisting

프로그래밍에서 가장 중요한 것은 무엇일까? 엘리 입장에선 입력 / 연산 / 출력이라 말한다.

"사용자들에게 UI나 Console로 통해 입력 받은" 데이터를 "잘 처리하고 연산해서" 다시 "알맞게 사용자에게 출력" 하는 것이 중요하다.

여기서 전송을 위해서 서버로부터 데이터를 보내고 다시 받아오는 작업 역시 포함 될 수 있다.

여기에서는 CPU에 최적화된 연산 / 메모리의 사용을 최소화 하는 것도 중요하다.

Vanilla JS? 순수 Javsciprt 를 일걷는 말. 여러 JQuery Plugin들이 Vanilla JS 버전으로 업데이트 되고 있는데, 가장 큰 이유는 본격적인 스마트폰 시대가 열렸기 때문이다. 휴대폰에 탑재된 CPU와 적은 메모리, 작은 데이터 대역폭에서는 JQuery가 너무 무겁기 때문이다. 또한 Node.js 영향으로 JS 는 단지 브라우저의 언어의 명목을 벗어나 서버 사이드 언어까지로 발전했다. 이와 동시에 JQuery의 주된 기능인 Client-side에서 DOM을 조작하는 라이브러리의 가치는 떨어질 수 밖에 없다. 결정적으로 현재 React, Angular, Vue 처럼 더 직관적이고 최신 기술의 프론트 엔드 프레임워크/라이브러리가 등장하면서 JQuery의 인기는 절담 되었다. 애니메이션의 경우 GSAP(GreenScok Animation Platform)이라는 애니메이션에만 집중한 라이브러리가 훨씬 더 좋은 퍼포먼스를 보여주고 있다. 그렇다하더라도, 단순 랜딩페이지 처럼 간단한 one page application에 있어서는 여전히 JQuery는 높은 퍼포먼스를 자랑한다. 그러나 빠른 테크업계의 진화에 발을 맞추려면 변화를 따라가야하기에 기존의 툴을 버려야 할 때 도 있을 것이다. (https://blog.jaeyoon.io/2017/12/jquery-free.html)

 

What is the landing page? 사용자에게 특정 액션을 유도하는 페이지, 소비자가 검색 엔진이나 광고 등을 통해 처음으로 보게 되는 페이지. (http://blog.wishket.com/랜딩페이지-개념-제작-팁-위시켓/)

 

ES6 이전의 문법은 잘 사용하지 않는다.

var (don't ever use this!) 선언하기도 전에 사용 할 수 있다. 이유는 hoisting 개념 때문에 가능

이전에는 Flexible한 코딩을 위하여 짧은 javascript 안에서 동작하기 위해 사용했으나 지금은 오히려 가벼운 javascript의 장점을 저하시킴.

var는 선언을 하면 지속적으로 메모리를 차지하고 있음. Block개념도 없기에 사용에도 안정성에 문제가 큼.

 

Browser의 Compatibility (호환성)을 확인하기 위한 페이지 > https://caniuse.com/?search=es6

혹여 코딩에 있어서 호환성을 생각할 시엔 우선 ES6 이상의 코드를 작성하고 Babel를 사용하여 배포하자.

 

javascript의 변수 선언 타입은 2가지가 있다.  Mutable type의 Let, Immutable type의 Const

 

Variable Types > 1_ Primitive, single item  2_object, box container  3_funtion, first-class function(변수에 할당 가능, 파라미터(인자) 사용 가능)

 

javascript는 number로 통일 - bigInt가 추가 됨.

 

boolean Type = false: 0, null, undefined, NaN, '' / True : any other value

 

Symbol > Map 같은 자료구조에서 고유한 식별자가 필요하거나, 동시에 다발적으로 (concurrent) 일어날 수 있는 코드에서 우선 순위를 줄 때

식별자를 스트링을 이용해서 쓰는 경우 일 때, 이 스트링은 다른 Module 이나 File에서 동일한 스트링을 썼을 때 같은 식별자로 판단 됨.

반대로 심볼 같은 경우는 동일한 변수들을 이용해서 만들어도 다른 식별자로 간주 됨.

 

Symbol의 경우 항상 Dot description을 이용하여 string으로 변환 후 출력해야 한다.

 

javascript는 Dynamic typed language라 불린다. runtime program이 동작할 때 할당된 값에 따라 type이 변경될 수 있다는 것을 의미.

많은 프로그래머들은 변수의 이름을 통하여 type을 생각하게 된다. 그러나 런타임에서 타입이 정해지기 때문에 Error를 일으킬 수 있다.

 

object 란 우리가 일상생활에서 보는 물건과 물체들을 대표할 수 있는 Box 형태의 데이터.

 

 

 

 

 

 

 

 

 

 

 

 

 

Symbol의 경우 항상 Dot description을 이용하여 string으로 변환 후 출력해야 한다.

 

javascript는 Dynamic typed language라 불린다. runtime program이 동작할 때 할당된 값에 따라 type이 변경될 수 있다는 것을 의미.

 

 

많은 프로그래머들은 변수의 이름을 통하여 type을 생각하게 된다. 그러나 런타임에서 타입이 정해지기 때문에 Error를 일으킬 수 있다.

 

object 란 우리가 일상생활에서 보는 물건과 물체들을 대표할 수 있는 Box 형태의 데이터.