Front-End/Javascript
javascript - function
태나미
2021. 1. 31. 17:04
function is object type
Parameters
premitive parameters: passed by value
object parameters: passed by reference (메모리에 ref가 전달)
Rest parameters ( ES6에서 추가)
// parameters가 ...으로 선언하면 배열로 전달되어진다.
function printAll(...args) {
for(let i = 0; i < args.length; i++){
console.log(args[i]);
};
//위와 같음
for( const arg of args) {
console.log(arg);
};
//위와 같음
args.forEach((arg) => console.log(arg));
};
printAll('kim', 'tae', 'nam');
// kim
// tae
// nam
Local scope
let globalMsg = 'global'; //global로 선언
function printMsg() {
let msg = 'hello world'; //함수안에서 local로 선언
console.log(msg); // hello world
console.log(globalMsg); // global
function printAnother() {
console.log(msg); // hello world
let subMsg = 'test';
}
console.log(subMsg); // Uncaught ReferenceError: subMsg is not defined
};
printMsg();
console.log(msg); // Uncaught ReferenceError: msg is not defined
밖에서는 안이 보이지 않고, 안에서만 밖을 볼 수 있다.
모든 함수에서는 return undefined가 생략 되어있음.
First-class function
- 함수를 다른 변수와 동일하게 다루는 언어는 일급 함수를 가졌다고 말한다.
- 다른 객체 처럼 함수를 변수에 할당이 가능하고 함수에 인자로 함수를 전달하고 함수를 Return하는 함수를 만들수 도 있다.
함수 선언식과 함수 표현식
함수 선언식 은 선언하기 이전에 호출될 수 있다. (호이스팅).
declaration(); // declaration
function declaration() {
console.log('declaration');
}
함수 표현식 은 함수를 선언함과 동시에 값이 할당된다. => 할당된 다음부터 호출이 가능
expression(); // Uncaught ReferenceError: Cannot access 'expression' before initialization
const expression = function () {
console.log('expression');
};
함수 선언식은 자바스크립트의 특징인 호이스팅에 따라 브라우저가 자바스크립트를 해석할 때 맨 위로 끌어 올려진다.
Callback function
콜백 함수는 함수 표현식을 사용한다.
파라미터에 함수를 전달해서 상황에 맞는 함수를 부르는 것을 콜백 함수라 한다.
function randomPrint(answer, printYes, printNo) {
if (answer === "taenam") {
printYes();
} else {
printNo();
}
}
// anonymous function
const printYes = function () {
console.log('yes');
};
// named function
const printNo = function print() {
console.log('no');
};
randomPrint('jihun', printYes, printNo); //no
randomPrint('taenam', printYes, printNo); //yes
named function은 디버깅을 할때, stack traces에 함수 이름을 하기 위해 쓰인다.
Arrow function
const simplePrint = function () {
console.log('simple print');
};
// 위와 같음
const simplePrint = () => console.log('simple print');
출처: