JavaScript開発者として知らなければならない配列メソッド

この記事は私のフォローアップです
配列はJavaScriptの重要な部分です.複数の要素を一つの変数に格納します.あなたは100の連絡先を想像し、それぞれの変数を作成する非常にハードされます.配列を使用すると、単一の変数にコンタクトを格納できます.
配列には、組み込みのメソッドが付属しています.これにより、データを変異してデータを変換します.
この記事では、10の配列メソッドとそのユースケースを見ていきます.

1 . filter ()
高次の関数を聞いたことがありますか?基本的に、高次関数は、パラメータとして関数を取るか、フィルタメソッドのように関数として関数を返すメソッドです.フィルタメソッドは、文字列を通して文字列をフィルター処理し、引数としての条件(関数)の出力ベースを返します.

const employees = [
  {
    id: '001',
    name: 'Siradji',
    isPermanent: true,
  },
  {
    id: '002',
    name: 'Lydia',
    isPermanent: false,
  },
];

// Filters through employees array and return permanent employees.

const permEmployees = employees.filter(
  (employee) => employee.isPermanent === true
);
console.log(permEmployees);
//  [{
//     id: '001',
//     name: 'Siradji',
//     isPermanent: true,
//   }]

2 . push ()
これはおそらく最も使用される配列メソッドの一つです.pushメソッドは、引数として使用する要素を既存の配列の末尾に挿入します.

const fruits = ['banana', 'mango', 'apple', 'kiwi'];

fruits.push('orange');

console.log(fruits);

// [ "bananan", "mango", "apple", "kiwi", "orange"]

3 . join ()
このメソッドは、コンマまたは文字列で区切られた配列内のすべての要素を結合して文字列を作成して返します.

const names = ['Ola', 'james', 'jackie', 'nina'];
const joinAll = names.join('');

console.log(joinAll);
// Olajamesjackienina

const dashSeperator = names.join('-');

console.log(dashSeperator);
// Ola-james-jackie-nina

4 . map ()
高次関数を覚えていますか?これは引数としても機能を受け取ります.これは引数の結果から新しい配列を作成します.

const news = [
  {
    title: 'finally, tom has managed to eat jerry mouse',
    publishedAt: 10,
    isAHit: true,
  },
  {
    title: 'UFO spotted in califionia',
    publishedAt: 11,
    isAHit: true,
  },
]
const newsTitle = news.map( news => news.title)

console.log(newsTitle)
// ["finally, tom has managed to eat jerry mouse",
// "UFO spotted in califionia"]

];

5 . splice ()
このメソッドは既存の配列の要素を削除または置換します.このメソッドは、元の配列を展開します.

//  replace an element
const cars = ['audi', 'volvo', 'benz', 'honda'];

//  @params start index, delete count, new dara
cars.splice(1, 0, 'BMW');

console.log(cars);
// ["audi", "volvo", "BMW", "benze", "honda"]

6 . concat ()
JavaScriptコミュニティの皆さんは、連結が何であるかを知っています.このメソッドは自明です.名前から、2つの配列を1つに連結します.このメソッドは最初の配列で呼び出され、2番目の配列を引数として受け取ります.

const africa = ['nigeria', 'niger', 'ghana', 'kenya'];
const asia = ['korea', 'japan', 'vietnam', 'china'];

const countries = africa.concat(asia);

console.log(countries);

// ["nigeria", "niger", "ghana", "kenya", "korea", "japan", "vietnam", "china"]

7 . some()
ああ!私のfave配列方法は、ここにあります.このメソッドは、すべての要素が受け取る関数と一致し、Booleanを返します.
私はこのメソッドを何度も使用しており、以下は最近のユースケースの例です.

const postcodes = ['45220', '46689', '56322', '44520', '23252', '6422'];

const { postcode } = { name: 'james', paid: true, postcode: 45220 };

const isValidPostCode = postcodes.some((code) => code === postcode);

console.log(isValidPostCode);

// true

何が起こったのですか.注文フォームを構築しているとしましょう.私達は私達が配達する特定の郵便番号を持って、顧客が私達が配達しない場所に順序を置くことを望まない.それで、私たちは注文フォーム(行2)で入力された郵便番号を引き出し、いくつかのメソッドを使って検証します.上記のコードブロックでは、郵便番号がPostcode配列の内部にあるものと一致するので、IsValidPostCodeはtrueになります.

8章sort ()
配列内の要素を並べ替えることができないなら、それは楽しいでしょう.幸いにも、私たちにそれをする方法があります.JavaScriptのソートメソッドは、引数として受け取る関数に基づいて、ソートされた要素ベースの配列を返します.デフォルトでは、それは昇順でソートするが、我々はそれを変更することができます.

const fruits = ['banana', 'mango', 'apple', 'kiwi'];

fruit.sort();

console.log(fruits);

// ["apple", "banana", "kiwi", "mango"]

const numbers = [9, 5, 7, 3, 2];

//  descending
numbers.sort((a, b) => b - a);

console.log(numbers);
// [9, 7, 5, 3, 2]

// ascending
numbers.sort((a, b) => a - b);
console.log(numbers);
// [2, 3, 5, 7, 9]

9 . findinDex ()
配列の中の要素のインデックスを見つけることは、その配列が非常に大きいならば、非常に困難です.ありがたいことに、findindexメソッドでは、簡単に行うことができます.FindIndexメソッドは、関数を受け取り、要素が存在しない場合、最初の要素のインデックスまたは- 1を返します.

const cars = ['audi', 'volvo', 'benz', 'honda'];

//  returns true
const carIndex = cars.findIndex((car) => car === 'honda');

console.log(carIndex);
// 3

//  returns false
const carIndex = cars.findIndex((car) => car === 'toyota');
console.log(carIndex);
//  -1

10 . slice ()
このメソッドは配列をスライスし、スライスされた部分ベースを開始インデックスとスライスカウントで返します.それは2つの引数をとります.最初の引数は開始インデックスと2番目の引数です.

const asia = ['korea', 'japan', 'vietnam', 'china'];

// @params starting index, slice count
const sliced = asia.slice(1, 3)

console.log(sliced)
// ['japan', 'vietnam']

あなたは、githubレポhereをチェックアウトすることができます.星を離れるのを忘れないで.
読んでくれてありがとう、この記事から何かを学びたいです.