JavaScript 공부 [4. 함수와 파라미터]

Function

자바스크립트의 함수 기본형태

function log(message) {
	console.log(message)
}

log('Hello') // Hello (string)
log(1234567) // 1234567 (number)

// 참고로 함수도 Object 중 하나다.
// 또한 return값이 없는 함수들은 undefined가 return되도록 설정되어있다.

TypeScript 페이지의 Playground에서 왼편에 타입스크립트로 입력하면 우측에 자바스크립트로 코드가 변환된다. 또한 잘못 입력했을경우 에러표시가 떠서 바로 수정 및 확인이 가능하다.

다만 자바스크립트에서는 파라미터값(message)을 알아서 자동으로 변환하기 때문에, 이 함수의 파라미터값으로 어떤 타입을 넣어주어야하는지 명확하게 알 수가 없다. 따라서 타입이 중요한 함수를 사용할때 자바스크립트는 난해하다.

따라서 이런 문제점을 해결하기 위해 타입스크립트 위에 타입스크립트가 등장한것이다.

Default Parameters

사용자가 파라미터값을 입력하지 않아도, Default값을 설정하여 사용할 수 있다. (add in ES6)

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

Rest Parameters

파라미터값을 ...param 형태로 전달하면, 배열형태로 전달된다.

function printAll(...args) {
	for (let i = 0; i < args.length; i++) {
    		console.log(args[i])
    	}
        
	for (const arg of args) { 		// 위의 for문과 동일한 동작을 한다!
    		console.log(arg)
    	}
        
        args.forEach((arg) => console.log(arg)) // 첫번째 for문과 동일한 동작을 한다!
}
printAll('im', 'coding', 'king')
// im
// coding
// king
// im
// coding
// king
// im
// coding
// king

Function expression

anonymous function 예시

const print = function() {
	console.log('test')
}
print() // test
const printAgain = print
printAgain() // test

단 함수는 hositing이 되기 때문에, 함수를 선언하는부분 이전에도 사용이 가능하다.
따라서 유의해야함!

Arrow Function

function 이라는 선언을 사용하지 않고 () => 를 사용하여 만드는 함수 (간편함)

const simplePrint = function () {
	console.log('simplePrint')
}
는 다음과 같이 선언할 수도 있다.
const simplePrint = () => console.log('simplePrint')

const add = (a, b) => a + b
const specialMultiply = (a, b) => {
	let c = a + b
    return c * a * b
}