TIL 33- Scope, Closure

7006 ワード
Devlog テキストリンク
¥displayName()かreturn displayNameか李娜の蔡
▼displayName()(displayName関数を実行)→親関数が正常に動作
▼return displayName;(displayName関数に戻る)→下に変数を設定してから正常に動作する
LexicalScopting(語彙範囲)
function init() {
      var name = "Mozilla"; // name은 init에 의해 생성된 지역 변수이다.
      function displayName() { // displayName() 은 내부 함수이며, 클로저다.
        alert(name); // 부모 함수에서 선언된 변수를 사용한다.
      }
      displayName();
    }

// init() 하면 실행됨
コンソールで検索
f displayName() {
 alert(name);
 }
このようにclosure関数に隠されている内容はめったにありません
コンソールでの検索2479142または2479142
✅ displayName이 closure 함수라서 숨겨져 있는 것임.

☑️ 여기서 주의할 점은 displayName() 내부엔 자신만의 지역 변수가 없다는 점이다. 
함수 내부에서 외부 함수의 변수에 접근할 수 있기 때문에 displayName() 역시 부모 함수 init()에서 선언된 변수 name에 접근할 수 있다. 
만약 displayName()가 자신만의 name변수를 가지고 있었다면, name대신 this.name을 사용했을 것이다.
▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼\

Closure 1
function makeFunc() {
      var name = "Mozilla";
      function displayName() {
        alert(name);
      }
      return displayName;
    }

// let 변수 = makeFunc();
// 변수(); 까지 해줘야 makeFunc 정상실행
コンソールで検索
f displayName() {
 alert(name);
 }
このようにclosure関数に隠されている内容はめったにありません
コンソールでの検索2479142または2479142
zundisplayNameはclosure関数なので非表示です.
正常に動作するには、makeFunc()関数で変数を設定する必要があります.
次のように書きます.makeFunc() displayName()→変数()を使用して、Mozilla表示のdisplayName()をalertポップアップで実行できます.
Closure 2
function makeAdder(x) {
      var y = 1;
      return function(z) {
        y = 100;
        return x + y + z;
      };
    }
let add2= makeAdder(2)         

console.log(add2(3))         


add2(3) -> makeAdder(2) 안의 함수에 인자 3을 넣은 것이다. (add2는 클로저이다)
즉, makeAdder(2)의 x,y 값을 그대로 가지고, 
makeAdder함수가 return하는 function(z) 에 인자 3을 넣는다.
따라서, add2(3)은 2 + 100 + 3 = 105 가 된다.
Leetcode461. ハミング距離
Tailwind CSS を「DRY」に保つ