1. 자바스크립트 (JavaScript) 언어의 역사
자바스크립트(JavaScript)는 현재 웹 개발 및 앱 개발에서 가장 널리 사용되는 프로그래밍 언어 중 하나입니다. 이 언어의 역사를 간단히 요약하면 다음과 같습니다:
1. 초기 개발:
- 1995년, 넷스케이프 커뮤니케이션즈(네비게이터 브라우저(90% 이상의 점유율)를 개발)의 프로그래머 브렌단 아이크(Brendan Eich)가 익스플로러로 인한 점유율 하락을 극복하기 위한 방안 중 하나로 "모카(Mocha)"라는 언어를 개발했다. (나중에 "라이브스크립트(LiveScript)"로 이름이 변경되었다.)
2. 자바스크립트로의 이름 변경:
- 1995년 말, 선 마이크로시스템스(Sun Microsystems)의 자바(Java) 인기에 편승하기 위해 "자바스크립트"로 이름을 변경하였으나, 자바와 직접적인 관련은 없다.
3. 브라우저 전쟁:
- 1990년대 후반, 다양한 브라우저에서 자바스크립트 지원을 추가하면서 웹 페이지 상에서 동적인 기능을 제공하기 시작했다.
- Microsoft Corporation(마이크로소프트)의 익스플로러의 jscript가 등장했다. jscript 는 호환성 문제로 크로스 브라우징 이슈가 발생한다.
4. ECMAScript 표준:
- 1997년, 자바스크립트 언어의 표준화를 위해 ECMA International에서 ECMAScript라는 표준을 정의하였다.
5. AJAX의 부상:
- 2000년대 초, 자바스크립트를 사용한 비동기 통신 기술인 AJAX(Asynchronous JavaScript and XML)의 등장으로 웹 애플리케이션의 개발이 혁신적으로 진화하였다.
6. 노드.js(Node.js) 등장:
- 2009년, 라이언 달(Ryan Dahl)이 개발한 노드.js(Node.js)로 자바스크립트가 서버 측 프로그래밍에서도 활용되기 시작했다.
7. 프론트엔드 프레임워크와 라이브러리:
- 2010년대, Angular, React, Vue.js와 같은 프론트엔드 프레임워크 및 라이브러리의 등장으로 웹 개발은 더욱 강력하고 효율적으로 진행되었다.
8. ES6(ECMAScript 2015) 및 이후 버전:
- 최신 ECMAScript 표준(ES6 이후)의 도입으로 자바스크립트 언어에 많은 개선 사항과 기능이 추가되었으며, 모던 웹 개발을 위한 강력한 기능을 제공하고 있다.
역사를 알면 언어의 기반을 이해하는 데 도움이 되며, 언어가 어떻게 진화하고 발전해왔는지 이해하면 해당 언어의 설계 원리와 사용 사례를 더 잘 이해할 수 있습니다. 자바스크립트 언어의 발전을 염두해두고 자바스크립트 언어 공부를 시작해봅니다.
2. 자바 스크립트의 특징
- 객체 기반의 스크립트 언어입니다.
- 대소문자를 구별합니다.
- 문장 끝에 ;(세미콜론)을 사용합니다. (현재는 생략가능)
3. 자바 스크립트의 출력
- Web API Console을 통해 브라우저 Console 창에 출력됩니다.
<script> ~ </script> 에 작성 (head, body 어디에 넣든 가능)
외부 자바스크립트로 사용: <script src='파일명'></script>
4. 자바 스크립트의 실행 순서
- 인터프리터 방식이므로 위에서 아래로 실행됩니다.
✔ JavaScript파일 및 문장을 <head> ~ </head> 사이에 넣었을 경우
문서 시작 -> <head>에 있는 <script>를 다운로드 또는 실행 -> <body>에 있는 html 태그를 실행 -> 끝
(파일 실행이나 다운로드가 느리거나 안되면 HTML 실행되지 않은 상태에서 빈 화면이 보일 수 있음)
✔ JavaScript파일 및 문장을 <body> 끝에 넣었을 경우
문서 시작 -> <body>에 있는 HTML 태그를 실행 -> <script>를 다운로드 또는 실행 -> 끝
(완벽하지 않은 HTML문서가 먼저 보여, 잘못된 UI가 실행될 수 있음)
✔ <script async>를 사용할 경우 >잘 사용X
문서 시작 -> <script>를 다운로드 또는 실행 -> <body>에 있는 HTML 태그를 실행 -> 끝
(script 파일이 여러개 있을 경우 먼저 다운로드된 script 파일을 먼저 실행하게 됨. script 파일이 서로 연관성이 있는 경우 하나의 스크립트만 실행하면 문제가 발생할 수 있음. > 잘 사용X)
✔ <script defer>를 사용할 경우
문서 시작 -> <script>를 다운로드 또는 실행 -> <body>에 있는 HTML 태그를 실행 -> 끝
(HTML 시작되고 script 파일을 동시에 다운로드/실행을 진행. script 실행은 페이지 구성이 모두 끝날 때까지 지연 -> script 순서에 따라 실행)
✔ 익스텐션 설치
JavaScript (ES6) code snippets
(자바스크립트 문법 자동완성을 도와주는 도구. ES6 부터 문법에 많은 변화가 있었기 때문에 6부터 공부하는것이 좋다.)
✔ 트랜스 컴파일러
- 과거 브라우저 및 특정 브라우저 버전등을 모두 사용할 수 있도록 해석해주는 라이브러리
- BABEL
✔ CSS, JavaScript의 변경된 내용이 반영되지 않을 경우(캐쉬가 남을 경우)
1. f12키 -> 새로고침 버튼을 누르고 있는 상태에서 '강력 새로고침'을 선택
2. 컨트롤 + 쉬프트 + R
✔ 주석문
// : 한줄 주석
/* 내용 */ : 여러줄 주석
'웹 > JavaScript' 카테고리의 다른 글
| Interval, Timeout 함수 (0) | 2023.10.28 |
|---|---|
| 프로토타입/상속 (0) | 2023.10.28 |
| 자바스크립트(배열/함수) (0) | 2023.10.21 |
| 자바스크립트(연산자/조건문/반복문) (0) | 2023.10.21 |
| 자바스크립트(변수/타입) (0) | 2023.10.21 |
