1. 通過鍵對對象數(shù)組進行分組

我們定義了一個名為 groupBy 的函數(shù)，它以一個對象數(shù)組和一個鍵作為參數(shù)。該函數(shù)的目的是將數(shù)組中的對象按指定的鍵進行分組。

const groupBy = (arr, key) =>
 arr.reduce(
  (acc, obj) => ({ ...acc, [obj[key]]: [...(acc[obj[key]] || []), obj] }),
  {}
 )


const people = [
 { name: "Alice", age: 21 },
 { name: "Bob", age: 22 },
 { name: "Charlie", age: 21 },
 { name: "David", age: 23 },
 { name: "Eve", age: 22 }
]


console.log(groupBy(people, "age"))


/* Output:
{
 21: [
  { name: "Alice", age: 21 },
  { name: "Charlie", age: 21 }
 ],
 22: [
  { name: "Bob", age: 22 },
  { name: "Eve", age: 22 }
 ],
 23: [{ name: "David", age: 23 }]
}
*/

acc 參數(shù)是累加分組對象的累加器。obj 參數(shù)表示數(shù)組中的每個對象。

在 reduce() 方法內(nèi)部，使用擴展運算符 (...acc) 返回一個新對象。這將創(chuàng)建 accumulator 對象的淺表副本，以便可以在不更改原始對象的情況下對其進行修改。

新對象的屬性設置為與 key 參數(shù)的值相匹配的鍵。該屬性的值是一個包含被迭代對象的數(shù)組。

(acc[obj[key]] || []) 表達式檢查該屬性是否存在于累加器對象中。如果不存在，則返回一個空數(shù)組。展開運算符用于將數(shù)組與正在迭代的當前對象連接起來。

最后，groupBy() 函數(shù)返回包含分組對象的累加器對象。

2. 返回數(shù)組的中位數(shù)

我們實現(xiàn)了一個名為 median 的函數(shù)，它將一個數(shù)字數(shù)組作為輸入，按升序?qū)ζ溥M行排序，并返回排序后的數(shù)組的中值。

當數(shù)組的元素個數(shù)為奇數(shù)時，排序數(shù)組的中值就是中間的元素。當數(shù)組元素個數(shù)為偶數(shù)時，中值取中間兩個元素的平均值。

const median = (arr) => {
 const sorted = arr.sort()
 const middle = Math.floor(sorted.length / 2)
 return sorted.length % 2 === 0
  ? (sorted[middle - 1] + sorted[middle]) / 2
  : sorted[middle]
}


const oddArr = [3, 1, 4, 2, 5]
console.log(median(oddArr)) // 3


const evenArr = [1, 2, 5, 6]
console.log(median(evenArr)) // 3.5

第一個例子，輸入數(shù)組[3, 1, 4, 2, 5]被排序為[1, 2, 3, 4, 5]，中間元素為3。因此，輸入數(shù)組的中值 是 3。

在第二個例子中，輸入數(shù)組[1,2,5,6]被排序為[1,2,5,6]，中間兩個元素為2和5。因此，輸入數(shù)組的中值為 (2 + 5) / 2 = 3.5。

3.返回數(shù)組的模式

數(shù)組的眾數(shù)是數(shù)組中出現(xiàn)頻率最高的值。如果有多個值具有相同的最高頻率，則所有這些值都被視為眾數(shù)。

const mode = (arr) => {
 const counts = arr.reduce(
  (acc, curr) => ({ ...acc, [curr]: (acc[curr] || 0) + 1 }),
  {}
    )


 const maxCount = Math.max(...Object.values(counts))


 return Object.keys(counts)
  .filter((key) => counts[key] === maxCount)
  .map(Number)
}


const arr1 = [1, 2, 3, 2, 4, 2, 5]
console.log(mode(arr1)) // [2]


const arr2 = [1, 2, 3, 2, 4, 4, 5]
console.log(mode(arr2)) // [2, 4]

在第一個示例中，輸入數(shù)組 [1, 2, 3, 2, 4, 2, 5] 的計數(shù)為 { 1: 1, 2: 3, 3: 1, 4: 1, 5: 1 }。最高計數(shù)為 3，出現(xiàn)值 2。因此，輸入數(shù)組的模式為 [2]。

在第二個示例中，輸入數(shù)組 [1, 2, 3, 2, 4, 4, 5] 的計數(shù)為 { 1: 1, 2: 2, 3: 1, 4: 2, 5: 1 }。最高計數(shù)為 2，出現(xiàn)在值 2 和 4 中。因此，輸入數(shù)組的模式為 [2, 4]。

4. 使用擴展運算符和 Array.from 創(chuàng)建一個長度為 n 的數(shù)組

使用擴展運算符和 Array.from() 創(chuàng)建一個長度為 n 的新數(shù)組。生成的數(shù)組包含從 0 到 n-1 的升序排列的數(shù)字。

const n = 5
const arr = [...Array.from({ length: n }, (_, index) => index)]


console.log(arr) // [ 0, 1, 2, 3, 4 ]

在此示例中，n 設置為 5，因此，生成的數(shù)組 arr 的長度為 5。數(shù)組的值是使用函數(shù) (_, index) => index 生成的，該函數(shù)返回數(shù)組的當前索引。因此，結(jié)果數(shù)組將為 [0, 1, 2, 3, 4]。

5. 使用解構(gòu)獲取數(shù)組的最后一個元素

此函數(shù)的目的是使用解構(gòu)獲取數(shù)組的最后一個元素。

const last = (arr) => [...arr].pop()


const people = [
 { name: "Alice", age: 21 },
 { name: "Bob", age: 22 },
 { name: "Charlie", age: 21 },
 { name: "David", age: 23 },
 { name: "Eve", age: 22 }
]


console.log(last(people)) // { name: "Eve", age: 22 }

在 last() 函數(shù)內(nèi)部，展開運算符 (...) 用于創(chuàng)建原始數(shù)組的副本。這是必需的，因為 pop() 方法會修改原始數(shù)組并返回刪除的元素。

然后，對數(shù)組的副本調(diào)用 pop() 方法，刪除并返回數(shù)組的最后一個元素。由于在調(diào)用 pop() 方法之前復制了數(shù)組，因此不會修改原始數(shù)組。

last() 函數(shù)返回數(shù)組的最后一個元素。

6. 使用布爾構(gòu)造函數(shù)檢查變量是否為真

我們函數(shù)的目的是使用布爾構(gòu)造函數(shù)檢查變量是否為真。

布爾構(gòu)造函數(shù)是 JavaScript 中的一個內(nèi)置函數(shù)，可將值轉(zhuǎn)換為布爾值。如果該值為 truthy，則布爾構(gòu)造函數(shù)返回 true。如果該值為 falsy，則布爾構(gòu)造函數(shù)返回 false。

const isTruthy = (val) => Boolean(val)


console.log(isTruthy(false)) // false
console.log(isTruthy(0)) // false
console.log(isTruthy(-0)) // false
console.log(isTruthy(0n)) // false
console.log(isTruthy("")) // false
console.log(isTruthy(null)) // false
console.log(isTruthy(undefined)) // false
console.log(isTruthy(NaN)) // false


console.log(isTruthy(true)) // true
console.log(isTruthy({})) // true
console.log(isTruthy([])) // true
console.log(isTruthy(42)) // true
console.log(isTruthy("0")) // true
console.log(isTruthy("false")) // true
console.log(isTruthy(new Date())) // true
console.log(isTruthy(Infinity)) // true

7. 從數(shù)組中刪除虛假值

布爾構(gòu)造函數(shù)用作 filter() 方法的回調(diào)函數(shù)。如果值為真，則布爾構(gòu)造函數(shù)返回真，如果值為假，則返回假。因此，filter() 方法從原始數(shù)組中刪除所有虛假值。

const compact = (arr) => arr.filter(Boolean)


const falsyArr = [false, 0, -0, 0n, "", null, undefined, NaN]
const mixArr = [true, false, {}, 0, [], "", "0", null, "false", undefined, 42]


console.log(compact(falsyArr)) // []
console.log(compact(mixArr)) // [ true, {}, [], '0', 'false', 42 ]

在 compact() 函數(shù)內(nèi)部，使用布爾構(gòu)造函數(shù)作為回調(diào)函數(shù)對 arr 參數(shù)調(diào)用 filter() 方法。這將返回一個新數(shù)組，其中僅包含原始數(shù)組的真值。

compact() 函數(shù)返回新數(shù)組。

當執(zhí)行 console.log() 語句時，compact(falsyArr) 的輸出是一個空數(shù)組，因為 falsyArr 數(shù)組中的所有值都是假的。compact(mixArr) 的輸出是一個數(shù)組，它只包含 mixArr 數(shù)組的真實值，即 true、一個空對象 {}、一個空數(shù)組 []、字符串“0”、字符串“false”，以及 數(shù)字 42。所有虛假值（false、0、""、null、undefined 和 NaN）都已從 mixArr 數(shù)組中刪除。

8. 將字符串數(shù)組轉(zhuǎn)換為數(shù)字

函數(shù)的目的是將字符串數(shù)組轉(zhuǎn)換為數(shù)字數(shù)組。Number 構(gòu)造函數(shù)用作 map() 方法的回調(diào)函數(shù)。Number 構(gòu)造函數(shù)將字符串轉(zhuǎn)換為數(shù)字。

const toNumbers = (arr) => arr.map(Number)


const strArr = ["1", "2", "3", "4", "5"]


console.log(toNumbers(strArr)) // [ 1, 2, 3, 4, 5 ]

在 toNumbers() 函數(shù)內(nèi)部，使用 Number 構(gòu)造函數(shù)作為回調(diào)函數(shù)對 arr 參數(shù)調(diào)用 map() 方法。這將返回一個包含轉(zhuǎn)換值的新數(shù)組。

9. 返回一個鍵值翻轉(zhuǎn)的對象

此函數(shù)的目的是返回一個新對象，其中翻轉(zhuǎn)了原始對象的鍵和值。

Object.entries() 方法用于從原始對象創(chuàng)建鍵值對數(shù)組。然后使用 map() 方法迭代數(shù)組中的每個鍵值對，并返回一個新的翻轉(zhuǎn)鍵值對數(shù)組。最后，使用 Object.fromEntries() 方法從翻轉(zhuǎn)的鍵值對數(shù)組中創(chuàng)建一個新對象。

const flip = (obj) =>
 Object.fromEntries(Object.entries(obj).map(([key, value]) => [value, key]))


const myDog = {
 firstName: "oscar",
 lastName: "king",
 age: 3
}


console.log(flip(myDog)) // { 3: 'age', oscar: 'firstName', king: 'lastName' }

在 flip() 函數(shù)內(nèi)部，對 obj 參數(shù)調(diào)用 Object.entries() 方法以創(chuàng)建鍵值對數(shù)組。然后，在鍵值對數(shù)組上調(diào)用 map() 方法。對于每個鍵值對，map() 方法解構(gòu)鍵和值變量，并返回一個新數(shù)組，其中值作為第一個元素，鍵作為第二個元素。這將創(chuàng)建一個翻轉(zhuǎn)的鍵值對數(shù)組。

最后，在翻轉(zhuǎn)的鍵值對數(shù)組上調(diào)用 Object.fromEntries() 方法以使用翻轉(zhuǎn)的鍵值對創(chuàng)建一個新對象。

flip() 函數(shù)返回新對象。

執(zhí)行 console.log() 語句時，輸出是一個新對象，其中翻轉(zhuǎn)了原始 myDog 對象的鍵和值。firstName 鍵及其值“oscar”已翻轉(zhuǎn)為“oscar”鍵及其值“firstName”。lastName 鍵及其值“king”已翻轉(zhuǎn)為“king”鍵及其值“l(fā)astName”。age 鍵及其值 3 已翻轉(zhuǎn)為 3 鍵及其值“age”。

10. 返回一個只有特定鍵的對象

此函數(shù)的目的是返回一個新對象，該對象僅包含原始對象中指定的鍵及其對應的值。

const pick = (obj, keys) =>
 Object.fromEntries(
  Object.entries(obj).filter(([key]) => keys.includes(key))
 )


const myDog = {
 firstName: "oscar",
 lastName: "king",
 age: 3
}


console.log(pick(myDog, [])) // {}
console.log(pick(myDog, ["firstName"])) // { firstName: 'oscar' }
console.log(pick(myDog, ["firstName", "lastName"])) // { firstName: 'oscar', lastName: 'king' }

在 pick() 函數(shù)內(nèi)部，對 obj 參數(shù)調(diào)用 Object.entries() 方法以創(chuàng)建鍵值對數(shù)組。然后，在鍵值對數(shù)組上調(diào)用 filter() 方法。對于每個鍵值對，filter() 方法解構(gòu)鍵變量，如果鍵數(shù)組包含鍵則返回 true。這將創(chuàng)建一個過濾后的鍵值對數(shù)組。

最后，在過濾后的鍵值對數(shù)組上調(diào)用 Object.fromEntries() 方法來創(chuàng)建一個僅包含指定鍵及其對應值的新對象。pick() 函數(shù)返回新對象。

11. 返回一個只有唯一值的對象

此函數(shù) uniqueValues 將一個對象作為參數(shù)并返回一個新對象，該對象僅包含來自輸入對象的唯一值。

const uniqueValues = (obj) =>
 Object.fromEntries(
  Object.entries(obj).filter(
   ([key, value], index, entries) =>
    entries.findIndex(([k, v]) => v === value) === index
  )
 )


const myDog = {
 id: 3,
 firstName: "oscar",
 lastName: "oscar",
 age: 3
}


console.log(uniqueValues(myDog)) // { id: 3, firstName: 'oscar' }

它首先在輸入對象上調(diào)用 Object.entries() 方法以獲取鍵值對數(shù)組。然后，它使用 filter() 方法過濾條目數(shù)組，并僅返回值唯一的條目。

要檢查一個值是否唯一，它在原始條目數(shù)組上使用 findIndex() 方法。它查找與當前過濾的條目具有相同值的第一個條目的索引。如果當前條目的索引等于第一個匹配條目的索引，則意味著該值是唯一的，應該包含在結(jié)果對象中。

最后，它使用 Object.fromEntries() 方法將過濾后的條目數(shù)組轉(zhuǎn)換回對象。

在示例代碼中，使用具有某些重復值的對象 myDog 調(diào)用 uniqueValues 函數(shù)。該函數(shù)返回一個僅包含唯一值并刪除重復值的新對象。生成的對象具有 id：3 和 firstName：'oscar'。