
1. 通過鍵對對象數組進行分組
我們定義了一個名為 groupBy 的函數,它以一個對象數組和一個鍵作為參數。該函數的目的是將數組中的對象按指定的鍵進行分組。
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 參數是累加分組對象的累加器。obj 參數表示數組中的每個對象。
在 reduce() 方法內部,使用擴展運算符 (...acc) 返回一個新對象。這將創建 accumulator 對象的淺表副本,以便可以在不更改原始對象的情況下對其進行修改。
新對象的屬性設置為與 key 參數的值相匹配的鍵。該屬性的值是一個包含被迭代對象的數組。
(acc[obj[key]] || []) 表達式檢查該屬性是否存在于累加器對象中。如果不存在,則返回一個空數組。展開運算符用于將數組與正在迭代的當前對象連接起來。
最后,groupBy() 函數返回包含分組對象的累加器對象。
2. 返回數組的中位數
我們實現了一個名為 median 的函數,它將一個數字數組作為輸入,按升序對其進行排序,并返回排序后的數組的中值。
當數組的元素個數為奇數時,排序數組的中值就是中間的元素。當數組元素個數為偶數時,中值取中間兩個元素的平均值。
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
第一個例子,輸入數組[3, 1, 4, 2, 5]被排序為[1, 2, 3, 4, 5],中間元素為3。因此,輸入數組的中值 是 3。
在第二個例子中,輸入數組[1,2,5,6]被排序為[1,2,5,6],中間兩個元素為2和5。因此,輸入數組的中值為 (2 + 5) / 2 = 3.5。
3.返回數組的模式
數組的眾數是數組中出現頻率最高的值。如果有多個值具有相同的最高頻率,則所有這些值都被視為眾數。
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]
在第一個示例中,輸入數組 [1, 2, 3, 2, 4, 2, 5] 的計數為 { 1: 1, 2: 3, 3: 1, 4: 1, 5: 1 }。最高計數為 3,出現值 2。因此,輸入數組的模式為 [2]。
在第二個示例中,輸入數組 [1, 2, 3, 2, 4, 4, 5] 的計數為 { 1: 1, 2: 2, 3: 1, 4: 2, 5: 1 }。最高計數為 2,出現在值 2 和 4 中。因此,輸入數組的模式為 [2, 4]。
4. 使用擴展運算符和 Array.from 創建一個長度為 n 的數組
使用擴展運算符和 Array.from() 創建一個長度為 n 的新數組。生成的數組包含從 0 到 n-1 的升序排列的數字。
const n = 5
const arr = [...Array.from({ length: n }, (_, index) => index)]
console.log(arr) // [ 0, 1, 2, 3, 4 ]
在此示例中,n 設置為 5,因此,生成的數組 arr 的長度為 5。數組的值是使用函數 (_, index) => index 生成的,該函數返回數組的當前索引。因此,結果數組將為 [0, 1, 2, 3, 4]。
5. 使用解構獲取數組的最后一個元素
此函數的目的是使用解構獲取數組的最后一個元素。
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() 函數內部,展開運算符 (...) 用于創建原始數組的副本。這是必需的,因為 pop() 方法會修改原始數組并返回刪除的元素。
然后,對數組的副本調用 pop() 方法,刪除并返回數組的最后一個元素。由于在調用 pop() 方法之前復制了數組,因此不會修改原始數組。
last() 函數返回數組的最后一個元素。
6. 使用布爾構造函數檢查變量是否為真
我們函數的目的是使用布爾構造函數檢查變量是否為真。
布爾構造函數是 JavaScript 中的一個內置函數,可將值轉換為布爾值。如果該值為 truthy,則布爾構造函數返回 true。如果該值為 falsy,則布爾構造函數返回 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. 從數組中刪除虛假值
布爾構造函數用作 filter() 方法的回調函數。如果值為真,則布爾構造函數返回真,如果值為假,則返回假。因此,filter() 方法從原始數組中刪除所有虛假值。
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() 函數內部,使用布爾構造函數作為回調函數對 arr 參數調用 filter() 方法。這將返回一個新數組,其中僅包含原始數組的真值。
compact() 函數返回新數組。
當執行 console.log() 語句時,compact(falsyArr) 的輸出是一個空數組,因為 falsyArr 數組中的所有值都是假的。compact(mixArr) 的輸出是一個數組,它只包含 mixArr 數組的真實值,即 true、一個空對象 {}、一個空數組 []、字符串“0”、字符串“false”,以及 數字 42。所有虛假值(false、0、""、null、undefined 和 NaN)都已從 mixArr 數組中刪除。
8. 將字符串數組轉換為數字
函數的目的是將字符串數組轉換為數字數組。Number 構造函數用作 map() 方法的回調函數。Number 構造函數將字符串轉換為數字。
const toNumbers = (arr) => arr.map(Number)
const strArr = ["1", "2", "3", "4", "5"]
console.log(toNumbers(strArr)) // [ 1, 2, 3, 4, 5 ]
在 toNumbers() 函數內部,使用 Number 構造函數作為回調函數對 arr 參數調用 map() 方法。這將返回一個包含轉換值的新數組。
9. 返回一個鍵值翻轉的對象
此函數的目的是返回一個新對象,其中翻轉了原始對象的鍵和值。
Object.entries() 方法用于從原始對象創建鍵值對數組。然后使用 map() 方法迭代數組中的每個鍵值對,并返回一個新的翻轉鍵值對數組。最后,使用 Object.fromEntries() 方法從翻轉的鍵值對數組中創建一個新對象。
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() 函數內部,對 obj 參數調用 Object.entries() 方法以創建鍵值對數組。然后,在鍵值對數組上調用 map() 方法。對于每個鍵值對,map() 方法解構鍵和值變量,并返回一個新數組,其中值作為第一個元素,鍵作為第二個元素。這將創建一個翻轉的鍵值對數組。
最后,在翻轉的鍵值對數組上調用 Object.fromEntries() 方法以使用翻轉的鍵值對創建一個新對象。
flip() 函數返回新對象。
執行 console.log() 語句時,輸出是一個新對象,其中翻轉了原始 myDog 對象的鍵和值。firstName 鍵及其值“oscar”已翻轉為“oscar”鍵及其值“firstName”。lastName 鍵及其值“king”已翻轉為“king”鍵及其值“lastName”。age 鍵及其值 3 已翻轉為 3 鍵及其值“age”。
10. 返回一個只有特定鍵的對象
此函數的目的是返回一個新對象,該對象僅包含原始對象中指定的鍵及其對應的值。
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() 函數內部,對 obj 參數調用 Object.entries() 方法以創建鍵值對數組。然后,在鍵值對數組上調用 filter() 方法。對于每個鍵值對,filter() 方法解構鍵變量,如果鍵數組包含鍵則返回 true。這將創建一個過濾后的鍵值對數組。
最后,在過濾后的鍵值對數組上調用 Object.fromEntries() 方法來創建一個僅包含指定鍵及其對應值的新對象。pick() 函數返回新對象。
11. 返回一個只有唯一值的對象
此函數 uniqueValues 將一個對象作為參數并返回一個新對象,該對象僅包含來自輸入對象的唯一值。
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' }
它首先在輸入對象上調用 Object.entries() 方法以獲取鍵值對數組。然后,它使用 filter() 方法過濾條目數組,并僅返回值唯一的條目。
要檢查一個值是否唯一,它在原始條目數組上使用 findIndex() 方法。它查找與當前過濾的條目具有相同值的第一個條目的索引。如果當前條目的索引等于第一個匹配條目的索引,則意味著該值是唯一的,應該包含在結果對象中。
最后,它使用 Object.fromEntries() 方法將過濾后的條目數組轉換回對象。
在示例代碼中,使用具有某些重復值的對象 myDog 調用 uniqueValues 函數。該函數返回一個僅包含唯一值并刪除重復值的新對象。生成的對象具有 id:3 和 firstName:'oscar'。