Frontend/JavaScript

[JS] Function

:_: 2022. 3. 31. 19:04

Function 

- fundamental building block in the program : 프로그램에서 중요한 기본적인 빌딩 블록

- subprogram can be used multiple times : 서브 프로그램이라 불리며 여러번 재사용 가능

- performs a task or calculates a value : 작업을 수행하거나 값을 계산

- 하나의 함수는 한 가지 일만 하도록 작성해야 한다.

- JS 에서 function은 object 이다. 그렇기 때문에 함수를 변수에 선언, 리턴, 파라미터로 전달 가능

 function log(message) {
      console.log(message);	// Hi
 }
  
  log('Hi');

 

Default Parameters (added in ES6)

function showMessage(message, from = 'unknown') {
	console.log(`${message} by ${from}`);	// Hi by unknown
}

showMessage('Hi');

 

Rest Parameters (added in ES6)

- 배열 형태로 전달

function printAll(...args) {
  // 배열 출력 방법 1
  for(let i = 0; i < args.length; i++) {
    console.log(args[i]);
  }
    
  // 배열 출력 방법 2
  for(const arg of args) {
    console.log(arg);
  }
}
printAll('line1', 'line2', 'line3');

// 결과
// line1 
// line2
// line3

 

함수를 선언 함과 동시에 변수에 할당 가능. (함수명이 없어도 상관 없음)

const print = function (){
  console.log("print"); 
}

 

Arrow function

- 함수를 간결하게 만들 수 있다.

const simplePrint = () => console.log('simplePrint!');

const add = (a,b) => a + b;

const simpleMultiply = (a,b) => {
	return a * b;
};

 

IIFE

: Immediately Invoked Function Expression

(function hell(){
  console.log('IIFE');
})();

함수를 선언함과 동시에 호출하려면 함수의 선언을 중괄호로 묶은 후 함수를 호출하듯이 마지막에 () 를 붙이면 된다. 

 

 

 

 

드림코딩 by 엘리 의 JS 강의를 시청 후 정리한 내용입니다.

 

 

 

728x90