JavaScriptの小技集 - Qiita
はじめに 初投稿です。 知ってたら便利になる小技が無かったのでまとめました。 「小技が知りたい...だけど検索しても出てこない...！」 そういう時に役立ちます。 比較的古いバージョンのJSでは一部の小技が使えないかもしれません。 随時追加予定です。他に小技をご存じの方はコメント欄にGO。 おことわり この記事は、あくまで"こんなやり方もあるよ"と紹介しているだけなので、何でもかんでもこれらの小技を使うと、かえってコードの可読性を下げる可能性があります。コードサイズと可読性を天秤にかけてどちらが良いかを都度確認しましょう。 記事内の間違った部分の指摘等はこの記事のコメントや編集リクエストでして下さい。 当方コードゴルファーなので、バイト数短縮小技も入れていることをご了承ください（一応該当する節には＊をつけています）。 配列 配列の重複した値を削除1 const meta = ["foo",
あなたが知らないであろう15個の強力なJavaScriptのテクニック🗡🔈🔥
はじめに この記事はこちらの記事の和訳となります。 なお、著者には許可をいただいております。是非原文もご覧ください。 拙訳なので、ご指摘などあればお待ちしております。 Javascriptのバグ修正や答えを求めてGoogleやStackOverflowを探し回るのは楽しくないでしょう🏴☠️。 この記事では、生産性⚡を最大化し、苦痛🩸を最小化する、20個（訳註:正確には15個）の短く、パワフルなJavaScriptのテクニックを紹介します。 それではコードを見ていきましょう🤘 配列の重複を除去 配列から重複した要素を除去します。 const arr = ["a", "b", "c", "d", "d", "c", "e"] const uniqueArray = Array.from(new Set(arr)); console.log(uniqueArray); // ['a',
知っておくと実装に役立つ！JavaScriptのテクニックのまとめ
デベロッパーのコミュニティには、実装に役立つテクニックやヒントが満載です。その中から特に有用なJavaScriptのテクニックとヒントを紹介します。 8 JavaScript Tips & Tricks That No One Teaches 🚀 by Garvit Motwani (@GarvitMotwani) 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 はじめに 1. JavaScriptにおける機能継承 2. .map()の置換 3. 数値から文字列に、文字列から数値に 4. lengthを使用して配列のサイズを変更したり、空にする 5. 配列の分割で値を入れ替える 6. 配列から重複を削除する 7. ループのコードを少なくする 8. パフォーマンス 終わりに はじめに JavaScriptは世界で最もクールな言語
配列を征する者はJSを制す。JavaScriptのスマートな配列操作テクニック - ICS MEDIA
JavaScriptでコードを記述する際、配列の各要素について処理をするケースは頻出します。開発の現場で配列操作の処理を見ていると、次のようなケースがよくあります。 配列の非破壊の望まれる場面が増えているが、元の配列を破壊操作している filter()やevery()など配列のメソッドで書けるところを、forEach()メソッドやfor ... of文を使ってコードを記載し、冗長になっている 記述しても効果のないArray.from()を使用している コード的には問題なく、アプリケーションは意図的に動作しているかもしれません。しかし、冗長な記述は可読性が低下し、予期せぬバグを誘発する可能性があるでしょう。 本記事では、配列操作でよく見かける冗長な記述を、簡潔な記述で置き換える方法について解説します。 本記事で紹介するJavaScriptの配列操作のチートシートを用意したので、まとめて読みた
もう配列のメソッド（とか）全部説明する。（配列とかおれおれAdvent Calendar2018 – 24日目） | Ginpen.com
配列とかおれおれAdvent Calendar2018 – 24日目 全部やる。 一覧 Array | MDN スタティックメソッド インスタンスメソッド 配列を作成 [] new Array(), Array() Array.from() Array.of() 新規配列を返却 Array.prototype.concat() Array.prototype.filter() Array.prototype.map() Array.prototype.reduce() Array.prototype.reduceRight() Array.prototype.slice() 検索 Array.prototype.every() Array.prototype.find() Array.prototype.findIndex() Array.prototype.includes() Arra
JavaScriptの配列の使い方まとめ。要素の追加,結合,取得,削除。 - Qiita
はじめに ここではJavaScriptの配列である、Arrayの基本的な使い方をまとめました。主な内容としては、要素の追加、結合、取得、削除となります。 JavaScriptの最新情報などの技術系のみをつぶやくTwitterをはじめました。 Twitter: @takeharumikami RSSはこちら RSS: http://qiita.com/takeharu/feed Feedly: フォロー
スプレッド演算子……じゃなくて、スプレッド構文の使える場所とか使い方とかそういう。（配列とかおれおれAdvent Calendar2018 – 20日目） | Ginpen.com
const arr1 = [11, 22, 33]; const arr2 = [44, 55]; const arr3 = [...arr1, ...arr2]; console.log(arr3); // => [ 11, 22, 33, 44, 55 ] const arr4 = [0, ...arr1, 0, ...arr2, 0]; console.log(arr4); // => [ 0, 11, 22, 33, 0, 44, 55, 0 ] 次の個所で利用可能です。 配列初期化子 [] オブジェクト初期化子 {} 関数呼び出し時の引数 () 分割代入 = 、関数の仮引数 () 配列初期化子 [] ... に続けて反復可能 (iterable) なオブジェクトを置きます。まあ普通は配列ですね。 ECMAScript® 2018 Language Specification 12
反復処理の中身、IterableとIteratorについて仕様書を調べてみた。（配列とかおれおれAdvent Calendar2018 – 19日目） | Ginpen.com
配列とかおれおれAdvent Calendar2018 – 19日目 ここまで何度か出てきた反復可能 (iterable) と反復子 (iterator) のお話です。やっと。 先にまとめ Iterableオブジェクトは Iteratorを返すメソッド [Symbol.iterator] を持つ for-of で使える Iteratorオブジェクトは IteratorResultを返すメソッド next() を持つ IteratorResultオブジェクトは プロパティ done, value を持つ 配列は Iterableである Iteratorではない arr.values() は Iterableである Iteratorである Generatorオブジェクトは Iterableであり、かつIteratorである Generator関数は function*(){} のやつ Gene
配列で重複する項目を取り除くやつ4種。（配列とかおれおれAdvent Calendar2018 – 18日目） | Ginpen.com
配列とかおれおれAdvent Calendar2018 – 18日目 ありそうでないメソッド、それが重複排除です。 Underscore.jsやLodashには uniq() てのがあって、こんな感じ↓で使えます。
だいたいの繰り返しは配列のforEach()でいける。（配列とかおれおれAdvent Calendar2018 – 17日目） | Ginpen.com
配列とかおれおれAdvent Calendar2018 – 16日目 繰り返しにもいろいろあるよ。 for, while → for文を仕様からじっくり見てみる。あとwhileとか。（配列とかおれおれAdvent Calendar2018 – 13日目） for-in → for-inの仕様も見てみたよ。使う機会なさそうだけど。（配列とかおれおれAdvent Calendar2018 – 14日目） for-of → for-ofで配列も普通のオブジェクトも反復しよう。（配列とかおれおれAdvent Calendar2018 – 15日目） for-await-of → 非同期に繰り返すならfor-await-of構文が使える、けど使わない方が良いかも。（配列とかおれおれAdvent Calendar2018 – 16日目） forEach() ← イマココ お待たせ！ 現代的JavaSc
for-ofで配列も普通のオブジェクトも反復しよう。（配列とかおれおれAdvent Calendar2018 – 15日目） | Ginpen.com
配列とかおれおれAdvent Calendar2018 – 15日目 繰り返しにもいろいろあるよ。 for, while → for文を仕様からじっくり見てみる。あとwhileとか。（配列とかおれおれAdvent Calendar2018 – 13日目） for-in → for-inの仕様も見てみたよ。使う機会なさそうだけど。（配列とかおれおれAdvent Calendar2018 – 14日目） for-of for-await-of → 別稿 forEach() → 別稿 for-in じゃない方です。 こっち使おう。 for-of 文 for-in と違って値の方を持ってきてくれます。 const arr = [11, 22, 33]; for (const value of arr) { console.log(value); } // 11 // 22 // 33
for文を仕様からじっくり見てみる。あとwhileとか。（配列とかおれおれAdvent Calendar2018 – 13日目） | Ginpen.com
配列とかおれおれAdvent Calendar2018 – 13日目 繰り返しにもいろいろあるよ。 for, while for-in → 別稿 for-of → 別稿 for-await-of → 別稿 forEach() → 別稿 for 文 古より伝わる技法。JavaScriptに限らずだいたいの言語で利用できます。 const arr = [11, 22, 33]; for (let i = 0; i < arr.length; i++) { const item = arr[i]; console.log(item); } なお普通に先頭から末尾まで繰り返す場合は forEach() を使う方が現代では多いかと。 さて for 文、実行順序としては、 初期化 let i = 0 検証 i < arr.length false なら終了 繰り返し処理 console.log(ite
その名の通りのfilter()で絞り込み。（配列とかおれおれAdvent Calendar2018 – 12日目） | Ginpen.com
const users = [ { id: 101, name: 'Alice', active: true }, { id: 102, name: 'Bob', active: false }, { id: 103, name: 'Charlie', active: true }, ]; const activeUsers = users.filter((v) => v.active); console.log(activeUsers); 仕様 配列のこれ系のメソッドと同じです。 Array.prototype.filter() – JavaScript | MDN newArray = arr.filter(callback(element[, index[, array]])[, thisArg]) 引数 filter() は引数に、関数オブジェクト callback(element
配列初期化子 [] のひみつ。（配列とかおれおれAdvent Calendar2018 – 09日目） | Ginpen.com
配列とかおれおれAdvent Calendar2018 – 09日目 [] のやつです。初期化子 (initializer) と呼ばれます。 「リテラル」と呼んでも差し支えない。はず。 説明 仕様書では以下のように説明されています。 12.2.5 Array Initializer 12.2.5 Array Initializer (Note: An ArrayLiteral is an expression describing the initialization of an Array object, using a list, of zero or more expressions each of which represents an array element, enclosed in square brackets. The elements need not be lite
配列のコンストラクターを改めて見てみる（配列とかおれおれAdvent Calendar2018 – 01日目） | Ginpen.com
配列とかおれおれAdvent Calendar2018 – 01日目 やっぱり初日はコンストラクターからでしょう、という感じで今年もお願いします。 普通は配列記法（あるいは初期化子） [] を使って作ると思うんだけど、コンストラクターからも作成できます。 コンストラクターは3パターン、引数のないものと、要素数を指定するもの、初期要素を与えるものとがあります。 説明 まず仕様書を確認しときます。 22.1.1 The Array Constructor 22.1.1The Array Constructor The Array constructor: is the intrinsic object %Array%. is the initial value of the Array property of the global object. creates and initializes
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
4歳娘「パパ、懐かしいJavaScript書いてるね！」 - Qiita
空じゃないけど空の配列の話。（配列とかおれおれAdvent Calendar2018 – 22日目） | Ginpen.com
任意の要素数の配列を作る方法7通り。（配列とかおれおれAdvent Calendar2018 – 10日目） | Ginpen.com
配列風オブジェクトをArray.from()で本物の配列へ変換。（配列とかおれおれAdvent Calendar2018 – 05日目） | Ginpen.com
Array(3)の代わりにArray.of(3)を使おう。（配列とかおれおれAdvent Calendar2018 – 03日目） | Ginpen.com