マスターモダンなJavaScriptは-配列が含まれ、配列の削減、マップオブジェクトとはるかに


過去数年間、JavaScript言語に多くの更新がありました.これらの更新プログラムは、あなたのコーディングスキルを向上させる場合は非常に便利です.
だからJavaScriptで追加されたいくつかの物事を見てみましょうあなたのスキルを向上させると高い給料の仕事を得るために精通している必要があります.

Note: This is the final short preview of content from Mastering Modern JavaScript book. There is a lot more covered in the actual book.


あなたがそれを逃したならば、より多くのプレビュー内容を得るために、私をチェックしてください.
それで始めましょう.

配列。プロトタイプ。含む


ES 7は、要素が配列に存在するかどうかをチェックするこの関数を追加し、true or false .
// ES5 Code
const numbers = ["one", "two", "three", "four"];

console.log(numbers.indexOf("one") > -1); // true
console.log(numbers.indexOf("five") > -1); // false
配列を使用した同じコードincludes メソッドは次のように記述できます:
// ES7 Code
const numbers = ["one", "two", "three", "four"];

console.log(numbers.includes("one")); // true
console.log(numbers.includes("five")); // false
したがって、配列の使用includes メソッドは、コードを短くし、理解しやすいです.
The includes また、別の値と比較するときに便利です.
以下のコードを見てください.
const day = "monday";

if(day === "monday" || day === "tuesday" || day === "wednesday") {
  // do something
}
このコードはincludes 次のように簡単にできます.
const day = "monday";

if(["monday", "tuesday", "wednesday"].includes(day)) {
  // do something
}
だからincludes 配列の値をチェックするときには、かなり便利です.

配列。減らす


The Array.reduce は以下の構文を持っています:
Array.reduce(callback(accumulator, currentValue[, index[, array]])[, initialValue])
The reduce このメソッドは、配列の各要素に対して指定された還元子関数を実行します.
の出力reduce メソッドは常に単一の値です.オブジェクト、数値、文字列、配列などを指定できます.reduce 生成するメソッドですが、常に単一の値です.
仮に、配列内のすべての数値の合計を見つけたい場合は、そのためのreduceメソッドを使用できます.
const numbers = [1, 2, 3, 4, 5];

const sum = numbers.reduce(function(accumulator, number) { 
 return accumulator + number;
}, 0); 

console.log(sum); // 15
The reduce メソッドコールバック関数accumulator , number , index and array 値として.
上のコードではaccumulator and number .
The accumulator は初期値を識別するために与えられた名前です.
The accumulatorinitialValue 配列で使用する.The initialValue 返り値reduce メソッド.
The number コールバック関数の2番目のパラメータは、ループの反復処理中に配列要素を格納します.
上のコードでは、0 としてinitialValue のためにaccumulator .
コールバック関数が初めて実行したとき、accumulator + number0 + 1 = 1 そして、我々は値を返しています1 .
次回はコールバック関数が実行されます.accumulator + number1 + 2 = 3 ( 1 最後の反復で返される前の値は、ここにあります
and 2 が配列の次の要素です).
そして、次回のコールバック関数が実行されると、accumulator + number3 + 3 = 6 (最初の3は最後の繰り返しと次の値で返される前の値です3 が配列の次の要素であり、numbers 配列は反復されません.
だからaccumulator は静的変数と同じように最後の操作の値を保持します.
上のコードでinitialValue of 0 配列のすべての要素が整数であるため、必須ではありません.
その他の有用な例reduce あなたがその本を見つける方法.

マップ

Map ES 6でキー値ペアを保持する新しい型のオブジェクトです.
次のようにして作成します.
const map = new Map();
マップに値を追加するにはset メソッド.
const user1 = { name: 'David', age: 30 };
const user2 = { name: 'Mike', age: 40 };

const map = new Map();

map.set('user1', user1);
map.set('user2', user2);
また、配列のような構文を使用してマップに値を追加することもできます.したがって、上記のコードは次のように記述できます:
const user1 = { name: 'David', age: 30 };
const user2 = { name: 'Mike', age: 40 };

const map = new Map([['user1', user1], ['user2', user2]]);
マップを印刷しようとすると、マップ型のオブジェクトが得られます.
console.log(map); // [object Map] { ... }
しかし、我々はfor...of マップを反復するループ.
for(element of map) {
 console.log(element);
}

/* output
['user1', { name: 'David', age: 30 }]
['user2', { name: 'Mike', age: 40 }]
*/
マップから特定の要素を得るにはget 方法Map .
console.log(map.get('user1')); // { name: 'David', age: 30 }
console.log(map.get('user2')); // { name: 'Mike', age: 40 }
他の有用なメソッドを見つけることができますMap この本で.

A very popular but not so easy programming challenge related to Map is frequently asked in the first round of coding interview to filter out candidates which you will find in the book with the explanation of code.


閉鎖点


The Mastering Modern JavaScript 本は、あなたが現代のJavaScript技術の専門家になるために知っている必要があるすべてをカバーします.
あなたはENEXTのそれぞれの新しいリリースで最新の情報を保証されます.
ワンタイム購入では、ENENESのそれぞれの新しいリリースのための無料の本の更新コピーを受信します.
この本は、反応を学習するための前提条件であり、現代のJavascriptの専門家になるために不可欠であり、反応でより良いすべての概念が含まれています.
これは、必要な唯一のガイドは、任意のJavaScriptに直面する/反応のインタビューは、ES 6 +機能はインタビューをクラックするものを知っている必要があります.
最後の数時間のみ本のために、この限られた時間の43 %の割引で残っている.だから今それをつかむ.
この本のために再びそのような巨大な割引はありません.
下のリンクをクリックして本のコピーを取得します.
Mastering Modern JavaScript
ハッピーラーニング!
私の毎週のニュースレターを取得することを忘れないでください驚くべきヒント、トリック、および記事を直接受信トレイにhere .