Tl; dr, đặt giá trị ban đầu Sử dụng phá hủy const bar = foo.reduce( badCallback, {})
// foo is still OK
foo // { a: 1, b: 2, c: 3 }
0Mà không phá hủy const bar = foo.reduce( badCallback, {})
// foo is still OK
foo // { a: 1, b: 2, c: 3 }
1Với TypeScript const bar = foo.reduce( badCallback, {})
// foo is still OK
foo // { a: 1, b: 2, c: 3 }
2Hãy thử phương pháp phá hủy: const arr = [ { x: 1 }, { x: 2 }, { x: 4 } ]
const result = arr.reduce( ( sum, { x } ) => sum + x , 0)
console.log( result ) // 7
Khóa của điều này là thiết lập giá trị ban đầu. Giá trị trả về trở thành tham số đầu tiên của lần lặp tiếp theo. Kỹ thuật được sử dụng trong câu trả lời hàng đầu không thành ngữCâu trả lời được chấp nhận đề xuất không vượt qua giá trị "tùy chọn". Điều này là sai, vì cách thành ngữ là tham số thứ hai luôn được bao gồm. Tại sao? Ba lý do: 1. Nguy hiểm-Không chuyển qua giá trị ban đầu là nguy hiểm và có thể tạo ra các tác dụng phụ và đột biến nếu hàm gọi lại là bất cẩn. -- Not passing in the initial value is dangerous and can create side-effects and mutations if the callback function is careless. Hãy chứng kiến const badCallback = (a,i) => Object.assign(a,i)
const foo = [ { a: 1 }, { b: 2 }, { c: 3 } ]
const bar = foo.reduce( badCallback ) // bad use of Object.assign
// Look, we've tampered with the original array
foo // [ { a: 1, b: 2, c: 3 }, { b: 2 }, { c: 3 } ]
Tuy nhiên, nếu chúng tôi đã thực hiện nó theo cách này, với giá trị ban đầu: const bar = foo.reduce( badCallback, {})
// foo is still OK
foo // { a: 1, b: 2, c: 3 }
Đối với bản ghi, trừ khi bạn có ý định biến đổi đối tượng gốc, hãy đặt tham số đầu tiên của const bar = foo.reduce( badCallback, {})
// foo is still OK
foo // { a: 1, b: 2, c: 3 }
3 thành một đối tượng trống. Như thế này: const bar = foo.reduce( badCallback, {})
// foo is still OK
foo // { a: 1, b: 2, c: 3 }
4.2 -Loại suy luận tốt hơn -Khi sử dụng một công cụ như TypeScript hoặc Trình chỉnh sửa như VS Code, bạn nhận được lợi ích khi nói với trình biên dịch ban đầu và nó có thể bắt lỗi nếu bạn đang làm sai. Nếu bạn không đặt giá trị ban đầu, trong nhiều tình huống, nó có thể không đoán được và bạn có thể kết thúc với các lỗi thời gian chạy đáng sợ. --When using a tool like Typescript or an editor like VS Code, you get the benefit of telling the compiler the initial and it can catch errors if you're doing it wrong. If you don't set the initial value, in many situations
it might not be able to guess and you could end up with creepy runtime errors. 3 - Tôn trọng các functor - JavaScript tỏa sáng tốt nhất khi đứa trẻ chức năng bên trong của nó được giải phóng. Trong thế giới chức năng, có một tiêu chuẩn về cách bạn "gấp" hoặc const bar = foo.reduce( badCallback, {})
// foo is still OK
foo // { a: 1, b: 2, c: 3 }
5 một mảng. Khi bạn gấp hoặc áp dụng một điều hấp dẫn vào mảng, bạn lấy các giá trị của mảng đó để xây dựng một loại mới. Bạn cần truyền đạt loại kết quả-bạn nên làm điều này ngay cả khi loại cuối cùng là các giá trị trong mảng, mảng khác hoặc bất kỳ loại nào khác. -- JavaScript shines best when its inner functional child is unleashed. In the functional world, there is a standard on how you "fold" or const bar = foo.reduce( badCallback, {})
// foo is still OK
foo // { a: 1, b: 2, c: 3 }
5 an array. When you fold or apply a catamorphism to the array, you take the values of that array to construct a new type. You need to
communicate the resulting type--you should do this even if the final type is that of the values in the array, another array, or any other type.Hãy nghĩ về nó một cách khác. Trong JavaScript, các chức năng có thể được truyền như dữ liệu, đây là cách thức hoạt động của cuộc gọi lại, kết quả của mã sau là gì? const bar = foo.reduce( badCallback, {})
// foo is still OK
foo // { a: 1, b: 2, c: 3 }
6Nó sẽ trả lại một số? Một đối tượng? Điều này làm cho nó rõ ràng hơn const bar = foo.reduce( badCallback, {})
// foo is still OK
foo // { a: 1, b: 2, c: 3 }
7Đọc thêm về thông số kỹ thuật lập trình chức năng tại đây: https://github.com/fantasyland/fantasy-land#printableable Một số nền tảng khácPhương thức const bar = foo.reduce( badCallback, {})
// foo is still OK
foo // { a: 1, b: 2, c: 3 }
5 có hai tham số,Array.prototype.reduce( callback, initialItem )
Hàm const bar = foo.reduce( badCallback, {})
// foo is still OK
foo // { a: 1, b: 2, c: 3 }
9 lấy các tham số sau(accumulator, itemInArray, indexInArray, entireArray) => { /* do stuff */ }
Cho lần lặp đầu tiên, Nếu Array.prototype.reduce( callback, initialItem )
0 được cung cấp, hàm const bar = foo.reduce( badCallback, {})
// foo is still OK
foo // { a: 1, b: 2, c: 3 }
5 sẽ truyền Array.prototype.reduce( callback, initialItem )
0 dưới dạng Array.prototype.reduce( callback, initialItem )
3 và mục đầu tiên của mảng là Array.prototype.reduce( callback, initialItem )
4.Nếu Array.prototype.reduce( callback, initialItem )
0 không được cung cấp, hàm const bar = foo.reduce( badCallback, {})
// foo is still OK
foo // { a: 1, b: 2, c: 3 }
5 sẽ chuyển mục đầu tiên trong mảng là Array.prototype.reduce( callback, initialItem )
0 và mục thứ hai trong mảng là Array.prototype.reduce( callback, initialItem )
4 có thể gây nhầm lẫn.not provided, the const bar = foo.reduce( badCallback, {})
// foo is still OK
foo // { a: 1, b: 2, c: 3 }
5 function passes the first item in the array as the Array.prototype.reduce( callback, initialItem )
0 and the second item in the array as Array.prototype.reduce( callback, initialItem )
4 which can be confusing behavior.
Tôi dạy và đề nghị luôn luôn đặt giá trị ban đầu của giảm. Bạn có thể kiểm tra tài liệu tại: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce Hi vọng điêu nay co ich! Phương thức Array.prototype.reduce( callback, initialItem )
9 thực thi chức năng gọi lại "giảm" do người dùng cung cấp trên mỗi phần tử của mảng, theo thứ tự, chuyển giá trị trả về từ tính toán trên phần tử trước. Kết quả cuối cùng của việc chạy bộ giảm tốc trên tất cả các phần tử của mảng là một giá trị duy nhất.Array.prototype.reduce( callback, initialItem )
9 method executes a user-supplied "reducer" callback function on each element of the array, in order, passing in the return value from the calculation on the preceding element. The final result of running the reducer across all elements of the array is a single value.
Lần đầu tiên gọi lại, không có "giá trị trả về của tính toán trước". Nếu được cung cấp, một giá trị ban đầu có thể được sử dụng ở vị trí của nó. Mặt khác, phần tử mảng tại chỉ mục 0 được sử dụng làm giá trị ban đầu và lần lặp bắt đầu từ phần tử tiếp theo (chỉ mục 1 thay vì chỉ mục 0). Có lẽ trường hợp dễ hiểu nhất đối với Array.prototype.reduce( callback, initialItem )
9 là trả lại tổng của tất cả các yếu tố trong một mảng:Thử nóBộ giảm tốc đi qua phần tử phần tử, ở mỗi bước, thêm giá trị mảng hiện tại vào kết quả từ bước trước (kết quả này là tổng chạy của tất cả các bước trước đó)-cho đến khi không còn phần tử nào nữa. Cú pháp// Arrow function
reduce((accumulator, currentValue) => { /* … */ })
reduce((accumulator, currentValue, currentIndex) => { /* … */ })
reduce((accumulator, currentValue, currentIndex, array) => { /* … */ })
reduce((accumulator, currentValue) => { /* … */ }, initialValue)
reduce((accumulator, currentValue, currentIndex) => { /* … */ }, initialValue)
reduce((accumulator, currentValue, currentIndex, array) => { /* … */ }, initialValue)
// Callback function
reduce(callbackFn)
reduce(callbackFn, initialValue)
// Inline callback function
reduce(function (accumulator, currentValue) { /* … */ })
reduce(function (accumulator, currentValue, currentIndex) { /* … */ })
reduce(function (accumulator, currentValue, currentIndex, array) { /* … */ })
reduce(function (accumulator, currentValue) { /* … */ }, initialValue)
reduce(function (accumulator, currentValue, currentIndex) { /* … */ }, initialValue)
reduce(function (accumulator, currentValue, currentIndex, array) { /* … */ }, initialValue)
Thông số(accumulator, itemInArray, indexInArray, entireArray) => { /* do stuff */ }
1Một hàm để thực thi cho mỗi phần tử trong mảng. Giá trị trả về của nó trở thành giá trị của tham số Array.prototype.reduce( callback, initialItem )
3 trong lần gọi tiếp theo của (accumulator, itemInArray, indexInArray, entireArray) => { /* do stuff */ }
1. Đối với lệnh gọi cuối cùng, giá trị trả về trở thành giá trị trả về của Array.prototype.reduce( callback, initialItem )
9.Hàm được gọi với các đối số sau: Array.prototype.reduce( callback, initialItem )
3Giá trị do cuộc gọi trước đó đến (accumulator, itemInArray, indexInArray, entireArray) => { /* do stuff */ }
1. Trong cuộc gọi đầu tiên, (accumulator, itemInArray, indexInArray, entireArray) => { /* do stuff */ }
7 nếu được chỉ định, nếu không thì giá trị của (accumulator, itemInArray, indexInArray, entireArray) => { /* do stuff */ }
8.(accumulator, itemInArray, indexInArray, entireArray) => { /* do stuff */ }
9Giá trị của phần tử hiện tại. Trong cuộc gọi đầu tiên, giá trị của (accumulator, itemInArray, indexInArray, entireArray) => { /* do stuff */ }
8 nếu (accumulator, itemInArray, indexInArray, entireArray) => { /* do stuff */ }
7 được chỉ định, nếu không thì giá trị của // Arrow function
reduce((accumulator, currentValue) => { /* … */ })
reduce((accumulator, currentValue, currentIndex) => { /* … */ })
reduce((accumulator, currentValue, currentIndex, array) => { /* … */ })
reduce((accumulator, currentValue) => { /* … */ }, initialValue)
reduce((accumulator, currentValue, currentIndex) => { /* … */ }, initialValue)
reduce((accumulator, currentValue, currentIndex, array) => { /* … */ }, initialValue)
// Callback function
reduce(callbackFn)
reduce(callbackFn, initialValue)
// Inline callback function
reduce(function (accumulator, currentValue) { /* … */ })
reduce(function (accumulator, currentValue, currentIndex) { /* … */ })
reduce(function (accumulator, currentValue, currentIndex, array) { /* … */ })
reduce(function (accumulator, currentValue) { /* … */ }, initialValue)
reduce(function (accumulator, currentValue, currentIndex) { /* … */ }, initialValue)
reduce(function (accumulator, currentValue, currentIndex, array) { /* … */ }, initialValue)
2.// Arrow function
reduce((accumulator, currentValue) => { /* … */ })
reduce((accumulator, currentValue, currentIndex) => { /* … */ })
reduce((accumulator, currentValue, currentIndex, array) => { /* … */ })
reduce((accumulator, currentValue) => { /* … */ }, initialValue)
reduce((accumulator, currentValue, currentIndex) => { /* … */ }, initialValue)
reduce((accumulator, currentValue, currentIndex, array) => { /* … */ }, initialValue)
// Callback function
reduce(callbackFn)
reduce(callbackFn, initialValue)
// Inline callback function
reduce(function (accumulator, currentValue) { /* … */ })
reduce(function (accumulator, currentValue, currentIndex) { /* … */ })
reduce(function (accumulator, currentValue, currentIndex, array) { /* … */ })
reduce(function (accumulator, currentValue) { /* … */ }, initialValue)
reduce(function (accumulator, currentValue, currentIndex) { /* … */ }, initialValue)
reduce(function (accumulator, currentValue, currentIndex, array) { /* … */ }, initialValue)
3Vị trí chỉ số của (accumulator, itemInArray, indexInArray, entireArray) => { /* do stuff */ }
9 trong mảng. Trong cuộc gọi đầu tiên, // Arrow function
reduce((accumulator, currentValue) => { /* … */ })
reduce((accumulator, currentValue, currentIndex) => { /* … */ })
reduce((accumulator, currentValue, currentIndex, array) => { /* … */ })
reduce((accumulator, currentValue) => { /* … */ }, initialValue)
reduce((accumulator, currentValue, currentIndex) => { /* … */ }, initialValue)
reduce((accumulator, currentValue, currentIndex, array) => { /* … */ }, initialValue)
// Callback function
reduce(callbackFn)
reduce(callbackFn, initialValue)
// Inline callback function
reduce(function (accumulator, currentValue) { /* … */ })
reduce(function (accumulator, currentValue, currentIndex) { /* … */ })
reduce(function (accumulator, currentValue, currentIndex, array) { /* … */ })
reduce(function (accumulator, currentValue) { /* … */ }, initialValue)
reduce(function (accumulator, currentValue, currentIndex) { /* … */ }, initialValue)
reduce(function (accumulator, currentValue, currentIndex, array) { /* … */ }, initialValue)
5 nếu (accumulator, itemInArray, indexInArray, entireArray) => { /* do stuff */ }
7 được chỉ định, nếu không // Arrow function
reduce((accumulator, currentValue) => { /* … */ })
reduce((accumulator, currentValue, currentIndex) => { /* … */ })
reduce((accumulator, currentValue, currentIndex, array) => { /* … */ })
reduce((accumulator, currentValue) => { /* … */ }, initialValue)
reduce((accumulator, currentValue, currentIndex) => { /* … */ }, initialValue)
reduce((accumulator, currentValue, currentIndex, array) => { /* … */ }, initialValue)
// Callback function
reduce(callbackFn)
reduce(callbackFn, initialValue)
// Inline callback function
reduce(function (accumulator, currentValue) { /* … */ })
reduce(function (accumulator, currentValue, currentIndex) { /* … */ })
reduce(function (accumulator, currentValue, currentIndex, array) { /* … */ })
reduce(function (accumulator, currentValue) { /* … */ }, initialValue)
reduce(function (accumulator, currentValue, currentIndex) { /* … */ }, initialValue)
reduce(function (accumulator, currentValue, currentIndex, array) { /* … */ }, initialValue)
7.// Arrow function
reduce((accumulator, currentValue) => { /* … */ })
reduce((accumulator, currentValue, currentIndex) => { /* … */ })
reduce((accumulator, currentValue, currentIndex, array) => { /* … */ })
reduce((accumulator, currentValue) => { /* … */ }, initialValue)
reduce((accumulator, currentValue, currentIndex) => { /* … */ }, initialValue)
reduce((accumulator, currentValue, currentIndex, array) => { /* … */ }, initialValue)
// Callback function
reduce(callbackFn)
reduce(callbackFn, initialValue)
// Inline callback function
reduce(function (accumulator, currentValue) { /* … */ })
reduce(function (accumulator, currentValue, currentIndex) { /* … */ })
reduce(function (accumulator, currentValue, currentIndex, array) { /* … */ })
reduce(function (accumulator, currentValue) { /* … */ }, initialValue)
reduce(function (accumulator, currentValue, currentIndex) { /* … */ }, initialValue)
reduce(function (accumulator, currentValue, currentIndex, array) { /* … */ }, initialValue)
8Mảng Array.prototype.reduce( callback, initialItem )
9 đã được kêu gọi.(accumulator, itemInArray, indexInArray, entireArray) => { /* do stuff */ }
7 Tùy chọnOptional Một giá trị mà Array.prototype.reduce( callback, initialItem )
3 được khởi tạo ngay lần đầu tiên gọi lại. Nếu (accumulator, itemInArray, indexInArray, entireArray) => { /* do stuff */ }
7 được chỉ định, điều đó cũng khiến (accumulator, itemInArray, indexInArray, entireArray) => { /* do stuff */ }
9 được khởi tạo thành giá trị đầu tiên trong mảng. Nếu (accumulator, itemInArray, indexInArray, entireArray) => { /* do stuff */ }
7 không được chỉ định, Array.prototype.reduce( callback, initialItem )
3 được khởi tạo thành giá trị thứ nhất trong mảng và (accumulator, itemInArray, indexInArray, entireArray) => { /* do stuff */ }
9 được khởi tạo thành giá trị thứ hai trong mảng.Giá trị trả vềGiá trị kết quả từ việc chạy chức năng gọi lại "giảm" để hoàn thành toàn bộ mảng. Ngoại lệconst getMax = (a, b) => Math.max(a, b);
// callback is invoked for each element in the array starting at index 0
[1, 100].reduce(getMax, 50); // 100
[50].reduce(getMax, 10); // 50
// callback is invoked once for element at index 1
[1, 100].reduce(getMax); // 100
// callback is not invoked
[50].reduce(getMax); // 50
[].reduce(getMax, 1); // 1
[].reduce(getMax); // TypeError
7Mảng không chứa các phần tử và (accumulator, itemInArray, indexInArray, entireArray) => { /* do stuff */ }
7 không được cung cấp.Sự mô tảPhương pháp Array.prototype.reduce( callback, initialItem )
9 là một phương pháp lặp. Nó chạy chức năng gọi lại "bộ giảm thiểu" trên tất cả các phần tử trong mảng, theo thứ tự chỉ số tăng dần và tích lũy chúng thành một giá trị duy nhất. Mỗi lần, giá trị trả lại của (accumulator, itemInArray, indexInArray, entireArray) => { /* do stuff */ }
1 được chuyển vào (accumulator, itemInArray, indexInArray, entireArray) => { /* do stuff */ }
1 một lần nữa trong lần gọi tiếp theo là Array.prototype.reduce( callback, initialItem )
3. Giá trị cuối cùng của Array.prototype.reduce( callback, initialItem )
3 (là giá trị được trả về từ (accumulator, itemInArray, indexInArray, entireArray) => { /* do stuff */ }
1 trên lần lặp cuối cùng của mảng) trở thành giá trị trả về của Array.prototype.reduce( callback, initialItem )
9.(accumulator, itemInArray, indexInArray, entireArray) => { /* do stuff */ }
1 chỉ được gọi cho các chỉ mục mảng đã gán các giá trị. Nó không được gọi cho các khe trống trong các mảng thưa thớt.Không giống như các phương thức lặp khác, Array.prototype.reduce( callback, initialItem )
9 không chấp nhận đối số const array = [15, 16, 17, 18, 19];
function reducer(accumulator, currentValue, index) {
const returns = accumulator + currentValue;
console.log(
`accumulator: ${accumulator}, currentValue: ${currentValue}, index: ${index}, returns: ${returns}`,
);
return returns;
}
array.reduce(reducer);
8. (accumulator, itemInArray, indexInArray, entireArray) => { /* do stuff */ }
1 luôn được gọi với [15, 16, 17, 18, 19].reduce(
(accumulator, currentValue) => accumulator + currentValue,
10,
);
0 là [15, 16, 17, 18, 19].reduce(
(accumulator, currentValue) => accumulator + currentValue,
10,
);
1, được thay thế bằng [15, 16, 17, 18, 19].reduce(
(accumulator, currentValue) => accumulator + currentValue,
10,
);
2 nếu (accumulator, itemInArray, indexInArray, entireArray) => { /* do stuff */ }
1 không nghiêm ngặt.Array.prototype.reduce( callback, initialItem )
9 là một khái niệm trung tâm trong lập trình chức năng, trong đó không thể thay đổi bất kỳ giá trị nào, do đó, để tích lũy tất cả các giá trị trong một mảng, người ta phải trả về giá trị tích lũy mới trên mỗi lần lặp. Công ước này tuyên truyền đến Array.prototype.reduce( callback, initialItem )
9 của JavaScript: Bạn nên sử dụng các phương thức sao chép hoặc sao chép khác khi có thể tạo các mảng và đối tượng mới làm bộ tích lũy, thay vì biến đổi phương thức hiện có. Nếu bạn quyết định đột biến bộ tích lũy thay vì sao chép nó, hãy nhớ vẫn trả về đối tượng đã sửa đổi trong cuộc gọi lại hoặc lần lặp tiếp theo sẽ nhận được không xác định.Array.prototype.reduce( callback, initialItem )
9 không làm biến đổi mảng mà nó được gọi, nhưng chức năng được cung cấp như (accumulator, itemInArray, indexInArray, entireArray) => { /* do stuff */ }
1 có thể. Tuy nhiên, lưu ý rằng độ dài của mảng được lưu trước khi gọi đầu tiên của (accumulator, itemInArray, indexInArray, entireArray) => { /* do stuff */ }
1. Vì vậy:(accumulator, itemInArray, indexInArray, entireArray) => { /* do stuff */ }
1 sẽ không truy cập bất kỳ yếu tố nào được thêm vào ngoài độ dài ban đầu của mảng khi cuộc gọi đến Array.prototype.reduce( callback, initialItem )
9 bắt đầu.- Các thay đổi đối với các chỉ mục đã được truy cập không khiến
(accumulator, itemInArray, indexInArray, entireArray) => { /* do stuff */ }
1 được gọi lại trên chúng. - Nếu một phần tử hiện có, chưa được liên kết của mảng được thay đổi bởi
(accumulator, itemInArray, indexInArray, entireArray) => { /* do stuff */ }
1, giá trị của nó được chuyển cho (accumulator, itemInArray, indexInArray, entireArray) => { /* do stuff */ }
1 sẽ là giá trị tại thời điểm phần tử đó được truy cập. Các yếu tố bị xóa không được truy cập.
CẢNH BÁO: Sửa đổi đồng thời của loại được mô tả ở trên thường xuyên dẫn đến mã khó hiểu và thường được tránh (ngoại trừ trong các trường hợp đặc biệt). Concurrent modifications of the kind described above frequently lead to hard-to-understand code and are generally to be avoided (except in special cases). Phương pháp Array.prototype.reduce( callback, initialItem )
9 là chung chung. Nó chỉ mong đợi giá trị [15, 16, 17, 18, 19].reduce(
(accumulator, currentValue) => accumulator + currentValue,
10,
);
1 có thuộc tính const objects = [{ x: 1 }, { x: 2 }, { x: 3 }];
const sum = objects.reduce(
(accumulator, currentValue) => accumulator + currentValue.x,
0,
);
console.log(sum); // 6
6 và các thuộc tính được khóa.Khi nào không sử dụng giảm ()Các chức năng đệ quy như Array.prototype.reduce( callback, initialItem )
9 có thể mạnh mẽ nhưng đôi khi khó hiểu, đặc biệt là đối với các nhà phát triển JavaScript ít có kinh nghiệm. Nếu mã trở nên rõ ràng hơn khi sử dụng các phương thức mảng khác, các nhà phát triển phải cân nhắc sự đánh đổi khả năng đọc đối với các lợi ích khác của việc sử dụng Array.prototype.reduce( callback, initialItem )
9. Trong trường hợp Array.prototype.reduce( callback, initialItem )
9 là sự lựa chọn tốt nhất, tài liệu và đặt tên biến ngữ nghĩa có thể giúp giảm thiểu những hạn chế dễ đọc.Trường hợp cạnhNếu mảng chỉ có một phần tử (bất kể vị trí) và không được cung cấp (accumulator, itemInArray, indexInArray, entireArray) => { /* do stuff */ }
7 hoặc nếu (accumulator, itemInArray, indexInArray, entireArray) => { /* do stuff */ }
7 được cung cấp nhưng mảng trống, giá trị solo sẽ được trả về mà không gọi (accumulator, itemInArray, indexInArray, entireArray) => { /* do stuff */ }
1.Nếu (accumulator, itemInArray, indexInArray, entireArray) => { /* do stuff */ }
7 được cung cấp và mảng không trống, thì phương thức giảm sẽ luôn gọi chức năng gọi lại bắt đầu từ INDEX 0.Nếu (accumulator, itemInArray, indexInArray, entireArray) => { /* do stuff */ }
7 không được cung cấp thì phương pháp giảm sẽ hoạt động khác nhau cho các mảng có chiều dài lớn hơn 1, bằng 1 và 0, như được hiển thị trong ví dụ sau:const getMax = (a, b) => Math.max(a, b);
// callback is invoked for each element in the array starting at index 0
[1, 100].reduce(getMax, 50); // 100
[50].reduce(getMax, 10); // 50
// callback is invoked once for element at index 1
[1, 100].reduce(getMax); // 100
// callback is not invoked
[50].reduce(getMax); // 50
[].reduce(getMax, 1); // 1
[].reduce(getMax); // TypeError
Làm thế nào giảm () hoạt động mà không có giá trị ban đầuMã dưới đây cho thấy những gì xảy ra nếu chúng ta gọi Array.prototype.reduce( callback, initialItem )
9 với một mảng và không có giá trị ban đầu.const array = [15, 16, 17, 18, 19];
function reducer(accumulator, currentValue, index) {
const returns = accumulator + currentValue;
console.log(
`accumulator: ${accumulator}, currentValue: ${currentValue}, index: ${index}, returns: ${returns}`,
);
return returns;
}
array.reduce(reducer);
Cuộc gọi lại sẽ được gọi bốn lần, với các đối số và các giá trị trả về trong mỗi cuộc gọi như sau: Tham số // Arrow function
reduce((accumulator, currentValue) => { /* … */ })
reduce((accumulator, currentValue, currentIndex) => { /* … */ })
reduce((accumulator, currentValue, currentIndex, array) => { /* … */ })
reduce((accumulator, currentValue) => { /* … */ }, initialValue)
reduce((accumulator, currentValue, currentIndex) => { /* … */ }, initialValue)
reduce((accumulator, currentValue, currentIndex, array) => { /* … */ }, initialValue)
// Callback function
reduce(callbackFn)
reduce(callbackFn, initialValue)
// Inline callback function
reduce(function (accumulator, currentValue) { /* … */ })
reduce(function (accumulator, currentValue, currentIndex) { /* … */ })
reduce(function (accumulator, currentValue, currentIndex, array) { /* … */ })
reduce(function (accumulator, currentValue) { /* … */ }, initialValue)
reduce(function (accumulator, currentValue, currentIndex) { /* … */ }, initialValue)
reduce(function (accumulator, currentValue, currentIndex, array) { /* … */ }, initialValue)
8 không bao giờ thay đổi thông qua quy trình - nó luôn luôn là const badCallback = (a,i) => Object.assign(a,i)
const foo = [ { a: 1 }, { b: 2 }, { c: 3 } ]
const bar = foo.reduce( badCallback ) // bad use of Object.assign
// Look, we've tampered with the original array
foo // [ { a: 1, b: 2, c: 3 }, { b: 2 }, { c: 3 } ]
07. Giá trị được trả về bởi Array.prototype.reduce( callback, initialItem )
9 sẽ là của lệnh gọi gọi lại cuối cùng (const badCallback = (a,i) => Object.assign(a,i)
const foo = [ { a: 1 }, { b: 2 }, { c: 3 } ]
const bar = foo.reduce( badCallback ) // bad use of Object.assign
// Look, we've tampered with the original array
foo // [ { a: 1, b: 2, c: 3 }, { b: 2 }, { c: 3 } ]
09).Làm thế nào giảm () hoạt động với giá trị ban đầuỞ đây chúng tôi giảm cùng một mảng bằng cách sử dụng cùng một thuật toán, nhưng với (accumulator, itemInArray, indexInArray, entireArray) => { /* do stuff */ }
7 của const badCallback = (a,i) => Object.assign(a,i)
const foo = [ { a: 1 }, { b: 2 }, { c: 3 } ]
const bar = foo.reduce( badCallback ) // bad use of Object.assign
// Look, we've tampered with the original array
foo // [ { a: 1, b: 2, c: 3 }, { b: 2 }, { c: 3 } ]
11 được chuyển làm đối số thứ hai cho Array.prototype.reduce( callback, initialItem )
9:[15, 16, 17, 18, 19].reduce(
(accumulator, currentValue) => accumulator + currentValue,
10,
);
Cuộc gọi lại sẽ được gọi năm lần, với các đối số và các giá trị trả về trong mỗi cuộc gọi như sau: Giá trị được trả về bởi Array.prototype.reduce( callback, initialItem )
9 trong trường hợp này sẽ là const badCallback = (a,i) => Object.assign(a,i)
const foo = [ { a: 1 }, { b: 2 }, { c: 3 } ]
const bar = foo.reduce( badCallback ) // bad use of Object.assign
// Look, we've tampered with the original array
foo // [ { a: 1, b: 2, c: 3 }, { b: 2 }, { c: 3 } ]
14.Tổng các giá trị trong một mảng đối tượng Để tổng hợp các giá trị có trong một mảng các đối tượng, bạn phải cung cấp một (accumulator, itemInArray, indexInArray, entireArray) => { /* do stuff */ }
7, để mỗi mục đi qua chức năng của bạn.must supply an (accumulator, itemInArray, indexInArray, entireArray) => { /* do stuff */ }
7, so that each item passes through your function. const objects = [{ x: 1 }, { x: 2 }, { x: 3 }];
const sum = objects.reduce(
(accumulator, currentValue) => accumulator + currentValue.x,
0,
);
console.log(sum); // 6
Làm phẳng một mảng mảngconst badCallback = (a,i) => Object.assign(a,i)
const foo = [ { a: 1 }, { b: 2 }, { c: 3 } ]
const bar = foo.reduce( badCallback ) // bad use of Object.assign
// Look, we've tampered with the original array
foo // [ { a: 1, b: 2, c: 3 }, { b: 2 }, { c: 3 } ]
0Đếm các phiên bản của các giá trị trong một đối tượngconst badCallback = (a,i) => Object.assign(a,i)
const foo = [ { a: 1 }, { b: 2 }, { c: 3 } ]
const bar = foo.reduce( badCallback ) // bad use of Object.assign
// Look, we've tampered with the original array
foo // [ { a: 1, b: 2, c: 3 }, { b: 2 }, { c: 3 } ]
1Nhóm đối tượng bởi một tài sảnconst badCallback = (a,i) => Object.assign(a,i)
const foo = [ { a: 1 }, { b: 2 }, { c: 3 } ]
const bar = foo.reduce( badCallback ) // bad use of Object.assign
// Look, we've tampered with the original array
foo // [ { a: 1, b: 2, c: 3 }, { b: 2 }, { c: 3 } ]
2Các mảng kết nối có trong một mảng các đối tượng bằng cách sử dụng cú pháp lan truyền và initValueconst badCallback = (a,i) => Object.assign(a,i)
const foo = [ { a: 1 }, { b: 2 }, { c: 3 } ]
const bar = foo.reduce( badCallback ) // bad use of Object.assign
// Look, we've tampered with the original array
foo // [ { a: 1, b: 2, c: 3 }, { b: 2 }, { c: 3 } ]
3Xóa các mục trùng lặp trong một mảngLưu ý: Hiệu ứng tương tự có thể đạt được với const badCallback = (a,i) => Object.assign(a,i)
const foo = [ { a: 1 }, { b: 2 }, { c: 3 } ]
const bar = foo.reduce( badCallback ) // bad use of Object.assign
// Look, we've tampered with the original array
foo // [ { a: 1, b: 2, c: 3 }, { b: 2 }, { c: 3 } ]
16 và const badCallback = (a,i) => Object.assign(a,i)
const foo = [ { a: 1 }, { b: 2 }, { c: 3 } ]
const bar = foo.reduce( badCallback ) // bad use of Object.assign
// Look, we've tampered with the original array
foo // [ { a: 1, b: 2, c: 3 }, { b: 2 }, { c: 3 } ]
17 là const badCallback = (a,i) => Object.assign(a,i)
const foo = [ { a: 1 }, { b: 2 }, { c: 3 } ]
const bar = foo.reduce( badCallback ) // bad use of Object.assign
// Look, we've tampered with the original array
foo // [ { a: 1, b: 2, c: 3 }, { b: 2 }, { c: 3 } ]
18 với hiệu suất tốt hơn. The same effect can be achieved with
const badCallback = (a,i) => Object.assign(a,i)
const foo = [ { a: 1 }, { b: 2 }, { c: 3 } ]
const bar = foo.reduce( badCallback ) // bad use of Object.assign
// Look, we've tampered with the original array
foo // [ { a: 1, b: 2, c: 3 }, { b: 2 }, { c: 3 } ]
16 and const badCallback = (a,i) => Object.assign(a,i)
const foo = [ { a: 1 }, { b: 2 }, { c: 3 } ]
const bar = foo.reduce( badCallback ) // bad use of Object.assign
// Look, we've tampered with the original array
foo // [ { a: 1, b: 2, c: 3 }, { b: 2 }, { c: 3 } ]
17 as const badCallback = (a,i) => Object.assign(a,i)
const foo = [ { a: 1 }, { b: 2 }, { c: 3 } ]
const bar = foo.reduce( badCallback ) // bad use of Object.assign
// Look, we've tampered with the original array
foo // [ { a: 1, b: 2, c: 3 }, { b: 2 }, { c: 3 } ]
18 with better performance.const badCallback = (a,i) => Object.assign(a,i)
const foo = [ { a: 1 }, { b: 2 }, { c: 3 } ]
const bar = foo.reduce( badCallback ) // bad use of Object.assign
// Look, we've tampered with the original array
foo // [ { a: 1, b: 2, c: 3 }, { b: 2 }, { c: 3 } ]
4Thay thế .filter (). Map () bằng .reduce () Sử dụng const badCallback = (a,i) => Object.assign(a,i)
const foo = [ { a: 1 }, { b: 2 }, { c: 3 } ]
const bar = foo.reduce( badCallback ) // bad use of Object.assign
// Look, we've tampered with the original array
foo // [ { a: 1, b: 2, c: 3 }, { b: 2 }, { c: 3 } ]
19 sau đó const badCallback = (a,i) => Object.assign(a,i)
const foo = [ { a: 1 }, { b: 2 }, { c: 3 } ]
const bar = foo.reduce( badCallback ) // bad use of Object.assign
// Look, we've tampered with the original array
foo // [ { a: 1, b: 2, c: 3 }, { b: 2 }, { c: 3 } ]
20 đi qua mảng hai lần, nhưng bạn có thể đạt được hiệu ứng tương tự trong khi chỉ đi qua một lần với Array.prototype.reduce( callback, initialItem )
9, do đó hiệu quả hơn. (Nếu bạn thích các vòng const badCallback = (a,i) => Object.assign(a,i)
const foo = [ { a: 1 }, { b: 2 }, { c: 3 } ]
const bar = foo.reduce( badCallback ) // bad use of Object.assign
// Look, we've tampered with the original array
foo // [ { a: 1, b: 2, c: 3 }, { b: 2 }, { c: 3 } ]
22, bạn có thể lọc và ánh xạ trong khi đi qua một lần với const badCallback = (a,i) => Object.assign(a,i)
const foo = [ { a: 1 }, { b: 2 }, { c: 3 } ]
const bar = foo.reduce( badCallback ) // bad use of Object.assign
// Look, we've tampered with the original array
foo // [ { a: 1, b: 2, c: 3 }, { b: 2 }, { c: 3 } ]
23.)const badCallback = (a,i) => Object.assign(a,i)
const foo = [ { a: 1 }, { b: 2 }, { c: 3 } ]
const bar = foo.reduce( badCallback ) // bad use of Object.assign
// Look, we've tampered with the original array
foo // [ { a: 1, b: 2, c: 3 }, { b: 2 }, { c: 3 } ]
5Chạy những lời hứa theo trình tựconst badCallback = (a,i) => Object.assign(a,i)
const foo = [ { a: 1 }, { b: 2 }, { c: 3 } ]
const bar = foo.reduce( badCallback ) // bad use of Object.assign
// Look, we've tampered with the original array
foo // [ { a: 1, b: 2, c: 3 }, { b: 2 }, { c: 3 } ]
6Thành phần chức năng cho phép đường ốngconst badCallback = (a,i) => Object.assign(a,i)
const foo = [ { a: 1 }, { b: 2 }, { c: 3 } ]
const bar = foo.reduce( badCallback ) // bad use of Object.assign
// Look, we've tampered with the original array
foo // [ { a: 1, b: 2, c: 3 }, { b: 2 }, { c: 3 } ]
7Sử dụng giảm () với các mảng thưa thớtArray.prototype.reduce( callback, initialItem )
9 bỏ qua các phần tử bị thiếu trong các mảng thưa thớt, nhưng nó không bỏ qua các giá trị [15, 16, 17, 18, 19].reduce(
(accumulator, currentValue) => accumulator + currentValue,
10,
);
0.const badCallback = (a,i) => Object.assign(a,i)
const foo = [ { a: 1 }, { b: 2 }, { c: 3 } ]
const bar = foo.reduce( badCallback ) // bad use of Object.assign
// Look, we've tampered with the original array
foo // [ { a: 1, b: 2, c: 3 }, { b: 2 }, { c: 3 } ]
8Gọi giảm () trên các đối tượng không phải làPhương thức Array.prototype.reduce( callback, initialItem )
9 đọc thuộc tính const objects = [{ x: 1 }, { x: 2 }, { x: 3 }];
const sum = objects.reduce(
(accumulator, currentValue) => accumulator + currentValue.x,
0,
);
console.log(sum); // 6
6 của [15, 16, 17, 18, 19].reduce(
(accumulator, currentValue) => accumulator + currentValue,
10,
);
1 và sau đó truy cập vào từng chỉ mục số nguyên.const badCallback = (a,i) => Object.assign(a,i)
const foo = [ { a: 1 }, { b: 2 }, { c: 3 } ]
const bar = foo.reduce( badCallback ) // bad use of Object.assign
// Look, we've tampered with the original array
foo // [ { a: 1, b: 2, c: 3 }, { b: 2 }, { c: 3 } ]
9Thông số kỹ thuật
| Sự chỉ rõ |
|---|
Đặc tả ngôn ngữ Ecmascript # sec-array.prototype.reduce
# sec-array.prototype.reduce
|
Tính tương thích của trình duyệt webBảng BCD chỉ tải trong trình duyệt
Bạn có thể sử dụng giảm trên một javascript đối tượng không?
Nhưng bạn có biết bạn cũng có thể giảm chúng thành các đối tượng không?Đầu tiên, một cái nhìn tổng quan nhanh về cách giảm hoạt động.Phương pháp giảm nhận được hai đối số: một hàm và giá trị ban đầu.Hàm sẽ chạy cho mọi giá trị trong mảng và cũng nhận được hai đối số: bộ tích lũy hoặc ACC và giá trị hiện tại.you can reduce them to objects as well? First, a quick overview of how reduce works. The reduce method receives two arguments: a function and an initial value. The function will run run for every value in the array, and receives two arguments as well: the accumulator, or acc , and the current value .
Làm thế nào bạn có thể nhân đôi các phần tử của một mảng bằng cách sử dụng giảm trong JavaScript?
var c = a.reduce ((acc, b) => {acc = b*2; console.log (acc); return acc}, []);JavaScript. reduce( (acc,b) => { acc =b*2; console. log(acc); return acc },[]); javascript.
Phương pháp giảm mảng trong JavaScript là gì?
Phương thức giảm () thực thi chức năng gọi lại "giảm" do người dùng cung cấp trên mỗi phần tử của mảng, theo thứ tự, chuyển giá trị trả về từ tính toán trên phần tử trước.Kết quả cuối cùng của việc chạy bộ giảm tốc trên tất cả các phần tử của mảng là một giá trị duy nhất.executes a user-supplied "reducer" callback function on each element of the array, in order, passing in the return value from the calculation on the preceding element. The final result of running the reducer across all elements of the array is a single value. |
