2.16 Function expressions

히진로그·2022년 2월 5일
0

Modern-Javascript

목록 보기
13/14

출처: https://javascript.info/

  • 혼자 읽고 타이핑하며 이해하면서 공부한 흔적 남기기

자바스크립트에서 함수는 매직 언어 구조가 아니지만 특별한 종류의 값이다.

There is another syntax for creating a function that is called a Function Expression.

It allows us to create a new function in the middle of any expression.

어떤 표현의 중간에 함수를 만들 수 있게 해준다.

let sayHi = function() {
		alert("Hello");
};

*note: There's no name after the function keyword. Omitting a name is allowed for function Expressions.

여기서 즉시 변수를 할당해준다. 즉 함수를 만들고 sayHi라는 변수에 넣어라.

Function is a value

힘수가 어떻게 생성되는 함수는 값이다. a function is a value.

function sayHi() {
	alert("Hello");
}

alert(sayHi); // show the function code

let func = sayHi;

The code above shows its string representation, which is the source code.

We can copy a function to another variable.

Call back functions

We'll write a function ask(question, yes, no) with three parameters:

The idea is that we pass a function and expect it to be "called back" later if necessary.

함수를 보내고, 나중에 필요할때 콜백 될수 있도록 기대하는 것.

function ask(question, yes, no) {
  if (confirm(question)) yes()
  else no();
}

ask(
  "Do you agree?",
  function() { alert("You agreed."); },
  function() { alert("You canceled the execution."); }
);

여기서 함수는 ask 바로 안에 선언되어 있다. 이런 함수들은 ask 밖에서 호출할 수 없다.(because they are not assigned to variables), 그러나 이게 우리가 여기서 원하는 것이다.

Function Expression vs Function Declaration

함수 표현과 함수 선언의 핵심 다른 점?

  1. The syntax: how to differentiate between them in the code.

A Function Expression is created when the execution reaches it and is usable only from that moment. 함수 표현식은 실행되는 그 순간에만 사용되고 그 순간에 도달했을 때 생성될 수 있다.

-usable: assigned, called, etc.

Function Expressions are created when the execution reaches them.

A Function Declaration can be called earlier than it is defined.

함수 선언은 정의 되기 전 호출 될 수 있다. (당근게임에서 했던 것 처럼)

That's due to internal algorithms. When JavaScript prepares to run the script, it first looks for gloabal Function Declarations in it and creates the functions. We can think of it as an "initialization stage".

And after all Function Declarations are processed, the code is executed. So it has access to these functions.

strict mode에서 코드 블럭 안의 함수 선언은 블럭 안 어디서든 호출가능하지만, 외부에서는 호출할 수 없다.

let age = prompt("What is your age?", 18);

if(age < 18) {
  function welcome() {
    alert("Hello!");
  }

  welcome(); // work
}else {
  function welcome() {
    alert("Greetings!");
  }
}

welcome(); // Error

welcome을 if문 밖에서 호출할 수 있도록 하려면 어떻게 해야될까?

함수 표현식을 사용하면 가능하다. if문 밖에 선언한 변수 welcome에 함수 표현식으로 만든 함수를 할당하면 된다.

let age = prompt("What is your age?", 18);

if(age < 18) {
  welcome = function() {
    alert("Hello!");
  }
}else {
  welcome = function() {
    alert("Greetings!");
  }
}

welcome(); /

혹은 좀 더 간단하게 question mark operator ? 를 사용해서 만들 수 도 있다.

let age = prompt("What is your age?", 18);

let welcome = (age >18) ?
	function() {alert("Hello!");} :
	function() {alert("Hello!");};

welcome();

0개의 댓글