항해를 시작한지 벌써 2주가 지났다.
2주차는 알고리즘 위주로 공부를 하였는데
팀 프로젝트가 아니여서 첫주차보다는 마음은 편했지만 편하지않은?
그런 한주였다.
알고리즘 문제는 어려웠고 한문제 푸는데 시간도 오래거리고
못 푸는 문제는 답안지를 보고 이해하려 했지만 너무 어려웠다.
그래서 모의고사와 테스트때는 정말 걱정을 많이 했는데
다행이 아는 문제가 나와서 통과했던것 같다.
이런 걱정을 안하고 테스트를 볼 수 있는 날이 올까....
그리고 이제 진짜 주특기인 React를 공부하는 시간이 왔다...
React 3주간이 제일 힘들 것 같은 생각이 든다....
여지껏 배워왔던것도 다 마스터를 못했는데 다시 새로운 것을 배워야 한다니
걱정이 많이 된다... 하지만 한편으로는 미래의 나에게 밥벌이를 해줄 녀석이
어떤 녀석일지 기대가 되는 것도 사실이다.
이제 앞으로가 진짜라는 생각이 든다.
앞으로 정신 번쩍 차리고 집중을 해야지...
아래는 JS의 ES와 ES5, ES6의 차이에 대해서 조사한 자료입니다.
JavaScript의 ES란?
바로 결론부터 말하자면 js는 언어이고, ES는 규격, 표준 즉 스펙을 뜻한다.
js는 10일이라는 정말 짧은 기간에 만들어진 언어이다. 그런만큼 설계상의 미스가 있을 수 밖에 없다. 그렇기에 지속적으로 버전이 업그래이드 되고, 기능이 늘어 1999년 ES3, 2009년 ES5, 2015년 ES6가 생겨 나게 되었다.
ES5와 ES6의 차이점
ES5와 ES6의 차이점은 여러가지가 있지만 크게 6가지로 나눌 수 있다
템플릿 리터럴
ES6부터 새롭게 등장한 템플릿 리터럴. 덕분에 문자열 표현이 훨씬 간단해졌다.
템플릿 리터럴이란 작은 따옴표나 큰 따옴표 대신 백틱으로 문자열을 감싸 표현하는 기능을 말한다.
화살표 함수
ES6부터 새롭게 등장한 화살표 함수로 함수 선언법이 좀 더 간단해졌다.
화살표 함수에 인자(argument)가 하나밖에 없다면 괄호를 생략할 수 있다.
또한 한줄로 표현이 가능하다면 위와 같이 중괄호({})를 생략할 수 있다.
this의 다른 동작
ES5같은 경우 객체 내에 있는 메소드를 실행 시 this는 메소드가 선언된 해당 객체를 가리킨다.
하지만 객체 안에서 선언된 함수의 this는 해당 객체가 아닌 window를 바라보고 있기 때문에 함수 안에서 this.name, this.age 를 하여도 아무 값이 나오지 않는다.
ES6에서의 this 는 자신을 둘러싸고 있는 this를 바라보기 때문에 따로 바인딩이나 변수에 담을 필요 없다.
변수 선언
ES5에선 var 밖에 존재하지 않았다. var 는 변수를 선언할 때 사용되는 키워드로,
재할당과 재선언에 굉장히 자유롭다.
ES6부터 let, const가 추가되었다.
let은 한번 선언된 변수에 동일한 이름으로 선언할 수 없다.
하지만, 값은 재할당 할 수 있다.
모듈
ES5 이전에는 각 기능별로 JS 파일을 나누고 개발 및 관리하는 것이 불가능했다.
ES5 에선 require 를 통해 모듈화를 할 수 있었다.
ES6 부터는 import/export 로 모듈을 관리할 수 있다.
모듈은 실현가능한 특정 프로그램의 그룹니다.
그리고 이것은 다른 파일의 변수, 함수를 참조한다.
클래스와 같은 모듈이 로딩될 때, import와 export를 이용해 사용될 수 있다.
클래스
ES5에선 class라는 키워드는 없었지만 프로토타입을 통해 실현 가능했다.
ES6에서는 class 키워드를 사용해서 선언할 수 있다.
