하루하루 꾸준히, 인생은 되는대로

카테고리 없음

자바스크립트 1일차(2022-05-03)

긤효중 2022. 5. 3. 13:39

모던 마크업

<script>태그에는 몇가지 속성이 있다. 

type 속성 : <script type = ...>

 

HTML4에서 스크립트에 타입을 명시하는 것이 필수였다. 따라서 type = "text/javascript" 속성이 붙은 스크립트를 어렵지 않게 볼 수 있었다.

 

이제 타입 명시는 필수가 아니다. 게다가 모던 HTML표준에서 이 속성의 의미가 바뀌었다.

이 속성은 자바스크립트 모듈에 사용할 수 있다.

 

language 속성 : <script language = ..>

 

이 속성은 현재 사용하고 있는 스크립트 언어를 나타낸다.


외부 스크립트

자바스크립트 코드의 양이 많은 경우, 파일로 소분해서 저장할 수 있다.

이렇게 분해해 놓은 파일은 src 속성을 통해 HTML에 삽입한다.

 

<script src = "/path/to/script.js"></script>

 

여기서 /path/to/srcipt.js는 사이트의 루트에서부터 파일이 위치한 절대경로를 나타낸다.

현재 페이지에서의 상대경로를 사용하는 것도 가능하다. 같은 폴더 내의 파일인 "script.js"

를 src = "script.js"로 참조할 수 있다.


주의해야 할 점

HTML안에 직접 스크립트를 작성하는 방법은  스크립트가 간단할떄만 사용하는 것이 좋다.

스크립트를 별도의 파일에 작성하면 브라우저가 스크립트를 다운받아 캐시에 저장하기 떄문에,

성능상의 이점이 있다.

 

여러 페이지에서 동일한 스크립트를 사용할 떄, 브라우저는 페이지가 바뀔때마다 스크립트를 다운받지 않고, 캐시로부터 스크립트를 가져와 사용한다.

 

이를 통해 트래픽이 절약되고 속도가 빨라진다.

 

->Src 속성이 있으면 태그 내부의 코드는 무시된다(이 코드의 alert(1)은 무시된다)

<script src="file.js">

alert(1); 

</script>


자바스크립트 엄격 모드

자바스크립트는 꽤 오래동안 호환성 이슈 없이 발전해왔다. 기존의 기능을 변경하지 않으면서 새로운 기능이 추가되었다. 

덕분에 기존에 작성한 코드는 절대 망가지지 않는 특성이 있었다. 이런 상황은 ES5가 등장하기 전까지 지속되었다. 

새롭게 제정된 ES5에서 새로운 기능이 추가되고 기존 기능 중 일부가 변경되었다. 기존 기능을 변경했기 때문에, 호환성 이슈가 발생할 수도 있었다.

 

그래서 변경사항 대부분엔 ES5의 기본 모드에선 활성화되지 않도록 설계되었다. 

대신 use strict  라는 특별한 지시자를 사용해 엄격 모드를 활성화 시켰을 떄만 이 변경사항이 활성화된다.

 

"use strict"는 코드 최상단에 위치한다. ->일단 엄격모드가 활성화되면 취소할 방법은 없다


자바스크립트 자료형(동적 타이핑)

NaN -> 계산 중에 에러가 발생한 경우 나타나는 값. 부정확하거나 정의되지 않은 수학 연산을 사용할 떄 에러가 발생하고 , NaN이 반환된다.

 

BigInt

 

내부 표현 방식 떄문에 자바스크립트에서는 2^53-1 (9007199254740991)보다 큰 값, 혹은 -(2^53-1)보다 작은 정수는 숫자형을 사용해 나타낼 수 없다.

 

Bigint형 값은 정수 리터럴 끝에 n을 붙이면 만들 수 있다.

ex_)

const bigInt = 1234567890123456789012345678901234567890n;

 

역 따옴표로 변수나 표현식을 감싼 뒤, ${…} 안에 넣어주면, 변수나 표현식을 문자열 중간에 얻을 수 있다.

 

ex_)

let name = "john";
alert(`Hello , ${name} !`);

 

 

NULL

자바스크립트의 NULL은 다른언어의 NULL과 성격이 다르다. 다른언어에서 NULL은 '존재하지 않는 객체에 대한 참조'나 '널 포인터'를 나타낼때 사용된다.

 

하지만 자바스크립트에서 NULL은 '존재하지 않는' 값, '비어있는 값', '알 수 없는 값' 을 나타내는데 사용된다.let age = null;은 나이를 알수 없거나, 그 값이 비어있음을 보여준다.

 

Undefined

undefined값도 null값처럼 자신만의 자료형을 형성한다.undefined는 '값이 할당되어 있지 않은 상태' 를 나타낼떄 사용된다.변수에 명시적으로 undefined를 할당하는 것도 가능하다

 

객체와 심볼

객체(object)는 특수한 자료형이다.객체는 데이터 컬렉션이나 복잡한 개체를 표현 할 수 있다.

 

심볼(symbol)은 객체의 고유한 식별자(unique identifier)를 만들 떄 사용된다.