ES6와 ES5의 차이점

안윤경·2022년 12월 14일
0

기술면접

목록 보기
7/12

ES란?

  • ES(ECMAScript)는 ECMA International이 ECMA-262 기술 규격에 따라 정의하고 있는 표준화된 스크립트 프로그래밍 언어를 말한다.
    js 첫번째 주요 개정판이 ES5, 두번째 개정판이 ES6이다.

<차이점>

  1. es5에서는 let,const를 쓰지 않지만 ES6에서는 사용을한다

    let,const의 특징?
    let,const 둘 다 호이스팅이 불가능하며 스코프의 범위는 블락스코프이다
    단 let은 재할당은 가능하지만 const는 불가능하다

    2.Arrow Functions의 사용
    ES6에서는 Arrow Functions의 사용이 가능하다

    화살표 함수 표현은 function 표현에 비해 구문이 짧고 자신의 this, arguments을 바인딩하지 않는다. Arrow Function이 등장하기 전까지 모든 함수는 그 함수 자신의 this 값을 꼭 정의했다. 이는 객체 지향 스타일로 프로그래밍할 때 별로 좋지 않다.

    3.Array 표현법
    ES5에서 반복문을 쓸 때 for문을 전체 다 써줘야 했지만
    for(let i = 0; i<num; i++){
    console.log("a")
    }
    ES6에서는 for...of/in과 forEach를 사용이 가능하다

    for of/in

    for(let i of array){
    console.log("A") 
    }

    forEach

    array.forEach((item, idx) =>{
    단 map과 달리 리턴문이 없다는 점을 주의하자
    });
    4.구조분해할당 배열이나 JSON, Object 형태에서 속성을 해제하여서 변수로 할당하는 방식을 의미함. 어떤 것을 복사한 이후에 변수로 복사해준다는 의미이다. 이 과정에서 분해 혹은 파괴되지 않는다는 점이 있다.

5.spread연산자의 사용

기존의 값을 그대로 유지하면서 병합,구축등 여러방법으로 사용이 가능하다

6.템플릿 리터럴 (Template literals)

문자열을 쓸 때 "a"+ " "+ "b"이런식이 아니고
백틱을 이용해 ${a} ${b} 이런식으로 사용이 가능하다

  1. import / export

    import와 export는 자바스크립트의 코드를 모듈화 할 수 있는 기능이다.

8.비교문(비교연산자)
ES5에서는 == 을 사용했다면 ES6에서는 ===을 사용한다

9.promise , async/await
async await 패턴은 비동기식 프로그래밍을 일반적인 동기 프로그램과 유사한 방식으로 구성할 수 있도록 많은 프로그래밍 언어에서 제공하는 기능이다.

promise: 비동기 작업이 맞이 할 미래의 완료 또는 실패와 그 결과 값을 나타낸다.(then, catch, finally)
async: 비동기 함수를 만들기 위해서 명시적으로 작성을 한다
await: async내에서 처리가 완료될 때까지 기다림을 의미한다.

<이부분은 좀 더 정리해서 올리자

참고자료
https://adjh54.tistory.com/4#--%--promise%--%-C%--async%-Fawait

profile
프론트엔드 개발자 안윤경입니다

0개의 댓글