JavaScriptの4/30：マップ配列、フィルタおよび使用量を削減

JavaScript30効果を達成するために、純粋なJavaScriptで人々を助けるために設計されたウェス・ボスが導入された30日間の挑戦、あなたはJSの面で高速な初心者が洗練されたい場合は、それを試してみます。あなたは要約のシリーズの最初であることがわかりさて、私は30個の質問を終了したときに知っていない、いない、この法律のフラグを誓いました。題した第四問ブック。

結果を実現

このセクション）フィルタを含むJS配列（のためのいくつかの一般的に使用される方法を記載し、マップ（）、ソート（）、（低減する）、及びコンソールパネルで結果を見ます。文書には、配列の二組を与えられている場合は：

最初のグループ：死の発明者の名前を含む配列、姓、誕生日と日付

const inventors = [
      { first: 'Albert', last: 'Einstein', year: 1879, passed: 1955 },
       ......
      { first: 'Hanna', last: 'Hammarström', year: 1829, passed: 1909 }
    ];

第二セット：人々の列は、コンマの缶詰で区切られた名前のセットが含まれています。

 const people = ['Beck, Glenn', ...... , 'Blake, William'];

次のように内容は次のとおりです。

16世紀に生まれた発明のスクリーニング;
配列として、自分の名前と姓をリストアップ。
彼らの誕生日によると降順。
すべての計算発明者の合計は十代の若者が住んでいました。
自分の年齢に応じてソートされました。
ウェブサイトに（https://en.wikipedia.org/wiki/Category:Boulevards_in_Paris）与えられたリストを使用すると、パリアベニュー「デ・バイトを含んでいます。
姓で並べ替え。
配列の各タイプの数の統計。

知識ポイント

フィルタ（）

フィルタリング、適格なすべての要素のスクリーニング、例えば、最初の質問に新しいアレイを形成するために真のリターンである場合：

    function bornyear(inventor) {
      return inventor.year >= 1500 && inventor.year < 1600;
    }
    var fifteen = inventors.filter(bornyear);
    console.table(fifteen);
    // 可简化为
    const fifteen = inventors.filter(inventor => (inventor.year >= 1500 && inventor.year < 1600));

地図（）

マッピング元の配列処理の各要素の動作、および新しい配列を返します。例えば、2番目の質問に：

    const fullnames = inventors.map(inventor => `${inventor.first} ${inventor.last}`);
    console.table(fullnames);

ソート（）

操作ソート、デフォルトのソート順は、10 2前とUnicodeコードポイントの文字列、および文字の前に、大文字、大文字小文字の前の数です。比較関数は、戻り値は、次の形式にソートされる機能を呼び出す配列に従って、使用することができます。

    function compare(a, b) {
      if (a < b) {
        // 按某种排序标准进行比较, a 小于 b
        return -1;
      }
      if (a > b) {
        return 1;
      }
      // a must be equal to b
      return 0;
    }

代わりに、列の数は、比較関数は、単に昇順であろう配列の関数として、Bに低減することができ、比較します。

    function compareNumbers(a, b) {
      return a - b;
    }

3番目の質問については、我々は比較的単純な足し算と引き算を使用することができます。

    const birthdate = inventors.sort((inventora, inventorb) => (inventorb.year - inventora.year));
    console.table(birthdate)

第七質問、あなたはReturnキーを押しますを比較する必要があります。

    const sortName = inventors.sort((a, b) => {
      return (a.last > b.last) ? 1 : -1;
    })
    console.table(sortName);

削減（）

操作2つのパラメータの合計をマージし、最初のものは、アキュムレータ、戻りのアレイを介して蓄積戻り値として理解することができる機能であり、第二は、初期値です。いいえ初期値場合、配列内の最初の要素が使用されます。第四の質問への、例えば：

   const totalyears = inventors.reduce((total, inventor) => { return total + (inventor.passed - inventor.year); }, 0);
    console.log(totalyears);

同じQ8を話すために使用される（）メソッドを減らします：

    const sumup = data.reduce(function (obj, item) {
      if (!obj[item]) {
        obj[item] = 0;
      }
      obj[item]++;
      return obj;
    }, {});

    console.log(sumup);

特に、コールバック関数の最初の引数は、ストレージ・アイテムの各タイプの数の標的であってもよいです。オブジェクトについて。深い理解のために、参照ルアンYifengのブログを。

マップ（）及びフィルタ（）結合

で要求の対象質問6、参照サイトを含む「デ」バイトのパリアベニュー選択;好適な捕捉要素は、ノードに対応する、配列に変換し、再利用.INCLUDES（）メソッドを得ることができます。

    const category = document.querySelector('.mw-category');
    const links = Array.from(category.querySelectorAll('a'));
    const de = links.map(link => link.textContent).filter(streetName => streetName.includes('de'));
    console.table(de)