Javascript

[Javascript]ES6

*히아* 2022. 10. 10. 11:29

✔️ ES6란?

ECMAScript 버전 6 이후를 통틀어 일반적으로 ES6라고 부른다

 

✔️ ECMAScript란?

Javascript의 표준문법

2015년, 버전 6 이후로 많은 문법이 추가되면서 계쏙해서 발전하고 있다. 

 

 

❓ 왜 우리는 ES6를 사용해야할까?

현대적인 문법은 생산성 향상에 도움을 주기때문!! 

Node.js는 빠르게 최신 ECMAScript를 지원 중에 있다.

 

 

자주 사용되는 문법

1. 잘 알고 있는 let, const 

2. Template String - 백틱 기호로 문자 사이에 간단하게 변수 사용 가능

3. arrow function 

4. class - 그 전에는 class가 없기 때문에 객체지향을 구현하기 위해 function과 prototype을 사용했음

5. descturcting 

 

 

4. class 예시를 코드로 확인해보자!!

< 기존 문법 > 

function Modal(name,age){
	this.name = name;
    this.age = age;
}
//prototype으로 class 함수 구현
Modal.prtotype.getInfo = function(){
	console.log(this.name,this.age);
}
var model = new Model('hia',5)
model.getInfo()

 

< ES6 문법 >

//일반적인 형태의 class 구현 가능
class Modal{
	constructor(name,age){
    	this.name = name;
        this.age = age;
    }
    getInfo(){
    	console.log(this.name, this.age)
    }
}
const model = new Model('hia',5);
model.getInfo();

 

 

5. destructing 코드 예시

< 기존 문법 >

var = {name:'hia', age:13};
var name = obj.name;
var age = obj.age;

var arr = ['some','values'];
var first = arr[0];
var second = arr[1];

 

< ES6 >

const obj = {name:'hia',age:15};

//obj 의 key와 같은 이름으로 변수 선언 가능
const {name ,age} = obj;

//다른 이름으로 변수 선언하는 방법
const {name:n1,age:a1} = obj;

const ar = [1,2];
const [first, sec]= arr;