ノートを読む：ES6の深い理解（10）

第10章改善された配列機能

　　ES5に基づいて、ES6標準はアレイを改善し続け、アレイに多くの新しい機能を追加します。例：配列を作成する新しい方法、いくつかの実用的で便利な方法、および型付き配列を作成する機能（型付き配列）。この章では、これらの新機能を1つずつ説明します。

セクション1アレイの作成

　　1.配列を作成する従来の方法。

　　ES6以前は、配列を作成する方法は2つありました。1つはArrayコンストラクターを呼び出す方法で、もう1つは配列の自己フェース値構文を使用する方法でした。Arrayコンストラクターを使用して配列を作成する場合、奇妙な動作が発生することがあるためです（文字列番号が渡される場合など）。そのため、Array.of（）メソッドとArray.from（）メソッドが追加されました。

　　2. Array.Of（）は配列を作成します

　　Array.of（）を使用して配列を作成するには、配列に含める値を渡すだけで済みます。例えば：

  let items = Array.of(1,2);
  console.log(items.length); //2
  console.log(items[0]); //1
  console.log(items[1]); //2
  
  
  let items = Array.of(2);
  console.log(items.length); //1
  console.log(items[0]); //2


 let items = Array.of("2");
 console.log(items.length);//1
 console.log(items[0]);//"2"

　　3. Array.from（）は配列を作成します

　　Array.from（）は通常、累積された配列オブジェクト（引数など）と反復可能なオブジェクトを配列に変換するために使用されます。反復可能なオブジェクトまたは配列のようなオブジェクトを最初のパラメーターとして受け入れ、最後に配列を返します。例えば：

  function makeArray(arrayLike)
  {
      var result = [];
  
      for (var i=0, len=arrayLike.length; i<len; i++)
      {
          result.push(arrayLike[i]);
      }
  
     return result;
 }
 
 function doSomething() 
 {
     var args = makeArray(arguments);
 }

セクション2すべての配列に追加された新しいメソッド

　　1. find（）メソッドとfindIndex（）メソッド。

　　find（）メソッドとfindIndex（）メソッドは、指定されたパラメーターを渡し、この条件を満たす配列内の要素と要素の位置のインデックスをそれぞれ返します。例えば：

 let numbers = [25,30,35,40,45];
 
 console.log(numbers.find(n => n>33)); //35
 console.log(numbers.findIndex(n => n>33)); //2

　　2. fill（）メソッド

　　fill（）メソッドは、1つ以上の要素を指定された値で埋めることができます。値が渡されると、fill（）メソッドは配列内のすべての値をこの値で上書きします。特定の1つまたは特定の部分の値のみを変更する場合は、開始インデックスと終了インデックスの除外（終了インデックスの現在の値を含まない）の2つのパラメーターを渡すことができます。例えば：

  let numbers = [1,2,3,4];
  numbers.fill(1);
  
  console.log(numbers.toString()); // 1,1,1,1
  
  let numbers = [1,2,3,4];
  numbers.fill(1,2);
  
  console.log(numbers.toString()); //1,2,1,1
 
 numbers.fill(0,1,3);
 
 console.log(numbers.toString()); // 1,0,0,1

　　上記の例では、fill（1,2）の1は塗りつぶされる要素であり、2は塗りつぶしの開始位置のインデックスです。これは、終了インデックスの番号がないため、デフォルト値は最後までです。データの要素、つまりnumbers.lengthであるため、numnbers配列の最後の2つの要素は1で埋められます。fill（0,1,3）では、入力される要素は0、開始位置のインデックスは1、終了位置のインデックスは3であるため、要素0は配列要素にインデックス1と2を入力します。。

　　3. copyWidth（）メソッド

　　copyWith（）メソッドはfill（）メソッドに似ていますが、配列から要素の値をコピーします。このメソッドを呼び出すには、2つのパラメーターを渡す必要があります。1つはメソッドが値の入力を開始する位置であり、もう1つはメソッドによってコピーされた値のインデックス位置です。例えば：

 let numbers = [1,2,3,4];
 numbers.copyWith(2,0);
 console.log(numbers.toString()); //1,2,1,2

　　3番目のパラメーターがメソッドに渡された場合、それは値のコピーを停止する位置を意味します（ただし、このパラメーターには終了インデックスが含まれていません）。例えば：

 let numbers = [1,2,3,4];
 numbers.copyWith(2,0);
 console.log(numbers.toString()); //1,2,1,2
 
 let numbers = [1,2,3,4];
 numbers.copyWith(2,0,1);
 console.log(numbers.toString()); //1,2,1,4

セクション3トレーニングアレイ

　　1.ステレオタイプ化された配列とは何ですか？

　　　　いわゆる固定配列とは、任意の数値をデジタルビットを含む配列に変換することを指します。これは、数値データを処理するために使用される特別な配列であり、JavaScriptに高速のビット演算を提供できます。

　　2.対応する概念

　　　　普段はあまり使わないので、困ったときに振り返ることができます。

　　　　1）Web GL：Webグラフィックライブラリ、3Dグラフィックプロトコルまたはグラフィック標準。

　　　　2）ステレオタイプ化された配列は、次の8つの異なる数値タイプの格納と操作をサポートします。

　　　　　　符号付き8ビット整数（int8）

　　　　　　符号なし8ビット整数（uint8）

　　　　　　符号付き16ビット整数（int16）

　　　　　　符号なし16ビット整数（uint16）

　　　　　　符号付き32ビット整数（int32）

　　　　　　符号なし32ビット整数（uint32）

　　　　　　32ビット浮動小数点数（float32）

　　　　　　64ビット浮動小数点数（float64）

　　　　3）配列バッファ：特定のバイト数を含むことができるメモリアドレス。ArrayBufferコンストラクターを使用して配列バッファーを作成できます。例えば：

1 let buffer = new ArrayBuffer(10); //分配10字节

　　　　4）ビューは、メモリを操作するために使用されるインターフェイスです。DataViewタイプは、8つの数値データタイプすべてをサポートする一般的な配列バッファービューです。

セクション4ステレオタイプ化された配列と通常の配列の類似点

　　1.一般的な方法

　　　　配列内のほとんどのメソッドは、ステレオタイプ化された配列で使用できます。

　　2.同じイテレータ

　　　　スプレッド演算子は、反復可能なオブジェクトを通常の配列に変換できます。また、ステレオタイプ化された配列を通常の配列に変換することもできます。

　　3. of（）、from（）メソッド

　　　　固定配列は、通常の配列と同様にof（）メソッドとfrom（）メソッドを使用することもできますが、返される配列も固定配列です。

セクション5ステレオタイプ配列と通常の配列の違い

　　1.行動の違い

　　　　通常の配列を操作する場合、配列のサイズは変更できますが、固定配列は常に同じサイズを維持します。

　　2.欠落しているメソッド

　　　　これらのメソッドは通常の配列でのみ使用でき、固定配列では使用できません。なぜそれについて考えますか？これらのメソッドは基本的に配列のサイズを変更するためのものであり、先ほど述べた最初の項目では、ステレオタイプ化された配列は常に同じサイズを維持するため、これらのメソッドはステレオタイプ化された配列には含まれません。これらのメソッドをリストします。

　　　　concat（）

　　　　ポップ（）

　　　　押す（）

　　　　shift（）

　　　　unshift（）

　　　　splice（）

　　　　上記のメソッドでは、concat（）に加えて、他のいくつかのメソッドが配列のサイズを変更できることがわかります。

　　3.追加の方法

　　　　ステレオタイプ化された配列には2つのメソッドがありますが、通常の配列にはありません。set（）とsubarray（）です。以下は個別に紹介されています。

　　　　1）set（）：他の配列を既存のトレーニング配列にコピーします。set（）メソッドは2つのパラメーターを受け入れます。1つは配列（固定配列または通常の配列）です。もう1つはオプションのオフセットです。つまり、データの挿入を開始する位置です。何も渡されない場合は、デフォルトのオフセットです。 0です。有効なデータは、パラメーターとして渡された配列からターゲット配列にコピーされます。例えば：

 let ints = new Int16Array(4);
 
 ints.set([25,50]);
 ints.set([75,100]);
 
 console.log(ints.toString()); //25,50,75,100

　　　　2）subarray（）：既存のステレオタイプ化された配列の一部を新しいステレオタイプ化された配列として抽出します。2つのパラメーターを受け入れます。1つはオプションの開始位置、もう1つはオプションの終了位置（現在の位置データを含まない）であり、最後に新しいトレーニング配列を返します。これらの2つのパラメーターを省略して、新しいトレーニング配列のクローンを作成することもできます。例えば：

 let ints = new Int16Array([25, 50, 75, 100]);
     subints1 = ints.subarray();
     subints2 = ints.subarray(2);
     subints3 = ints.subarray(1, 3);
 
 console.log(subints1.toString()); // 25, 50, 75, 100
 console.log(subints2.toString()); // 75, 100
 console.log(subints1.toString()); // 50, 75

（このセクションの終わり）

ノートを読む：ES6の深い理解（10）

第10章改善された配列機能

おすすめ