関数型JavaScript

評価

->コード計算による値の作成

一級

->값.
->변수.
->関数に使用できる인자.
->関数に使用できる결과.

const a = 10;
const add10 = a => a + 10;
const r = add10(a); // 20

いちじかんすう

->関数は값で処理できます.
->組み合わせと抽象化のツール.

const add5 = a => a + 5;
console.log(add5); // a => a + 5 (f)
console.log(add5(5)); // 10;

const f1 = () => () => 1;
console.log(f1()); // () => 1 (f)
const f2 = f1();
console.log(f2); // () => 1 (f)
console.log(f2()); // 1

高次関数

->値としての関数
1)パラメータとして関数を実行する関数(callback)を受信する
2)関数を作成して返す関数(curry)
->キャビネットを作成して戻す関数

// callback exam
const apply1 = f => f(1);
const add2 = a => a + 2;
console.log(apply1(add2)); // 3

const times = (f, n) => {
 for(let i=0; i<n; i++) {
   f(i);
 }
};

times(console.log, 3); // 0, 1, 2
times(a => console.log(a + 10), 3); // 10, 11, 12

// curry exam
const addMaker = a => b => a + b;
const add10 = addMaker(10);
console.log(add10);// b => 10 + b; (f)
console.log(add10(5); // 15

かわいい(ES 6)

リスト巡回

for i++

for of

const list = [1, 2, 3];

// es5
for(var i=0; i<list.length; i++_ {
  console.log(list[i]);
}

// es6
for(let el of list) {
  console.log(el);
}

Array & Set & Map

const arr = [1, 2, 3];
for(const a of arr) console.log(a);

const set = new Set([1, 2, 3]);
for(const a of set) console.log(a);

const map = new Map(['a',1], ['b',2], ['c',3]]);
for(const a of map) console.log(a);

for...ofはどんな原理に戻りますか?
キーワードはSymbol.iterator

const arr = [1, 2, 3];
arr[Symbol.iterator] = null;
for(const a of arr) console.log(a);
// Uncaught TypeError
// arr is not iterable

上記はSymbol.iteratorをnullとし、重複文でエラーが発生しました.これはSet、Mapと同じです.
このことから,for...of反復は上記の属性に関係していることが分かる.

アプレット/アプレットプロトコル

ウィジェット:値[Symbol.iterator]()、ウィジェットを返します

イテレーション:値{value, done }、next()オブジェクトを返します.

ウィジェットプロトコル:ウィジェットをfor...of、展開演算子などと一緒に動作する約定

.

arr[Symbol.iterator]; // values() { [native code] }
let iterator = arr[Symbol.iterator]();
iterator.next(); // {value: 1, done: false}
iterator.next(); // {value: 2, done: false}
iterator.next(); // {value: 2, done: false}
iterator.next(); // {value: undefined, done: true}

上で構成部品のイテレーションを実行し、それによって返されるイテレーションnext()が呼び出されると、値とdone値を持つオブジェクトが返されます.
また、これらの値は配列内の要素であり、すべての要素をインポートするとdoneはtrueになります.for...ofまたは展開文では、原理はこうである.
1.arr[Symbor.iterator]()を実行してイテレーションオブジェクトを返す
2.next()の方法で受け取った値を要素値に渡す
3.doneがtrueの場合、重複文を終了
実際には、次のコードを記述すると、繰り返し文の実行速度が想像以上に遅くなります.

let arr = [1, 2, 3];
let iterator = arr[Symbol.itorator]();
iterator.next();
iterator.next();

for(const a of iterator) {
  console.log(a); // 3이라는 요소 한번만 찍힌다.
}

for...ofゲート呼び出しウィジェットnext()は2回前に実行され、実際には繰り返し文に3という数字を1回印刷するだけです.

カスタムかわいい

const iterable = {
  [Symbol.iterator]() {
    let i = 3;
    return {
      next() {
        return i == 0 ? {done: true} : { value: i-- , done: false }
      },
      [Symbol.iterator]() { return this; }
    }
  }
};

let iter = iterable[Symbol.iterator]();
console.log(iter.next()); 
console.log(iter.next());
console.log(iter.next());
console.log(iter.next());

このように、ユーザ定義のかわいいオブジェクトを作成する際には、[Symbol.iterator]を作成することを考慮する必要がある.
また、返される小さなラベルにもこのコンポーネントのイテレーションメソッドがあるはずです.
このプロトコルは、Webブラウザ環境、オープンライブラリなど多くの場所で使用されています.
展開演算子

const a = [1, 2];
a[Symbol.iterator] = null;
console.log(...a); // error

展開演算子もイテレーションオブジェクトを使用します.
... 正直、私は今100%理解できません.しかし、私はもっと豊かな体験をして、再びこの概念を見たとき、もっと多くのものを見せるために、私は成長して、再び勉強します.