[JS] default parameters, first-class and higher-order functions

hoje15v·2021년 12월 14일


목록 보기

Default Parameters

Default Parameters는 어떠한 형태로든 설정이 가능하다.

const bookings = [];
const createBooking = function (
  numPassengers = 1,
  price = 199 * numPassengers
) {
  // ES5
  //   numPassengers = numPassengers || 1;
  //   price = price || 199;

  const booking = {

createBooking('LH123', 2, 800); //{flightNum: 'LH123', numPassengers: 2, price: 800}
createBooking('LH123', 2); //{flightNum: 'LH123', numPassengers: 2, price: 398}
createBooking('LH123', 5); //{flightNum: 'LH123', numPassengers: 5, price: 995}
createBooking('LH123', undefined, 1000); //{flightNum: 'LH123', numPassengers: 1, price: 1000

How Passing Arguments Works : Value vs Reference

const flight = 'LH234';
const jonas = {
  name: 'jonas',
  passport: 234234234,
const checkIn = function (flightNum, passenger) {
  flightNum = 'LH999';
  passenger.name = 'Mr. ' + passenger.name;

  if (passenger.passport === 234234234) {
    alert('Check in');
  } else {
    alert('Wrong passport!');

checkIn(flight, jonas); 
console.log(flight); //LH234 -primitive type 
console.log(jonas); // {name: 'Mr. jonas', passport: 234234234}  - reference type

primitive type -> flightNum(parameter)는 copy of that original value. (not the original value of the flight variable) 그렇기에 flightNum으로 flight의 값을 바꾸는 것은 불가능. 전혀 다른 value임.

reference type -> as we are manipulating the passenger object, it is exactly the same as manipulating the Jonas object. They both are the same object in the memory heap.

요약 : primitive type의 값을 함수에 전달하는 것은 그 값의 복사본을 전달하는 것과 같다. reference type의 값을 함수에 전달하는 것은 객체의 복사본을 전달하는 것과 같다. 그렇기에 값을 수정하게 되면 기존의 객체 또한 수정이 된다.

Passing a primitive type to a function is really just the same as creating a copy like this, outside of the function. value is simply copied.
Passing a reference type is really just like copying an object. So whatever we change in a copy will also happen in the original.

const newPassport = function (person) {
  person.passport = Math.trunc(Math.random() * 10000000);

newPassport(jonas); // passport 정보 바뀜
checkIn(flight, jonas); // 마찬가지. issue 발생 => two functions manipulating the same object

JavaScript does not have passing by reference! Only passing by value.
For objects, we do in fact pass in a reference. So the memory address of the object. However, that reference itself is still a value. It's simply a value that contains a memory address. So we pass a reference to the function, but we do not pass by reference.

passing by reference: you can pass a reference to any value, instead of the value itself. you could pass a reference to the value of five, and then original value outside of the function would be changed.

First-Class and Higher-Order Functions

First-Class vs Higher-order Functions

First-class Functions

  • JS treats functions as first-class citizens.
  • This means that functions are simply values.
  • Functions are just another 'type' of object.

Object가 value이기 때문에 function또한 value인 것!

  • Store functions in variable or properties
const add = (a,b) => a + b;
const counter = {
		value : 23,
        inc : function(){this.value++;}
  • Pass functions as arguments to OTHER functions
const greet = ()=> console.log('Hey Jonas');
btnClose.addEventListener('click', greet);
  • Return functions FROM functions
  • Call methods on functions
    Object가 methods가 있듯 function 또한 method가 있다. ex)bind

Higher-Order functions

  • A function that receives another functions as an argument, that returns a new function, or both.
  • This is only possible because of first-class functions.
  • Functions that receives another function
const greet = () => console.log('Hey Jonas');
btnClose.addEventListener('click', greet);

addEventListener : Higher-order function
greet : callback function

  • Function that returns new function
function count(){
	let founter = 0;
    return function(){

count : Higher-order function

유의사항) First-class function과 Higher-order function의 의미는 약간 다르다. First-class function은 (이론적)개념. 실전용이 아님. just a feature that a programming language either has or does not have which implies all functions are values
Higher-order function은 practice. 실전에서 쓰이는 함수. language가 first-class function을 support하므로!

꾸준히 성장하기🦋 https://hyodduru.tistory.com/ 로 블로그 옮겼습니다

0개의 댓글