# ES6
.jpg?w=120)
#1 Node.js 학습하기에 앞서
일을 하다보니 백단에서 어떤 일을 하는지 몰라서 프론트단에서 이걸 어떻게 처리해야하나 고민했던 적이 있었다. 그래서 백엔드 개발자에게 해결방법에 대한 조언을 요청하니 이건 백엔드에서 혹은 기획단계에서 맞출 수 있는 부분인데 고민 자체는 괜찮지만, 그걸로 너무 시간을 허
두 번째 고비 : 팁 계산기 만들기
하나씩 문제를 해결해나가기 위한 제일 첫 걸음! 가장 처음에 나와 있는 팁 계산기를 만들어보았다. 한창 React를 사용하다보니 Javascript가 전체적으로 가물가물해졌다. 이게 라이브러리에 종속되는 개발자가 되는 길인가... 싶은 생각이 들었다. 그래서 Javas
자바스크립트 개념 2
ES6 이전에는 전역범위와 함수 범위만 존재했다. var 키워드를 위주로 사용했다. 하지만 ES6 이후에는 let 과 const라는 키워드가 등장했고 함수 범위말고도 블록 범위 라는것이 생겼다. 기본적으로 var는 함수위주의 스코프를 가져 전역 범위가 많았는데 let
ES6 - Array API
slice는 실제 array를 변형하지 않고 splice는 실제 array를 변형한다.여기부터는 아래 클래스를 사용한다.callback 함수에 전달되는 인자는 최대한 알기 쉬운 이름을 붙여야 한다.
ES6 For React (1)
React를 위한 ES6let기존 ES5에서는 var 키워드를 사용하여 변수를 선언하는 유일한 방법이었다. 자바스크립트는 {} 중괄호를 사용하여 코드 블록을 만들고 변수의 영역은 그 블록 안으로 한정된다. 그러나, var 키워드를 사용하면 if/else 나 for 구문
Javascript 기본(2)
⛹️♂️ map() 구현 ⛹️♂️ 실행 컨텍스트를 이해하기 위한 자바스크립트 동작과정 변수, 함수 선언, arguments을 가진 활성 객체(Variable Object)생성 Scope Chain 생성 및 초기화 변수 초기화 : 변수 값에 undefined를 할
Javascript 기본(1)
⛹️♂️자바스크립트 타입 ⛹️♂️기본타입 Number : 실수, 부동소수점 64bit (double) String : 문자(열) Boolean : true, false undefined : 변수에 값이 할당되지 않았을 때 undefined로 할당, 타입이기도 함
ES6 - async & await
async & await promise를 보다 깔끔하게 사용하는 방법 > syntactic sugar 기존에 존재하는 것을 한번 감싸서 좀더 사용하기 편하게 만든 것 async await은 syntactic sugar이다.
JavaScript 문법 : this, Arrow Function
📎 JavaScript를 쓰는 이유 : HTML을 조작하기 위해 사용한다.📎 'use strict'; (strict mode)자바스크립트를 엄격하게 실행할 수 있도록 상단에 작성해준다.✔️ this 값은 window{...} 라고 출력된다. 즉, 나를 담고있는 {o
ES6 - promise
Javascript에서 제공하는 asynchronous를 간편하게 처리할 수 있도록 도와주는 Object이다.콜백함수 대신에 비동기처리를 할 수 있다.정해진 장시간의 기능을 수행하고 나서 정상적으로 기능이 수행되었다면 성공 메세지와 결과값을 전달하고, 기능이 수행되지
ES6 - callback
synchronous vs asynchronous Javascirpt is synchronous hoisting 이후에 코드가 한줄한줄 동기적으로 실행된다.
ES6 - Array
콜백함수로 value, index, array를 출력할 수 있다.맨 뒤에 value를 집어넣는다.맨 뒤에 value를 끄집어낸다.맨 앞에 value를 집어넣는다.이 때 전체 데이터를 오른쪽으로 한칸 shift 한다.(오래걸림)맨 앞에 value를 끄집어낸다.이 때 전체
[JS] Promise & Async/Await
우리가 흔히 사용하는 콜백! 콜백이 뭐냐고 하면, 요청 후에 응답이 오면 요걸 수행해줘 같은 느낌요청의 응답이 오기를 매번 주구장창 기다리면 어플리케이션이 너무 느려짐그래서 비동기로 요청만 띡 보내고, 응답이 오기까지 기다리는게 아니라, 일단 다음꺼 수행하는 방식으로
ES6 - Class vs Object
template (틀)declare once (한번만 선언)no data in (실제로 데이터가 들어가진 않음)fields(속성), methods(행동) 가 존재instance of a class (인스턴스 생성 = object)created many times (여러
ES6 - Arrow Function
한 개의 함수는 한 가지 기능만 담당해야 한다.함수의 이름은 동사로 지을 것변수에 할당, 파라미터에 전달, 함수로 리턴이 가능하다.나중에 입력받지 않을 경우를 대비해 파라미터의 default 값을 지정해줄 수 있다.parameter를 배열 형태로 받을 수 있다.밖에서는
ES6 - Operator
타입을 변경해서 검사한다.타입이 달라도 안에 있는 내용이 같다면 동일 취급한다.타입을 변경하지 않고 검사한다.내용이 같아도 타입이 다르다면 같지 않다.주로 사용한다.condition ? value1 : value2;
ES6 - Variable Types
전역변수로서 선언할 때부터 Runtime이 종료될 때까지 메모리를 차지한다.지역변수로서 {}내부에 존재하고 {} 밖에서는 지역변수를 읽지 못한다.중가로 {}를 사용해 가용 범위를 지정해줌{}안에 선언한 변수는 밖에서 사용 불가어디에 variable을 선언했는지에 상관없
.png?w=768)
ES6 - Object
Javascript 데이터 타입 중 하나관계되어진 데이터들의 집합class 없이 object를 생성할 수 있음instance의 field를 가져올 때instance\['field']로 가져올 수 있다.key가 결정되지 않고 runtime 시 결정될 때, 즉 동적으로 o