[자바스크립트/Javascript] 문법(1)

cool_kim·2021년 7월 17일
0

Javascript

목록 보기
5/7
post-thumbnail

5.1 문과 표현식

🔹 문(Statement)
🔹 표현식(Expression)

  • 단일한, 특정한 결괏값으로 계산

✔️ 모든 문은 완료 값(Completion Value)을 가진다
✔️ 표현식의 부수효과

  • 증가, 감소 연산자를 후위 연산자로 사용시
  • delete함수
  • 할당 표현식 ( = )

콘텍스트 규칙

1) 중괄호

  1. 객체 리터럴
    var a = { foo: bar() };

  2. 레이블
    { foo: bar() }
    ➕ 레이블 점프 : continue & break

2) 블록

[] + {}; //"[object Object]"
{} + []; // 0
  1. 윗 줄에서 엔진은 + 연산자 표현식의 {}를 실제 값으로 해석 → []는 " " 로 강제 변환 → "[object Object]" 로 강제변환
  2. 아랫 줄의 {}는 동떨어진 빈 블록으로 간주 → + [] 표현식에서 명시적으로 [] 를 숫자 0으로 강제변환

3) 객체 분해

: 객체 분해 시 { } 사용

function getData() {
	// ...
	return {
		a: 42,
		b: "foo"
	};
}

var { a, b } = getData();
console.log( a, b ); // 42 "foo"

4) else if와 선택적 블록

📍 자바스크립트 문법에 else if같은 것은 없음
정확한 문법은 다음과 같음

if(a) {
	//...
}
else {
	if (b) {
		//...
	}
	else {
		//...
	}
}


5.2 연산자 우선순위

var a = 42, b;
b = ( a++, a );
a; // 43
b; // 43

var a = 42, b;
b = a++, a;
a; // 43
b; //42

💡 , 연산자가 = 연산자보다 우선순위가 낮아서 값이 달라짐

if(str && (matches = str.match( /[aeiou]/g ))) {
	//...
}

💡 &&가 =보다 우선순위가 높으므로 ()로 묶지 않으면 달라짐

true || false && false; //true

(true || false) && false; // false
true || (false && false); // true

💡 좌측 → 우측 연산이라고 생각하지만 &&가 || 보다 우선하여 처리됨!!



단락 평가

: &&, || 연산자는 좌측 피연산자의 평가 결과만으로 전체 결과가 이미 결정될 경우 우측 피연산자의 평가를 건너뜀
ex) a && b 에서 a가 falsy면 b는 쳐다보지 않음

📌 && > || > ? : 순으로 우선순위 높음


결합성

대부분 좌측 결합성을 가지지만 예외 연산자가 있음

  • ? : : 우측 결합성을 가짐
  • = : 우측 결합성을 가짐

💡 정확히 하고자 () 로 그룹핑해주면 햇갈일 일 없다!



5.3 세미콜론 자동 삽입

ASI : 자바스크립트 프로그램의 세미콜론이 누락된 곳에 엔진이 자동으로 ;를 삽입

💡 break, continue, return, yield 키워드에서 활약



5.4 에러

: 자바스크립트에는 하위 에러 타입 뿐만 아니라 일부 에러는 컴파일 시점에 발생하도록 문법적으로 정의되어 있음

📍 정규 표현식 리터럴 내부의 구문

var a = /+foo/; //에러

📍 식별자가 아닌 것에 할당
var a;
42 = a; //에러

📍 엄격 모드에서 함수 인자명 중복

function foo(a, b, a) {} //정상실행
function bar(a, b, a) { "use strict"; } //에러

📍 동일한 이름의 프로퍼티가 여러개 있는 객체 리터럴

(function() {
	"use strict";
	var a = {
		b: 42,
		b: 43
	}; //에러
})();

💡 임시 데드 존(TDZ) : 아직 초기화를 하지 않아 변수를 참조할 수 없는 코드 영역

a = 2; //ReferenceError
let a;
profile
FE developer

0개의 댓글