【JavaScript】配列から特定の要素を削除する方法まとめ
2023/1/17
2023/1/17
今回は、JavaScriptの配列内の特定のデータを削除する方法をまとめていきます。
特定の要素を複数リストで指定したい場合なども紹介しています。
目次
今回使用するデータ
const fruits = ["apple", "banana", "cherry", "grape"];特定要素を配列から削除したい
今回は、fruitsの中から"banana"を削除します。
方法①：filter()を使う
const newFruits = fruits.filter(x => x !== "banana");console.log(newFruits)
// ['apple', 'cherry', 'grape']filter()は新しい配列を返します。
方法②：splice()を使う
const target_index = fruits.indexOf("banana"); // 該当する要素の位置を取得（なければ-1）
if (target_index > -1) {
fruits.splice(target_index, 1);
}
// splice(削除したい要素の位置, 開始位置から何個削除するか)console.log(fruits)
// ['apple', 'cherry', 'grape']splice()は元の配列（fruits）を返します。
複数要素を配列から一括削除したい
今回は、fruitsの中から"banana"と"cherry"を削除します。
パターン①：削除したい要素を文字列で複数指定する
const newFruits = fruits.filter(x => x !== "banana" && x !== "cherry");console.log(newFruits)
// ['apple', 'grape']パターン②：削除したい要素をリストで指定する
const deleteList = ["banana","cherry"];
const newFruits = fruits.filter(x => !deleteList.includes(x));console.log(newFruits)
// ['apple', 'grape']
最近の記事
音楽生成AI「Suno」の使い方まとめ！作詞作曲が簡単にできる？
簡単に曲が作れるAIということでよく聞く「Suno（Chirp）」についてまとめました。
目次「Suno」とはテキストからさまざまな音声を生成する「Bark」歌詞から曲を生成する「Chirp」...
2023/11/24
2023/11/24
【Open AI】APIの料金まとめ｜GPT・DALL·E・Whisperなど
Open AIのAPI（一部）の料金をまとめました。
参考のために日本円は「1ドル150円」で換算をしています。
目次Text generation: テキスト生成Assistants ...
2023/11/22
2023/11/22
【Next.js】Assistants APIの基本的なコードまとめ。
Open AIの「Assistants API」をNext.jsで使用する時の基本的なコードをまとめました。
目次Open AIのAPIセットアップ基本の使い方Threads: スレッドを作る...
2023/11/21
2023/11/21
【Next.js】Open AIのAPIでファイルをアップロードする方法。
今回は、Next.jsサイトからOpen AIのAPI（Upload file）で、ファイルをアップロードする方法を実装するのに時間がかかったのでその過程と最終コードをまとめます。（Vercelにデ...
2023/11/21
2023/11/22
「生成系AIのWEBプロダクトTOP50」をまとめてみる。
Andreessen Horowitzが出している記事で紹介されている「AIプロダクトの月間訪問者数ランキングTOP50」のサービスをまとめました。
目次ChatGPTcharacter.ai...
2023/10/3
2023/10/3
【Next.js 13】NextAuth+FireStoreにユーザー情報を保存する。
今回は、以下の3つをNext.js 13で実装するためのメモです。
Googleアカウントでログインできる
アカウント、セッション情報をFirestoreに保存する
サーバーサイ...
2023/7/12
2023/7/12