TIL 23 | Javascript Basics +ɑ

meow·2020년 8월 19일
0

JavaScript

목록 보기
11/46

참고자료 : https://ko.javascript.info/js

엄격 모드

자바스크립트는 꽤 오랫동안 호환성 이슈 없이 발전해왔고, 기존의 기능을 변경하지 않으면서 새로운 기능이 추가되었다. 덕분에 기존에 작성한 코드는 절대 망가지지 않는다는 장점이 있었다. 2009년 ECMAScript5(ES5)가 등장하면서 새로운 기능이 추가되고 기존의 기능 일부가 변경되었다. 이로 인해 하위 호환성 문제가 발생하였고, 따라서 변경사항 대부분은 ES5의 기본 모드에선 활성화되지 않도록 설계되었다. 대신 use strict라는 특별한 지시자를 사용해 엄격 모드(strict mode)를 활성화 했을 때만 이 변경사항이 활성화되게 해놓았다.

use strict

지시자 "use strict", 혹은 'use strict'는 단순한 문자열처럼 생겼다. 하지만 이 지시자가 스크립트 최상단에 오면 스크립트 전체가 “모던한” 방식으로 동작한다.

"use strict";

// 이 코드는 모던한 방식으로 실행됩니다.
...

"use strict"는 스크립트 최상단이 아닌 함수 본문 맨 앞에 올 수도 있다. 이렇게 하면 오직 해당 함수만 엄격 모드로 실행된다. 하지만 엄격 모드는 대개 스크립트 전체에 적용한다.

"use strict"는 반드시 최상단에 위치시켜야 한다. 그렇지 않으면 엄격 모드가 활성화되지 않을 수도 있다.

alert("some code");
// 하단에 위치한 "use strict"는 스크립트 상단에 위치하지 않으므로 무시됩니다.
"use strict";
// 엄격 모드가 활성화되지 않습니다.

"use strict"의 위에는 주석만 사용할 수 있다.

use strict를 취소할 방법은 없다. 자바스크립트 엔진을 이전 방식으로 되돌리는 "no use strict"같은 지시자는 존재하지 않는다. 일단 엄격 모드가 적용되면 돌이킬 방법은 없다.

브라우저 콘솔

개발한 기능을 테스트하기 위해 브라우저 콘솔을 사용하는 경우, 기본적으로 use strict가 적용되어있지 않는다는 점에 주의해야 한다. 콘솔에서 use strict를 사용하기 위해서는 'use strict'를 입력한 후, Shift+Enter 키를 눌러 줄 바꿈 해 원하는 스크립트를 입력하면 된다.

'use strict'; <Shift+Enter를 눌러  바꿈 >
//  ...테스트하려는 코드 입력
<Enter를 눌러 실행>

'use strict'를 꼭 사용해야 할까?

모던 자바스크립트는 '클래스’와 '모듈’이라 불리는 진일보한 구조를 제공한다. 이 둘을 사용하면 use strict가 자동으로 적용된다. 따라서 이 둘을 사용하고 있다면 스크립트에 "use strict"를 붙일 필요가 없다.

변수와 상수

변수 명명 규칙

자바스크립트에선 변수 명명 시 두 가지 제약 사항이 있다.

  1. 변수명에는 오직 문자숫자, 그리고 기호 $_만 들어갈 수 있습니다.
  2. 첫 글자는 숫자가 될 수 없습니다.
//유효한 변수명의 예시
let userName;
let test123;

카멜 표기법

여러 단어를 조합하여 변수명을 만들 땐 카멜 표기법(camelCase)가 흔히 사용된다. 카멜 표기법은 단어를 차례대로 나열하면서 첫 단어를 제외한 각 단어의 첫 글자를 대문자로 작성한다. ex) myVeryLongName

변수명에 사용할 수 있는 달러 기호 '$' 와 밑줄 '_' 은 일반 글자와 같이 특별한 의미를 지니지는 않는다.

// 아래는 유효한 변수명에 관한 예시입니다.

let $ = 1; // '$'라는 이름의 변수를 선언합니다.
let _ = 2; // '_'라는 이름의 변수를 선언합니다.

alert($ + _); // 3

// 아래는 잘못된 변수명의 예시입니다.

let 1a; // 변수명은 숫자로 시작해선 안 됩니다.
let my-name; // 하이픈 '-'은 변수명에 올 수 없습니다.

대·소문자 구별
appleAppLE은 서로 다른 변수이다.

비 라틴계 언어도 변수명에 사용할 수 있지만 권장하진 않는다. 키릴 문자, 심지어 상형문자도 변수명에 사용할 수 있다. 심지어 모든 언어를 변수명에 사용할 수 있다.

let имя = '...';
let 我 = '...';

위 코드에는 기술적인 에러가 없고 변수명도 유효하다. 하지만 영어를 변수명에 사용하는 것이 국제적인 관습이므로, 변수명은 영어를 사용해서 만드는 것을 권유한다.

예약어
예약어(reserved name) 목록에 있는 단어는 변수명으로 사용할 수 없다.
예약어 예시: let, class, return, function
아래 코드는 문법 에러를 발생시킨다.

let let = 5; // 'let'을 변수명으로 사용할 수 없으므로 에러!
let return = 5; // 'return'을 변수명으로 사용할 수 없으므로 에러!

변수명이 중요한 이유

변수명은 훗날 내 코드를 보는 다른 개발자, 또는 협업 과정에서 커뮤니케이션하는데 있어 개발의 효율성을 높여주기 때문에 정말 중요하다. 따라서 변수명을 지을때는 모호하지 않고, 변수명만으로도 추측이 가능하게끔 지어야 한다. 변수명을 지어주는 사이트까지 있을 정도이다.

let, const

원래 JavaScript의 변수 선언은 var를 통해서만 가능했는데, 버전이 올라가면서(ES5 to ES6) letconst라는 키워드가 새롭게 생겼다. 대신 let 키워드를 사용하면 변수 값을 수정할 수 있고, const 키워드를 사용한 변수는 수정할 수가 없다.

const로 선언한 변수를 '상수(constant)'라고 부른다. 상수는 재할당할 수 없으므로 상수를 변경하려고 하면 에러가 발생한다. 다른 개발자들에게 이 변수는 상수라는 것을 알릴 수 있기 때문에 잘 사용하면 유용하다.

변수 값 수정

변수에는 값을 저장할 수 있고, 수정도 가능하다. 값을 수정할 때는 변수 앞에 let 키워드를 사용하지 않는다. let 키워드는 변수를 새로 생성할 때만 사용한다.

다음과 같은 방법으로 변수명에 새로운 값을 할당할 수 있다.

(이미 선언해둔) 변수명 = 새로운 값;

// 예시

let name = "김개발"; 
let job = "frontend developer";

name = "김코딩";
job = "목수";
profile
🌙`、、`ヽ`ヽ`、、ヽヽ、`、ヽ`ヽ`ヽヽ` ヽ`、`ヽ`、ヽ``、ヽ`ヽ`、ヽヽ`ヽ、ヽ `ヽ、ヽヽ`ヽ`、``ヽ`ヽ、ヽ、ヽ`ヽ`ヽ 、ヽ`ヽ`ヽ、ヽ、ヽ`ヽ`ヽ 、ヽ、ヽ、ヽ``、ヽ`、ヽヽ 🚶‍♀ ヽ``ヽ``、ヽ`、

0개의 댓글