[웹 개발] JavaScript - prologue

입사 후 작업하며 공부한 것을 토대로 글을 작성하고자 합니다.

주로 웹 클라이언트단을 작업하고 있는 신입입니다.

 

참고사항

도서

Learning JavaScript – O’Reily

jQuery를 활용한 인터랙티브 웹 콘텐츠 제작

 

사이트

https://poiemaweb.com/

https://www.w3schools.com/

그 외 수 많은 블로그

 

주로 JAVA를 공부했었습니다만...

앞단을 작업하기 위해 JavaScript를 공부하게되었습니다.

JavaScript에 대한 기초지식은 전무했고 일을 하며 공부한 것을 바탕으로 글을 작성하려 합니다.

먼저 Javascript는 HTML, CSS와 함께 웹을 구성하는 요소중 하나로 웹브라우저에서 동작하는 유일한 언어이며,멀티-패러다임 언어로 명령형, 함수형, 프로토타입 기반 객체지향 언어입니다.

 

HTML은 웹 페이지에서 우리가 문단, 표, 이미지 등을 정의하고 구조를 나타내는 마크업 언어 입니다.

CSS는 HTML컨텐츠의 배경, 폰트, 레이아웃등을 지정해 스타일을 꾸며주는 규칙 언어입니다.

JavaScript는 웹 페이지의 그려진 컨텐츠를 동적으로 바꾸고, 움직이도록 꾸며주는 프로그래밍 언어입니다.

단순하게 말하자면 HTML은 구조설계, CSS는 스타일부여, JavaScript는 동적 효과 부여 입니다.

 

지금은 JavaScript가 웹을 만들기 위한 언어라는 것만 기억합시다.

JavaScript는 웹 개발을 위해 개발되었지만

jQuery의 등장으로 번거로웠던 DOM을 보다 쉽게 제어 하게 되었고,

Node.js의 등장으로 웹 브라우저를 벗어나 서버 사이드에서 사용되는 full-stack 개발 언어가 되었으며,

PhoneGap, Sencha Touch, Ionic 과 같은 모바일 하이브리드 앱,

Electron, AppJS 로 Desktop 부분을,

Cylon.js, NodeBots 은 로봇 제어에 사용되는 언어로서 인정되어 쓰이고 있습니다.

 

또한 SPA(Single Page Application)가 대중화되면서 Angular, React, Vue.js 등 다양한 SPA Framework/Library 또한 많은 사용층을 확보하고 있습니다.

저의 경우에는 기초부분인 JavaScript와 jQuery를 함께 공부하였습니다.

 

<jQuery에 대해 잠깐>

jQuery는

클라이언트 측 HTML 스크립팅을 간소화하기 위해 고안된 크로스 플랫폼 자바스크립트 라이브러리다. jQuery는 오늘날 가장 인기 있는 자바스크립트 라이브러리입니다. 웹 상에서 가장 트래픽이 많은 상위 천만 개의 사이트 중 65%에서 사용 중입니다. jQuery는 MIT 라이선스로 배포되는 무료 오픈소스 소프트웨어입니다.

라고 위키피디아에 정의되어있습니다.

 

예를 들자면 

<div id="sample"></div>

라는 태그가 있을 경우 id를 통해 div를 검색하는 방법으로

JavaScript에서는 

document.getElementByIdName('sample'); 

jQuery에서는

1

$("#sample");

cs

로 표시할 수 있습니다. 

jQuery를 사용한다면 코드량을 줄이고 직관적으로 작성할 수 있습니다.

그러면 jQuery만 배우면 되는 것 아닌가? 할 수도 있지만 jQuery이전부터 작업한 프로젝트나 JavaScript로 작성하는 사람과의 공동작업을 생각하면 적어도 어떻게 작동되는지는 알아야 다른 사람이 작성한 코드를 이해하고 관련 작업을 할 때 원활할 것입니다.

 </jQuery에 대해 잠깐>

앞으로 제가 작성하고자 하는 내용은 JavaScript로 시작해 jQuery 그리고 ES6까지 작성하고자 합니다.

<ES6에 대해 잠깐>

ES6는 2015년에 새로운 문법이 추가된 JavaScript의 사양이며 이전까지를 ES5(ECMASCRIPT2009)로 나타납니다.

 

ES6는 ECMASCRIPT2015, ES2015라고도 불립니다. (숫자는 버전 혹은 발표된 년도를 뜻합니다)

 

최근에는 2018년 ES9까지도 나와있지만, 문법이 가장 크게 추가됐다고 생각되는 시점이 ES6라 생각하며, 2015년 이후부터는 매해 ES2015, ES2016 처럼 새로운 버전을 발표고있습니다.

 

새롭개 발표하고있는 버전들은 특정 문법이 사라지거나 바뀐 것이 아닌 편의성을 향상시키고 프로토타입언어인 JavaScript에서 발생되던 문제점들을 해결할 방법을 제시하고 있다고 보시면 됩니다.

 

ES6는 후에 자세히 작성하도록 하겠습니다.

</ES6에 대해 잠깐>