一度読んであげようlodash(一)
4599 ワード
通常の開発では,配列,クラス配列,オブジェクトなどのデータ構造を複雑に処理するに違いない.lodashは、これらの難題を解決するための強力な機能を提供します.公式サイトのlodashの定義は、「一貫したインタフェース、モジュール化、高性能などを備えたJavaScriptツールライブラリ」です.ライブラリ全体が1つしか露出していません''つまりlodashオブジェクトで、jqueryの($)に似ています.また,その関数式プログラミングのスタイルは,元の配列を汚染しない.私は開発の中でずっとlodashの方法を使っていますが、システム的にlodashのAPIを読んだことがありません.いくつかの機能が実現されたとき、lodashは簡単な一言でできるかもしれません.俗説によると、仕事をよくするにはまず器を利する必要があります.そこで、システム的に勉强して、最初から最后までlodashを一度やって、勉强のノートを作るつもりです.私はlodashの公式APIとソースコードを参考にして、皆さんと一绪にこのツールボックスを详しく研究します.
4、difference(arr,[values])類似.differenceメソッドでは、新しい配列を作成し、パラメータグループに入って新しい配列を深くコピーします.配列の2番目のパラメータ配列と同じ値を削除し、新しい配列を返します.arr:入力された配列(入力が配列でない場合、結果は空の配列を返します).[values]:パラメータをフィルタします.簡単に言えば、この方法は最初の配列のサブセットまたはそれ自体を返す.*.difference([3, 2, 1], [4, 2]); *//=> [3, 1]
5、.differenceBy(arr,[values],[i teratee=.identity])は、パラメータグループのように新しい配列を深くコピーし、3番目のパラメータ(遍歴器メソッド)を使用して2番目のパラメータを演算し、処理後のパラメータを実行する新しい配列を作成する.differenceメソッド.
6、.differenceWith(arr,[values],[comparator])は類似している.differenceメソッドでは、新しい配列を作成し、入力パラメータグループを新しい配列に深くコピーし、3番目のパラメータを介して、最初の2つの入力パラメータを組み合わせて、新しい配列arrを返します.入力された配列[values]:追加のパラメータ[comparator]:演算規則
7、_.drop(arr,[n])は配列を作成し、パラメータグループを新しい配列に深くコピーし、新しい配列を最初からn要素を削除し、新しい配列を返します.arr:入力された配列n:削除する要素の数
、Array Methods( )
1、_.chunk(arr,size)
, , , 。
arr: ( ), length , ;
size: ( 1), , ; ,size=parseInt(size);
* // => [['a', 'b'], ['c', 'd']]
*
* _.chunk(['a', 'b', 'c', 'd'], 3);
* // => [['a', 'b', 'c'], ['d']]
2、_.compact(arr)
, , 。
arr: 。 , split(' ') 。
* // => [1, 2, 3]```
3、_concat(arr,[values])
, , , concat() 。
arr: 。
[values]: 。
``` * var array = [1];
* var other = _.concat(array, 2, [3], [[4]]);
*
* console.log(other);
* // => [1, 2, 3, [4]]
*
* console.log(array);
* // => [1]
4、difference(arr,[values])類似.differenceメソッドでは、新しい配列を作成し、パラメータグループに入って新しい配列を深くコピーします.配列の2番目のパラメータ配列と同じ値を削除し、新しい配列を返します.arr:入力された配列(入力が配列でない場合、結果は空の配列を返します).[values]:パラメータをフィルタします.簡単に言えば、この方法は最初の配列のサブセットまたはそれ自体を返す.*.difference([3, 2, 1], [4, 2]); *//=> [3, 1]
5、.differenceBy(arr,[values],[i teratee=.identity])は、パラメータグループのように新しい配列を深くコピーし、3番目のパラメータ(遍歴器メソッド)を使用して2番目のパラメータを演算し、処理後のパラメータを実行する新しい配列を作成する.differenceメソッド.
[values]:
[iteratee=_.identity]:
* _.differenceBy([{ 'x': 2 }, { 'x': 1 }], [{ 'x': 1 }], 'x');
* // => [{ 'x': 2 }]
* _.differenceBy([3.1, 2.2, 1.3], [4.4, 2.5], Math.floor);
* // => [3.1, 1.3]
6、.differenceWith(arr,[values],[comparator])は類似している.differenceメソッドでは、新しい配列を作成し、入力パラメータグループを新しい配列に深くコピーし、3番目のパラメータを介して、最初の2つの入力パラメータを組み合わせて、新しい配列arrを返します.入力された配列[values]:追加のパラメータ[comparator]:演算規則
* _.differenceWith(objects, [{ 'x': 1, 'y': 2 }], _.isEqual); * // => [{ 'x': 2, 'y': 1 }]
注意:differenceByと.differenceWithの違いは、The iteratee is invoked with one argument:(value).The comparator is invoked with two arguments:(arrVal, othVal). 簡単に言えば、3つ目の方法は正しいだけです.differenceByメソッドの2番目のパラメータを処理しますが.differenceWithメソッドの最初の2つのパラメータが処理されます.7、_.drop(arr,[n])は配列を作成し、パラメータグループを新しい配列に深くコピーし、新しい配列を最初からn要素を削除し、新しい配列を返します.arr:入力された配列n:削除する要素の数
* // => [2, 3]
*
* _.drop([1, 2, 3], 2);
* // => [3]
*
* _.drop([1, 2, 3], 5);
* // => []
*
* _.drop([1, 2, 3], 0);
* // => [1, 2, 3]```
8、_.dropRight(arr, [n])
_.drop , n 。
arr:
n:
``` * _.dropRight([1, 2, 3]);
* // => [1, 2]
*
* _.dropRight([1, 2, 3], 2);
* // => [1]
*
* _.dropRight([1, 2, 3], 5);
* // => []
*
* _.dropRight([1, 2, 3], 0);
* // => [1, 2, 3]```
9、_.fill(arr, value, [start], [end)
, , , , 。
arr: 。
value: 。
start: ( ), 0
end: ( ),
``` * var array = [1, 2, 3];
*
* _.fill(array, 'a');
* console.log(array);
* // => ['a', 'a', 'a']
*
* _.fill(Array(3), 2);
* // => [2, 2, 2]
*
* _.fill([4, 6, 8, 10], '*', 1, 3);
* // => [4, '*', '*', 10]```
10、_.flatten(arr)
, , , 。
arr: 。
``` * _.flatten([1, [2, [3, [4]], 5]]);
* // => [1, 2, [3, [4]], 5]```
11、_.flattenDeep(arr)
, , , 。 。
arr: 。
``` * _.flattenDeep([1, [2, [3, [4]], 5]]);
* // => [1, 2, 3, 4, 5]---+9```
12、_.flattenDepth(array, [depth=1])
, , n 。
arr: 。
depth: ( 1)。
``` * var array = [1, [2, [3, [4]], 5]];
*
* _.flattenDepth(array, 1);
* // => [1, 2, [3, [4]], 5]
*
* _.flattenDepth(array, 2);
* // => [1, 2, 3, [4], 5]。```
, ; lodash, 。