sungjaeHong/ECMA script 2015(1-2).md

## ECMA script 2015(1-2).md

      
    Raw
  

              ECMA script 2015(1-2).md
            
          
    #ECMA Script 2015 첫째날

개발을 바라보는 관점이 변했으면 좋겠다.
ES6 특징 공부하기(블로그에 많음)

##ES6을 개발하는 관점

기존 언어와 완벽한 호환을 이루겠다.
하나하나의 함수에 의미가 있다.

##Javascript 기본형
Boolean

Null

Undefined

Number

String

Symbol(ECMA Script6에서 추가됨)
Boolean


JS는 다음을 거짓으로 처리("", 0, false, undefined, null, NaN)


따라서 C스타일(false가 없고 0과 1로처리)을 뛰어넘는 다양한 편법으로 검사하는 코드가 난무하게된다.

```javascript
	function(){
		if(arguments.length)
	}
		
	function(v){
		if(v.trim())
	}	
```


- 가부 판정을 위한 메소드의 부재로 숫자나 문자열을  false대용으로 사용

   if(str.indexOf(token) > -1)
        ...
   if(i = str.indexOf(token), i > -1) 
       v = str.substring(0, i);

따라서 true, false이 용도를 정확히하고, 자주쓰는 판정에 대해 Boolean 메소드를 제공(startsWith, endsWidth)

##undefined

애매한 부정값으로 사용되므로 값이 없음을 나타내도록 언어의 여러 요소에서 강제하여 제한된 용도로 사용하게 유도함

let[a, b=3] = [1];  
console.log(b);	//3  
let[a,b = 3] = [1, undefined];  
console.log(b);	//3  
const test = function(a, b = 3){
	return a + b;
};
console.log(test(1)); //4
console.log(test(1, undefined)); //4
##arguments

암묵적이다 = 명시적이지않다 = 코드를 보면 모른다.(ES6에선 암묵지를 제거하는 과정에 있다)

const test = function(){  
		let arguments = 3;  
		console.log(arguments);  
};  
test(5,6,7)	//3
를 아래와 같이 변경
const test = funtion(...arg){  
	console.log(arg);  
};
##Symbol

자동 형변환 등 엔진의 내재된 작동에 상ㅇ자가 작성한 객체가 반응하게 하려면 어떠한 코드상의 힌트도 없고 단지 언어스펙을 외운 사람만 의마가 파악됨

let a = {  
    toString:_=>'a',	//toString, valueOf, toJSON등은 일반문자열이므로  
    valueOf:_=>1,  		//이것이 엔진 작동에 반응하는 트리거 메소드라는 것을 코드로 알 방법은 없고  
    toJSON:_=>'{a:1}'	//언어스펙을 외운 사람만 의미가 파악된다.  
};
--> 코드에서 인식할 수 있는 명확한 표현으로 변경
let a = {
	[Symbol.toPrimitive]:hint=>hint == 'string' ? 'a' : 1
}


//Arrow 문법
User.findAll()
  .then(function (users) {
    return users;
  })
  .catch(function (error) {
    return Promise.reject(error);
  })
  
User.finallAll()
  .then(users => {
    return users
  })
  .catch(error => {
    return Promise.reject(error);
  });
  //Arrow Function : =function(){} 의 구문이 =>로 변경됨.
##Iterable & Iterator


for, while문으로 구성된 반복은 실행될 수 있으나 값을 저장할 순 없음.

인자로 전달하거나 상태를 기억해 둘 수 없음

사전에 정의가 끝난 정적 값에 대한 반복만 가능
반드시 반복전에 반복할 대상에 대한 사전처리가 완료되어있어야함.
반복될 대상에 대해 지연처리가 불가


그러나 지연실행의 필요성이 있다.

수식적이거나 알고리즘을 통해서 계산될 값은 미리 정의해 둘 이유가 없음
메모리에 정의한 적이 없어도 반복시점에 자원을 확보하여 반환할 수도 있음


반복이란 반복시마다 실행될 부분과 계속 반복할지 여부로 구성됨


while(계속 반복할 지 여부){
		반복시 실행될 부분
}

Iterator Protocol

반복시 실행될 부분 -> next()메소드를 호출함
계속 반복할지 여부 -> next로 반환된 객체의 done키에 있는 boolean값


문자열은 Iterable(Iterator를 반환함)

let[a, b, c] = 'abc';
let a= [...'abc'];
const test = (...arg)=>arg.join('-');
test(...'abcd');	//'a-b-c-d'

Custom Iterable

let n2 = {
	[Symbol.iterator](){
		var cursor = -1, max=10;
		return{
			done:false, value:0
			next(){
				if(cursor++<=max){
					this.value = cursor * cursor;
				} else{
					this.value = undefined;
					this.done = true;
				}
				return this;
			}
		};
	}
};
((...a)=>console.log(a))(...n2);	//[0, 1, 4, 9, 16, 25, 36, 49, 64, 81, 100]
##generator
Iterable을 직접 제작하는건 상당한 반복작업을 유발하므로 언어차원에서 간단한 문법을 제공함
const gene = function*(max){
	let cursor = -1;
	while(cursor++<max) yield cursor * cursor;
};
((...a)=>console.log(a))(...gene(10));	//[0, 1, 4, 9, 16, 25, 36, 49, 64, 81, 100]

1. 객체 컨텍스트를 변수 컨텍스트ㄹ
2. 제어문을 중지시킬 수 있는 yield
##Class
결국 OOP는 여전히 가장 주요한 아키텍쳐방법론이다. 프로토타입을 통해 대체가능성과 내적동질성을 확보할 수 있다.
var Dog = function(){};
Dog.prototype.bark = function(){
	return 'woof';
};

var Spitz = function(){};
Spitz.prototype = new Dog();
Spitz.prototype.bark = function(){
	return 'woof, woof';
}

var dog = new Spitz();
console.log(dog.instanceof Dog);	//true	대체가능성
console.log(dog.bark());	//woof, woof	내적동질성
중복키의 문제

프로토타입은 단일 체이닝 구조로 대상객체가 상위객체의 키를 가리도록 되어있음.
따라서 반드시 하위클래스는 상위의 이름을 피해서 제작해야만 상위구조와 상호작용할 수 있음.

var Parent = function(){};
Parent.prototype
var Parent - function(a){
	this.a = a;
};
var Child = function(a,b){
	Parent.call(this, a);
	this.b = b;
}
새로운 컨텍스트 객체 도입

기존 this가 현재 주체가 되는 객체의 참조로서 동작하는 컨텍스트를 제공했다면
super는 상위클래스에 대한 상대경로를 제공하는 새로운 컨텍스트