JavaScript - 표현식

 

자바스크립트 뿐 아니라 프로그래밍 언어 기초공부를 하며 표현식이라는 단어를 참 많이 들은 것 같다.

표현식이 뭘까? 자세히 알아보자

 

표현식

표현식은 쉽게말해 값이 나오는 코드이다.

(숫자 같은) 값들, 연산자, 변수 및 함수의 조합으로 이루어져 있다

 

const x = ___ 처럼 변수에 할당된 일반적인 표현식이 있고,

const x =  이부분을 쏙 빼고  5 + 10 같은 알맹이만 사용하는 문장 표현식이 있다

// 변수에 할당된 표현식 (숫자 값들의 덧셈)
const sum = 5 + 10; //  15로 평가

// 변수에 할당된 표현식 (변수와 연산자를 사용)
const x = 20;
const y = 30;
const result = x * y; // 600으로 평가

// 문장 표현식 (변수에 할당x)
console.log(10 - 5);

 

 

함수 표현식

위에서 함수도 표현식이 될 수 있다고 했다. 함수도 값을 반환하기 때문이다.

 

함수 선언문을 통해 함수를 최초 정의하고,

함수 표현식을 통해 변수에 할당하여 사용하기도 한다.

// 함수 선언문
function add(a, b) {
  return a + b;
}

// 함수 표현식 (변수에 할당)
var total = add(15, 25); // 40으로 평가

 

 

함수 표현식의 종류에는 기명(네임드) 함수 표현식, 익명 함수 표현식, 화살표함수, 즉시 호출 함수(IIFE) 가 있다.

 // 기명 함수 표현식
 const add = function sum(a, b) { // 함수이름(sum)이 있음
   return a + b;
 }
 
 // 익명 함수 표현식
 const minus = function(a, b) { // 함수 이름이 없음
   return a - b;
 }
 
 // 화살표 함수 표현식
 const multiply = (a, b) => a * b; // 익명함수는 화살표함수로도 작성가능
 
 // 즉시 호출 함수
 var result = (function() {
    var message = 'Hello, IIFE!';
    return message;
 })();

 

 

즉시 호출 함수

즉시 호출 함수(Immediately Invoked Function Expression)는 선언한 함수를 바로 호출한다

원래 선언과 호출은 각각 사용하는데 얘는 선언하자마자 호출이 되는 친구라서 다른 것이다

→ 그래서 한번만 실행되고 재사용되지 않는 코드블록을 만들 때 유용하다

 

→ 코드 블록을 캡슐화하고 스코프를 제한하기 위해 사용된다

해당 함수 코드블록만 따로 떼어놓는다(캡슐화) 그래서 스코프도 함수 내부로 제한이 된다 a.k.a 접근 제한구역 🚧)

(function() {
  var localVar = 'IIFE Variable';
  console.log(localVar); // localVar 값이 잘나옴
})();

console.log(localVar); // 에러! localVar는 익명함수 내부로만 사용이 제한

 

 

화살표 함수

화살표 함수는 보통 inner 함수 등 을 표현할 때 사용을 한다

 

no Arguments 

args 자체가 동작하지 않는다. 

 

no New 

생성자 함수로 사용할수가 없다 

 

no THIS 

함수 내부에 this 자체가 없어 this 값을 받지 못한다

만약 this.student 이런식으로 사용한다면 this 를 모르기 때문에 주변 스코프의 this.student 변수를 찾게 된다

용케 상위스코프에서 찾아왔다