Lodash - JavaScript パワー ツール

Underscore.js の軽量代替品である Lodash は、一般的なプログラミング タスクを簡素化する人気の JavaScript ユーティリティ ライブラリです。以下の上位 20 個の Lodash 関数を調べて、JavaScript スキルを向上させてください:

---

1. _.get

• オブジェクトからネストされたプロパティを安全に取得し、プロパティが存在しない場合のエラーを回避します。

const obj = { a: { b: { c: 42 } } }; _.get(obj, 'a.b.c', 'default'); // 42

---

2. _.set

• オブジェクト内のネストされたプロパティの値を設定し、中間プロパティが存在しない場合は作成します。

const obj = {}; _.set(obj, 'a.b.c', 42); console.log(obj); // { a: { b: { c: 42 } } }

---

3. _.cloneDeep

• オブジェクトまたは配列のディープ コピーを作成します。

const arr = [{ a: 1 }]; const deepClone = _.cloneDeep(arr);

---

4. _.デバウンス

• 最後の呼び出しから指定された時間が経過するまで関数の実行を遅らせます。

const log = _.debounce(() => console.log('Debounced!'), 300); window.addEventListener('resize', log);

---

5. _.スロットル

• 関数が指定された時間間隔内で最大 1 回実行されるようにします。

const log = _.throttle(() => console.log('Throttled!'), 1000); window.addEventListener('scroll', log);

---

6. _.isEmpty

• 値が空のオブジェクト、配列、または偽の値であるかどうかを確認します。

_.isEmpty([]); // true _.isEmpty({}); // true _.isEmpty(''); // true

---

7. _.merge

• 2 つ以上のオブジェクトを深くマージし、それらのプロパティを組み合わせます。

const obj1 = { a: { b: 1 } }; const obj2 = { a: { c: 2 } }; _.merge(obj1, obj2); // { a: { b: 1, c: 2 } }

---

8. _.pick

• 選択したプロパティで構成されるオブジェクトを作成します。

const obj = { a: 1, b: 2, c: 3 }; _.pick(obj, ['a', 'c']); // { a: 1, c: 3 }

---

9. _.省略

• 指定されたプロパティを除いたオブジェクトを作成します。

const obj = { a: 1, b: 2, c: 3 }; _.omit(obj, ['b']); // { a: 1, c: 3 }

---

10. _.uniq

• 配列から重複した値を削除します。

_.uniq([1, 2, 2, 3]); // [1, 2, 3]

---

11. _.groupBy

• 指定された基準に基づいて配列の要素をグループ化します。

_.groupBy([6.1, 4.2, 6.3], Math.floor); // { '4': [4.2], '6': [6.1, 6.3] }

---

12. _.sortBy

• 特定のプロパティまたは基準に基づいてオブジェクトの配列を並べ替えます。

const users = [{ name: 'Tom', age: 30 }, { name: 'Jerry', age: 20 }]; _.sortBy(users, 'age'); // [{ name: 'Jerry', age: 20 }, { name: 'Tom', age: 30 }]

---

13. _.map

• コレクション内の各要素を変換して新しい配列を作成します。

_.map([1, 2, 3], n => n * 2); // [2, 4, 6]

---

14. _.filter

• 指定された条件に合格する要素を含む配列を作成します。

_.filter([1, 2, 3, 4], n => n % 2 === 0); // [2, 4]

---

15. _.find

• 条件を満たす最初の要素を検索します。

_.find([1, 2, 3, 4], n => n > 2); // 3

---

16. _.平らにする

• ネストされた配列を単一レベルの配列にフラット化します。

_.flatten([1, [2, [3, [4]]]]); // [1, 2, [3, [4]]]

---

17. _. flattenDeep

• ネストされた配列を完全な単一レベルの配列にフラット化します。

_.flattenDeep([1, [2, [3, [4]]]]); // [1, 2, 3, 4]

---

18. _.違い

• 2 番目の配列にない最初の配列の値を返します。

const obj = { a: { b: { c: 42 } } }; _.get(obj, 'a.b.c', 'default'); // 42

---

19. _.chunk

• 配列を指定されたサイズのグループに分割します。

const obj = {}; _.set(obj, 'a.b.c', 42); console.log(obj); // { a: { b: { c: 42 } } }

---

20. _.isEqual

• 深い比較を実行して、2 つの値が等しいかどうかを判断します。

const arr = [{ a: 1 }]; const deepClone = _.cloneDeep(arr);

---

学び続けて楽しんでください!

以上がLodash - JavaScript パワー ツールの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。