자바스크립트 (쌩기초편🤷🏻‍♀️)

바닐라 자바스크립트 성능 (속도) 비교

자바스크립트란 무엇일까?

이 페이지는 이것에 대한 간단한 소개이다. 초심자 중에도 초초초초초초심자 문서이기 때문에 가볍게 넘어갈 수 있다.

 

대체 자바스크립트란 무엇인가?

그리고 바닐라JS란 무엇인가?

제이쿼리는 무엇이지?

정말 아무것도 모르는 사람들은 이렇게 궁금해 할 것 이다.

 

자바스크립트 그것이 궁금해!

자바스크립트는 웹 브라우저에서 주로 사용되는 객체 기반의 스크립트 언어이다. (오잉 함수기반 아닌가?)

JAVASCRIPT ? JAVA ? 그거 같은거 아냐?

간단히 말하자면 같은거 아니다.

 

자바스크립트 왜 만들었나?

자바스크립트의 등장 계기는 다음과 같다.

 

 

옛날 옛적에..

네스케이프사에서 만든 ‘네비게이터’라는 웹 브라우저가 시장을 지배했던 때가 있다.

이때 네스케이프사는 HTML 페이지에서 경량의 프로그램 언어를 통해서 인터렉티브한 것을 추가 하기로 했다.

그래서 ‘브랜던 아이크’란 사람을 고용했는데 이 사람이 10일만에 만든게 ‘모카’라는 이름의 언어였다.

이 언어가 오늘날 자바스크립트의 전신이 된다.

 

‘모카'는 ‘라이브스크립트'로.

또 ‘라이브스크립트’는 ‘자바스크립트’ 라는 이름으로 발전의 발전과 함께 최종 변경되었다.

 

자, 아까 전 질문을 다시 한번 생각해보겠다.

 

JAVASCRIPT ? JAVA ? 그거 같은거 아냐?

아까도 말했지만 아니다. 근데 이름이 너무 비슷하다 ~ 왜냐구 ?

네스케이프사는 자바스크립트를 만들 때에 자바 문법과 유사하길 희망했다고 한다.

그렇게 해서 문법도 이름도 너무나 비슷하지만, 둘은 완전히 다른 언어이다.

 

 

 

저기요저기요❓❓❓ 근데 요즘은 왜 ES5, ES6 이렇게 불리나요?

ECMAScript ? 이게 자바스크립트라고?

자바스크립트가 나온 후에 MS사에서 IE 브라우저에서 동작하는 JScript 라는 언어를 만들었다. 예???

그래서 네스케이프사가 자바스크립트를 표준화 하기 위해서 표준화 기구인 Ecma International에 요청을 했다고 한다.

 

결국 표준화 명세서 작업이 시작되면서 1997년에 자바스크립트를 기반한 명세서가 완성되었다.

JAVA란 이름이 이미 상표등록을 해놨던터라 JavaScript라 이름을 쓸 수 없었고,

그에 따라 표준 언어라는 이름으로 ECMAScript라고 결정되었지만 대외적으로는 JavaScript라고 불리게되었다. (애칭마냥)

 

 

그래서 ES5, ES6 이게 뭔데요?

요즘 자바스크립트의 사용에 대해 물어볼 때에 ES5이나 ES6 할줄 아세요? 라고 물어보는 경우가 많다.

일단 숫자 앞에 나오는 ES는 ECMAScript를 뜻한다. 그 뒤에 나오는 숫자가 버전을 뜻하는데..

 

이것은 ECMAScript의 버전을 뜻하는 것인데 왜 굳이 ES5, ES6로 나뉠까?

일단 지금 시점(22.04)에서는 ES2022는 아직 릴리즈 되지 않았다. 즉 현재 최신 버전은 ES2021이다. 버전명(ES11) - 매년 6월에 릴리즈

이렇듯 최신버전이 이미 나와있는데 왜 굳이 굳이 굳이!!! ES5, ES6을 칭할까?

 

ES5버전은 대부분의 브라우저에서 지원된다.

그러나 ES6부터는 문법부터가 기존과는 많이 다르게 변경되었다. 또한 기능들 또한 많은 부분들이 추가 되었다. (대대적인 변화)

그렇기때문에 이를 크게 나눠 ES5, ES6을 다르게 보고 ES6부터는 모던 자바스크립트라고도 칭한다.

ES6부터는 기능별 지원되지 않는 브라우저가 있기 때문에 호환성을 위해 babel과 같은 컴파일러를 써서 레거시 브라우저에서도 동작 가능하게 만들어야 한다.

 

 

아래 포스팅에 자바스크립트의 주요 역사를 보면 자바스크립트가 무엇을 하는지, 어떻게 발전해왔는지 대략적으로 알 수 있다. 👇🏻👇🏻👇🏻👇🏻👇🏻

[번역] 자바스크립트의 역사 - 과거 | WIT블로그

 

 

 

 

 

그래서...

바닐라js ? 그건 또 뭔데

일단 바닐라(Vanilla) 그게 뭘까?

우측의 이미지가 바닐라다.

읭? 이게 뭐야... 맛있는 자바스크립트인가? 😒

이건 좀 미쿡식 너낌으로 가야 이해 할 수 있다.

 

바닐라 라는 옆의 사진 속 진짜 명칭을 뜻하는게 아니다.

바닐라는 다른 의미로 쓰이는데 Default, Original과 같은 의미로 쓰인다고 한다.

아마도 아이스크림 기본 맛이 바닐라여서 그렇게 뜻하는게 아닐까 ㅋㅋㅋ

 

 

 

 

 

자 들어보니 조금 의미가 이해가 갈까?

바닐라JS는 즉, 아무것도 포함하지 않은 기본의 자바스크립트를 뜻한다.

VanillaJS = JavaScript 라는 뜻이다.

 

왜 우린 그냥 자바스크립트라 말하지 않고 바닐라JS라고 할까?

순수한 바닐라JS를 기반으로 한 프레임워크, 라이브러리들이 많이 나와 있다. Vue.js, React, jQeury ....

이런 것들을 제외한 기본 그 자체를 뜻하는 말로 VanillaJS 라고 하는 것이다.

VanillaJS VS jQuery 성능 비교같은건 무수히 많으니 ...

바닐라 자바스크립트 성능 (속도) 비교

 

 

 

제이쿼리에 길들여졌던 나는 바닐라JS 업신 여겼지만 바닐라JS로 순수하게 짠 이벤트들을 보면 성능과 속도면에서 우수함을 인정하게 된다. 물론... 매우 귀찮긴하다.

 

 

 

 

 

이제 우리는 자바스크립트의 겉핥기식의 무엇인지를 배웠다.

 

당신이 기획자라면!

당신이 걍 궁금했던거라면!

당신이 개발자와 대화하기 위해 알아야 했던거라면!

여기서 끝마쳐도 괜찮다.

 

그러나 자바스크립트를 써야 한다면! 핵심은 다음부터 😏