私たちはたくさんのプログラムを使います.番組には各機能を担当するものもあります.関数です.100回と1000回の同じタスクを避けるのに役立つ感謝関数を整理しましょう.

Function

関数(Function)はプログラムの最も基本的な要素であり,複数回使用可能なサブプログラムといえる.主に入力を受け入れて計算したり、特定の動作を実行したりする役割を果たします.

Function declaration

// 기본 선언 방법
function doSomething(parameter1, parameter2) {
  body ...
  return;
}

関数を宣言するときは、関数名を動詞やコマンドで記述し、一度に複数の操作を行わないように注意してください.1つの関数に1つの動作をさせます.

// 함수 호출 방법
doSomething(parameter1, parameter2);

関数を呼び出すには、関数名に()を付けることができます.この場合、()スキームに必要なパラメータを加えることができる.パラメータがなくても、()は関数名の横にくっつく必要があります.

// 간단한 예시
function log(message) {
  console.log(message);
}
log("Hello@"); // Hello@

Parameters

パラメータを使用するときに注意が必要です.パラメータを渡す場合、valueを直接渡す場合と、referenceを渡す場合があるからである.違いを覚えたほうがいいです.

function changeName(obj) {
  obj.name = "coder";
}
const cheoljin = { name: "cheoljin" };
changeName(cheoljin);
console.log(cheoljin); // {name: "coder"}

上の状況を見てください.cheoljinの場合、constで値を変更できないと宣言されていることがわかります.ただし、changeName(cheoljin)を運転すると、名称はcoderに変更される.constと宣言されたcheoljin変数のうち、{name: "cheoljin"}というobjectの値は直接割り当てられたものではなく、referenceの値が割り当てられたものである.つまり、referenceは変更できませんが、referenceが到着したメモリの内容は変更できます.したがって、constを使用しても内容が変化する可能性がある.objectの詳細については、後ほど整理します.
もし、上記の場合、cheoljinの割当値が"cheoljin"だったら、どうなりますか?

function changeName(obj) {
  obj = "coder";
}
const jini = "cheoljin";
changeName(jini);
console.log(jini); // cheoljin

値段は変わらない.constと宣言されたvalueは変更できないからです.
Default parameter

// 매개변수를 입력하지 않은 경우에 출력될 값을 미리 정할 수 있음.
function showMessage(message, from = "unknown") {
  console.log(`${message} by ${from}`);
}
showMessage("Hi"); // Hi by unknown

Rest parameter

// 정해지지 않은 수의 인자를 배열로 받을 수 있음.
function printAll(...args) {
  for (let i = 0; i < args.length; i++) {
    console.log(args[i]);
  }
}
printAll("dream", "coding", "ellie");

Local scope

関数(block)内で宣言された変数には、関数内でのみアクセスできます.

let globalMessage = "global"; // global variable
function printMessage() {
  let message = "hello";
  console.log(message); // local variable  
  console.log(globalMessage); 
  // return undefined <- skip!
}
printMessage();
console.log(message);

上で関数printMessage()を実行している場合、console.log(message)の場合、領域変数messageは同じ関数内で近似しているため、出力は正常です.また、console.log(globalMessage)の場合、グローバル変数globalMessageに近いため、出力は正常である.
ただし、最後のconsole.log(message)ではblockしかないため、地域変数messageにアクセスできないため、エラーメッセージが出力される.

Return

関数を使用する場合は、returnを使用できます.console.log()の場合、コンソールウィンドウでのみ出力できます.実際の戻り値はreturnを使用する必要があります.returnのない関数であれば、return undefinedは省略されていることを覚えておいてください.

Early return, early exit!

returnをすばやく覚え、exitをすばやく覚えます.

// bad example
function upgradeUser(user) {
  if (user.point > 10) {
    // 길고 긴 로직들...
  }
}

上記のように,記述コードの可読性は劣る.条件を満たさない場合に論理を構成する必要はない.

// good example
function upgradeUser(user) {
  if (user.point <= 10) {
    return;
  }
  // 본격적으로 실행하고 싶은 로직들...
}

上記のように、適用されない条件では、returnを介して速やかに終了し、実際に適用される値に対して論理を記述することができる.その結果、同じ動作を実行しても可読性の観点から以下が有利である.

Function expression

関数は基本的にstatementと宣言できますが、式として表すこともできます.
関数宣言と式の違いは、生成された時点です.関数宣言については、アップグレードにより、JavaScriptの動作がその位置に到達したときに関数式が生成される.
💡 First-class function!

functions are treated like any other variable

can be assigned as a value to variable

can be passed as an argument to other functions.

can be returned by another function

上記の例に示すように、関数式は変数に割り当てられ、他の関数のパラメータとして使用されてもよいし、他の関数のreturnであってもよい.一級関数、一級オブジェクトに疑問がある場合は、対応するMDNをよく読んでください.

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

printという変数に匿名関数が割り当てられています.通常、関数式を使用する場合は匿名関数が使用されます.このとき、変数printは、匿名関数のデータを直接入力するのではなく、referenceを割り当てる.

const printAgain = print;
printAgain();

printAgainという変数にprintを割り当てると、同じ結果値を実行する関数として、同じ匿名関数のreferenceを割り当てることができる.

Callback function

function randomQuiz(answer, printYes, printNo) {
  if (answer === "love you") {
    printYes();
  } else {
    printNo();
  }
}
// anonymous function
const printYes = function () {
  console.log("yes");
};

// named function
// better debugging in debugger's stack traces
// recursions
const printNo = function print() {
  console.log("no!");
};
randomQuiz("wrong", printYes, printNo);
randomQuiz("love you", printYes, printNo);

関数式を使用すると、上記のように関数のパラメータとして関数を受信できます.上記の関数式では、匿名関数ではなく関数名を個別に記入する場合があります.これは、デバッグ時に関数名を記録しやすくし、再帰関数を使用する必要がある場合に使用します.
再帰関数とは、関数が自分の状況を再参照することを意味します.returnを適切に設定して、callスタックがいっぱいになっていることを確認してください.

Arrow function(ES6 ~ )

これは私の大好きな矢印関数です.矢印関数は常に匿名関数を使用しており、functionなどのキーワードを書く必要がないので便利です.

// 이렇게 생겼던 코드가
const simplePrint = function() {
  console.log("simplePrint");
};

// 이렇게 간단하게 바뀐다.
const simplePrint = () => console.log("simplePrint");

単純な例

// Fun quiz time❤️
// function calculate(command, a, b)
// command: ( add, substract, divide, multiply, remainder)

function calculate(command, a, b) {
  switch (command) {
    case "add":
      return a + b;
      break;
    case "substract":
      return a - b;
      break;
    case "divide":
      return a / b;
      break;
    case "multiply":
      return a * b;
      break;
    case "remainder":
      return a % b;
      break;
    default:
      return "invalid command";
  }
}
console.log(calculate("add", 3, 2));

commandをパラメータとして,簡単な計算が可能な関数を作成した.
参考資料:
エリー