함수 선언문: 어디서든 호출 가능
function sayHello(){
console.log('Hello');
}
sayHello(); → 선언문 맨 위에 위치해도 똑같이 동작함.
javascript는 위에서 아래로 순차적으로 실행되며, 즉시 결과를 반환하는 프로그래밍 언어=인터프리터 언어(Interpreted language)
호이스팅: 실행 전 코드의 모든 함수 선언문을 저장해서 생성해놓음. → 이로 인해 선언문의 위치에 상관없이 동일하게 실행.
vs 함수 표현식
let sayHello = function(){
console.log('Hello');
}
sayHello(); → 함수 표현식은 함수를 한 줄씩 읽어내려가므로 그 이후에 선언될 때만 사용가능.
함수 선언문을 사용하는 게 더 자유롭고 편함.
------------------------------------------------------------------------------------------------------------------------------------------------
화살표 함수
let add = function(num1, num2){
return num1 + num2;
}
let add = (num1, num2) =>{
return num1 + num2;
}
let add = (num1, num2) =>( return문을 중괄호 빼고 괄호로 표현가능
num1 + num2;
)
let add =(num1, num2) => num1 + num2; return문이 한 줄이면 괄호빼 한줄로 표현가능
*인수가 하나면 괄호 생략 가능
let sayHello = name => `Hello, ${name}`;
*인수가 없는 함수는 괄호 생략 불가능
let showError = () => {
alert('error!');
}
*return문 전에 여러줄의 구문이 있을 경우, 일반 괄호 사용x
1)잘못된 예
let add = function(num1, num2){
const result = num1 + num2;
return result;
}
2)올바른 예
let add = (num1, num2) => {
const result = num1 + num2;
result result;
}
const sayHello = function (name){
const msg = `Hello, ${name}`;
console.log(msg);
};
//화살표 함수
const sayHello = (name) => {
const msg = `Hello, ${name}`;
console.log(msg);
};
const add = function (num1, num2) {
const result = num1 + num2;
return result;
};
//화살표 함수
const add = (num1, num2) => {
const result = num1 + num2;
return result;
};
//
const add = (num1, num2) => {
return = num1 + num2;
};
//
const add = (num1, num2) => (
num1 + num2;
);
//
const add = (num1, num2) => num1 + num2;
'프로그래밍 > Javascript' 카테고리의 다른 글
자바스크립트 기초 강좌 13- 객체(Object)-method, this (0) | 2023.06.09 |
---|---|
자바스크립트 기초 강좌 12- 객체(Object) (1) | 2023.06.07 |
자바스크립트 기초 강좌 10- 함수(function)의 기초 (0) | 2023.06.06 |
자바스크립트 기초 강좌 9- switch문 (0) | 2023.06.05 |
자바스크립트 기초 강좌 8- 반복문(for, while, do while) (0) | 2023.06.05 |