Hướng dẫn can you use reduce on an object javascript? - bạn có thể sử dụng giảm trên một đối tượng javascript không?

Question

Hãy để tôi tóm tắt các khả năng. Mục đích là luôn luôn tạo ra một mảng ra khỏi đối tượng. Có nhiều hàm đối tượng JavaScript khác nhau cho việc này. Đối với mỗi chức năng riêng lẻ, có nhiều cách khác nhau để giải thích nó. Vì vậy, nó luôn phụ thuộc vào đối tượng của chúng ta trông như thế nào và những gì chúng ta muốn làm.

Nội dung chính Show

Với object.keys
Với Object.value
Với Object.entries
Thông số
Giá trị trả về
Ngoại lệ
Sự mô tả
Khi nào không sử dụng giảm ()
Trường hợp cạnh
Làm thế nào giảm () hoạt động mà không có giá trị ban đầu
Làm thế nào giảm () hoạt động với giá trị ban đầu
Tổng các giá trị trong một mảng đối tượng
Làm phẳng một mảng mảng
Đếm các phiên bản của các giá trị trong một đối tượng
Nhóm đối tượng bởi một tài sản
Cá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à initValue
Xóa các mục trùng lặp trong một mảng
Thay thế .filter (). Map () bằng .reduce ()
Chạy những lời hứa theo trình tự
Thành phần chức năng cho phép đường ống
Sử dụng giảm () với các mảng thưa thớt
Gọi giảm () trên các đối tượng không phải là
Thông số kỹ thuật
Tính tương thích của trình duyệt web
Tôi có thể sử dụng giảm trong các đối tượng JavaScript không?
Giảm công việc trên đối tượng?
Tôi có thể sử dụng giảm trên một mảng các đối tượng không?
Đối tượng Giảm JavaScript là gì?

Trong ví dụ trên, nó là một đối tượng có ba đối tượng.

const obj = { 
    a: {value: 1}, 
    b: {value: 2}, 
    c: {value:3} 
};

Với object.keys

Object.keys chỉ cung cấp cho chúng ta các khóa của đối tượng.

const arr = Object.keys(obj);
// output arr: 
[a, b, c]

const result = arr.reduce((total, key) => {
    return sum + obj[key].value;
}, 0);
// output result
// 6

Với Object.value

Object.value () trả về mỗi giá trị duy nhất trong một mảng.

const arr = Object.value(obj);
// output arr
[
   {value: 1},
   {value: 2},
   {value: 3},
]

const result = arr.reduce((total, singleValue) => {
   return total + singleValue.value;
}, 0);

// output result
// 6

// Or the short variant
const resultShort = Object.values(obj).reduce((t, n) => t + n.value, 0)

// output resultShort
// 6

Với Object.entries

Object.entries chia mỗi giá trị đối tượng riêng lẻ thành một mảng.

const arr = Object.entries(obj)
// output arr
[
  ["a", {visitors: 1}],
  ["b", {visitors: 2}],
  ["c", {visitors: 4}]
]

const result = arr.reduce((total, singleArr) => {
  return total + singleArr[1].value;
}, 0);

// output result
// 6

Việc bạn làm điều đó với giảm hoặc với hàm mảng () tùy thuộc vào bạn và những gì bạn muốn làm.

Phương thức

const arr = Object.keys(obj);
// output arr: 
[a, b, c]

const result = arr.reduce((total, key) => {
    return sum + obj[key].value;
}, 0);
// output result
// 6

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.
const arr = Object.keys(obj); // output arr: [a, b, c] const result = arr.reduce((total, key) => { return sum + obj[key].value; }, 0); // output result // 6
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

const arr = Object.keys(obj);
// output arr: 
[a, b, c]

const result = arr.reduce((total, key) => {
    return sum + obj[key].value;
}, 0);
// output result
// 6

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ố

const arr = Object.value(obj);
// output arr
[
   {value: 1},
   {value: 2},
   {value: 3},
]

const result = arr.reduce((total, singleValue) => {
   return total + singleValue.value;
}, 0);

// output result
// 6

// Or the short variant
const resultShort = Object.values(obj).reduce((t, n) => t + n.value, 0)

// output resultShort
// 6

1

Mộ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ố

const arr = Object.value(obj);
// output arr
[
   {value: 1},
   {value: 2},
   {value: 3},
]

const result = arr.reduce((total, singleValue) => {
   return total + singleValue.value;
}, 0);

// output result
// 6

// Or the short variant
const resultShort = Object.values(obj).reduce((t, n) => t + n.value, 0)

// output resultShort
// 6

2 trong lần gọi tiếp theo của

const arr = Object.value(obj);
// output arr
[
   {value: 1},
   {value: 2},
   {value: 3},
]

const result = arr.reduce((total, singleValue) => {
   return total + singleValue.value;
}, 0);

// output result
// 6

// Or the short variant
const resultShort = Object.values(obj).reduce((t, n) => t + n.value, 0)

// output resultShort
// 6

1. Đối với lần gọi cuối cùng, giá trị trả về trở thành giá trị trả về của

const arr = Object.keys(obj);
// output arr: 
[a, b, c]

const result = arr.reduce((total, key) => {
    return sum + obj[key].value;
}, 0);
// output result
// 6

9.

Hàm được gọi với các đối số sau:

const arr = Object.value(obj);
// output arr
[
   {value: 1},
   {value: 2},
   {value: 3},
]

const result = arr.reduce((total, singleValue) => {
   return total + singleValue.value;
}, 0);

// output result
// 6

// Or the short variant
const resultShort = Object.values(obj).reduce((t, n) => t + n.value, 0)

// output resultShort
// 6

2

Giá trị do cuộc gọi trước đó đến

const arr = Object.value(obj);
// output arr
[
   {value: 1},
   {value: 2},
   {value: 3},
]

const result = arr.reduce((total, singleValue) => {
   return total + singleValue.value;
}, 0);

// output result
// 6

// Or the short variant
const resultShort = Object.values(obj).reduce((t, n) => t + n.value, 0)

// output resultShort
// 6

1. Trong cuộc gọi đầu tiên,

const arr = Object.value(obj);
// output arr
[
   {value: 1},
   {value: 2},
   {value: 3},
]

const result = arr.reduce((total, singleValue) => {
   return total + singleValue.value;
}, 0);

// output result
// 6

// Or the short variant
const resultShort = Object.values(obj).reduce((t, n) => t + n.value, 0)

// output resultShort
// 6

7 nếu được chỉ định, nếu không thì giá trị của

const arr = Object.value(obj);
// output arr
[
   {value: 1},
   {value: 2},
   {value: 3},
]

const result = arr.reduce((total, singleValue) => {
   return total + singleValue.value;
}, 0);

// output result
// 6

// Or the short variant
const resultShort = Object.values(obj).reduce((t, n) => t + n.value, 0)

// output resultShort
// 6

8.

const arr = Object.value(obj);
// output arr
[
   {value: 1},
   {value: 2},
   {value: 3},
]

const result = arr.reduce((total, singleValue) => {
   return total + singleValue.value;
}, 0);

// output result
// 6

// Or the short variant
const resultShort = Object.values(obj).reduce((t, n) => t + n.value, 0)

// output resultShort
// 6

9

Giá trị của phần tử hiện tại. Trong cuộc gọi đầu tiên, giá trị của

const arr = Object.value(obj);
// output arr
[
   {value: 1},
   {value: 2},
   {value: 3},
]

const result = arr.reduce((total, singleValue) => {
   return total + singleValue.value;
}, 0);

// output result
// 6

// Or the short variant
const resultShort = Object.values(obj).reduce((t, n) => t + n.value, 0)

// output resultShort
// 6

8 nếu

const arr = Object.value(obj);
// output arr
[
   {value: 1},
   {value: 2},
   {value: 3},
]

const result = arr.reduce((total, singleValue) => {
   return total + singleValue.value;
}, 0);

// output result
// 6

// Or the short variant
const resultShort = Object.values(obj).reduce((t, n) => t + n.value, 0)

// output resultShort
// 6

7 được chỉ định, nếu không thì giá trị của

const arr = Object.entries(obj)
// output arr
[
  ["a", {visitors: 1}],
  ["b", {visitors: 2}],
  ["c", {visitors: 4}]
]

const result = arr.reduce((total, singleArr) => {
  return total + singleArr[1].value;
}, 0);

// output result
// 6

2.

const arr = Object.entries(obj)
// output arr
[
  ["a", {visitors: 1}],
  ["b", {visitors: 2}],
  ["c", {visitors: 4}]
]

const result = arr.reduce((total, singleArr) => {
  return total + singleArr[1].value;
}, 0);

// output result
// 6

3

Vị trí chỉ số của

const arr = Object.value(obj);
// output arr
[
   {value: 1},
   {value: 2},
   {value: 3},
]

const result = arr.reduce((total, singleValue) => {
   return total + singleValue.value;
}, 0);

// output result
// 6

// Or the short variant
const resultShort = Object.values(obj).reduce((t, n) => t + n.value, 0)

// output resultShort
// 6

9 trong mảng. Trong cuộc gọi đầu tiên,

const arr = Object.entries(obj)
// output arr
[
  ["a", {visitors: 1}],
  ["b", {visitors: 2}],
  ["c", {visitors: 4}]
]

const result = arr.reduce((total, singleArr) => {
  return total + singleArr[1].value;
}, 0);

// output result
// 6

5 nếu

const arr = Object.value(obj);
// output arr
[
   {value: 1},
   {value: 2},
   {value: 3},
]

const result = arr.reduce((total, singleValue) => {
   return total + singleValue.value;
}, 0);

// output result
// 6

// Or the short variant
const resultShort = Object.values(obj).reduce((t, n) => t + n.value, 0)

// output resultShort
// 6

7 được chỉ định, nếu không

const arr = Object.entries(obj)
// output arr
[
  ["a", {visitors: 1}],
  ["b", {visitors: 2}],
  ["c", {visitors: 4}]
]

const result = arr.reduce((total, singleArr) => {
  return total + singleArr[1].value;
}, 0);

// output result
// 6

7.

const arr = Object.entries(obj)
// output arr
[
  ["a", {visitors: 1}],
  ["b", {visitors: 2}],
  ["c", {visitors: 4}]
]

const result = arr.reduce((total, singleArr) => {
  return total + singleArr[1].value;
}, 0);

// output result
// 6

8

Mảng

const arr = Object.keys(obj);
// output arr: 
[a, b, c]

const result = arr.reduce((total, key) => {
    return sum + obj[key].value;
}, 0);
// output result
// 6

9 đã được kêu gọi.

const arr = Object.value(obj);
// output arr
[
   {value: 1},
   {value: 2},
   {value: 3},
]

const result = arr.reduce((total, singleValue) => {
   return total + singleValue.value;
}, 0);

// output result
// 6

// Or the short variant
const resultShort = Object.values(obj).reduce((t, n) => t + n.value, 0)

// output resultShort
// 6

7 Tùy chọnOptional

Một giá trị mà

const arr = Object.value(obj);
// output arr
[
   {value: 1},
   {value: 2},
   {value: 3},
]

const result = arr.reduce((total, singleValue) => {
   return total + singleValue.value;
}, 0);

// output result
// 6

// Or the short variant
const resultShort = Object.values(obj).reduce((t, n) => t + n.value, 0)

// output resultShort
// 6

2 được khởi tạo ngay lần đầu tiên gọi lại. Nếu

const arr = Object.value(obj);
// output arr
[
   {value: 1},
   {value: 2},
   {value: 3},
]

const result = arr.reduce((total, singleValue) => {
   return total + singleValue.value;
}, 0);

// output result
// 6

// Or the short variant
const resultShort = Object.values(obj).reduce((t, n) => t + n.value, 0)

// output resultShort
// 6

7 được chỉ định, điều đó cũng khiến

const arr = Object.value(obj);
// output arr
[
   {value: 1},
   {value: 2},
   {value: 3},
]

const result = arr.reduce((total, singleValue) => {
   return total + singleValue.value;
}, 0);

// output result
// 6

// Or the short variant
const resultShort = Object.values(obj).reduce((t, n) => t + n.value, 0)

// output resultShort
// 6

9 được khởi tạo thành giá trị đầu tiên trong mảng. Nếu

const arr = Object.value(obj);
// output arr
[
   {value: 1},
   {value: 2},
   {value: 3},
]

const result = arr.reduce((total, singleValue) => {
   return total + singleValue.value;
}, 0);

// output result
// 6

// Or the short variant
const resultShort = Object.values(obj).reduce((t, n) => t + n.value, 0)

// output resultShort
// 6

7 không được chỉ định,

const arr = Object.value(obj);
// output arr
[
   {value: 1},
   {value: 2},
   {value: 3},
]

const result = arr.reduce((total, singleValue) => {
   return total + singleValue.value;
}, 0);

// output result
// 6

// Or the short variant
const resultShort = Object.values(obj).reduce((t, n) => t + n.value, 0)

// output resultShort
// 6

2 được khởi tạo thành giá trị thứ nhất trong mảng và

const arr = Object.value(obj);
// output arr
[
   {value: 1},
   {value: 2},
   {value: 3},
]

const result = arr.reduce((total, singleValue) => {
   return total + singleValue.value;
}, 0);

// output result
// 6

// Or the short variant
const resultShort = Object.values(obj).reduce((t, n) => t + n.value, 0)

// output resultShort
// 6

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ệ

// 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

Mảng không chứa các phần tử và

const arr = Object.value(obj);
// output arr
[
   {value: 1},
   {value: 2},
   {value: 3},
]

const result = arr.reduce((total, singleValue) => {
   return total + singleValue.value;
}, 0);

// output result
// 6

// Or the short variant
const resultShort = Object.values(obj).reduce((t, n) => t + n.value, 0)

// output resultShort
// 6

7 không được cung cấp.

Sự mô tả

Phương pháp

const arr = Object.keys(obj);
// output arr: 
[a, b, c]

const result = arr.reduce((total, key) => {
    return sum + obj[key].value;
}, 0);
// output result
// 6

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

const arr = Object.value(obj);
// output arr
[
   {value: 1},
   {value: 2},
   {value: 3},
]

const result = arr.reduce((total, singleValue) => {
   return total + singleValue.value;
}, 0);

// output result
// 6

// Or the short variant
const resultShort = Object.values(obj).reduce((t, n) => t + n.value, 0)

// output resultShort
// 6

1 được chuyển thành

const arr = Object.value(obj);
// output arr
[
   {value: 1},
   {value: 2},
   {value: 3},
]

const result = arr.reduce((total, singleValue) => {
   return total + singleValue.value;
}, 0);

// output result
// 6

// Or the short variant
const resultShort = Object.values(obj).reduce((t, n) => t + n.value, 0)

// output resultShort
// 6

1 một lần nữa trong lời cầu khẩn tiếp theo là

const arr = Object.value(obj);
// output arr
[
   {value: 1},
   {value: 2},
   {value: 3},
]

const result = arr.reduce((total, singleValue) => {
   return total + singleValue.value;
}, 0);

// output result
// 6

// Or the short variant
const resultShort = Object.values(obj).reduce((t, n) => t + n.value, 0)

// output resultShort
// 6

2. Giá trị cuối cùng của

const arr = Object.value(obj);
// output arr
[
   {value: 1},
   {value: 2},
   {value: 3},
]

const result = arr.reduce((total, singleValue) => {
   return total + singleValue.value;
}, 0);

// output result
// 6

// Or the short variant
const resultShort = Object.values(obj).reduce((t, n) => t + n.value, 0)

// output resultShort
// 6

2 (là giá trị được trả về từ

const arr = Object.value(obj);
// output arr
[
   {value: 1},
   {value: 2},
   {value: 3},
]

const result = arr.reduce((total, singleValue) => {
   return total + singleValue.value;
}, 0);

// output result
// 6

// Or the short variant
const resultShort = Object.values(obj).reduce((t, n) => t + n.value, 0)

// output resultShort
// 6

1 trên lần lặp cuối cùng của mảng) trở thành giá trị trả về của

const arr = Object.keys(obj);
// output arr: 
[a, b, c]

const result = arr.reduce((total, key) => {
    return sum + obj[key].value;
}, 0);
// output result
// 6

9.

const arr = Object.value(obj);
// output arr
[
   {value: 1},
   {value: 2},
   {value: 3},
]

const result = arr.reduce((total, singleValue) => {
   return total + singleValue.value;
}, 0);

// output result
// 6

// Or the short variant
const resultShort = Object.values(obj).reduce((t, n) => t + n.value, 0)

// output resultShort
// 6

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,

const arr = Object.keys(obj);
// output arr: 
[a, b, c]

const result = arr.reduce((total, key) => {
    return sum + obj[key].value;
}, 0);
// output result
// 6

9 không chấp nhận đối số

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

8.

const arr = Object.value(obj);
// output arr
[
   {value: 1},
   {value: 2},
   {value: 3},
]

const result = arr.reduce((total, singleValue) => {
   return total + singleValue.value;
}, 0);

// output result
// 6

// Or the short variant
const resultShort = Object.values(obj).reduce((t, n) => t + n.value, 0)

// output resultShort
// 6

1 luôn được gọi với

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);

0 là

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);

1, được thay thế bằng

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);

2 nếu

const arr = Object.value(obj);
// output arr
[
   {value: 1},
   {value: 2},
   {value: 3},
]

const result = arr.reduce((total, singleValue) => {
   return total + singleValue.value;
}, 0);

// output result
// 6

// Or the short variant
const resultShort = Object.values(obj).reduce((t, n) => t + n.value, 0)

// output resultShort
// 6

1 không nghiêm ngặt.

const arr = Object.keys(obj);
// output arr: 
[a, b, c]

const result = arr.reduce((total, key) => {
    return sum + obj[key].value;
}, 0);
// output result
// 6

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

const arr = Object.keys(obj);
// output arr: 
[a, b, c]

const result = arr.reduce((total, key) => {
    return sum + obj[key].value;
}, 0);
// output result
// 6

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.

const arr = Object.keys(obj);
// output arr: 
[a, b, c]

const result = arr.reduce((total, key) => {
    return sum + obj[key].value;
}, 0);
// output result
// 6

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ư

const arr = Object.value(obj);
// output arr
[
   {value: 1},
   {value: 2},
   {value: 3},
]

const result = arr.reduce((total, singleValue) => {
   return total + singleValue.value;
}, 0);

// output result
// 6

// Or the short variant
const resultShort = Object.values(obj).reduce((t, n) => t + n.value, 0)

// output resultShort
// 6

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

const arr = Object.value(obj);
// output arr
[
   {value: 1},
   {value: 2},
   {value: 3},
]

const result = arr.reduce((total, singleValue) => {
   return total + singleValue.value;
}, 0);

// output result
// 6

// Or the short variant
const resultShort = Object.values(obj).reduce((t, n) => t + n.value, 0)

// output resultShort
// 6

1. Vì vậy:

const arr = Object.value(obj);
// output arr
[
   {value: 1},
   {value: 2},
   {value: 3},
]

const result = arr.reduce((total, singleValue) => {
   return total + singleValue.value;
}, 0);

// output result
// 6

// Or the short variant
const resultShort = Object.values(obj).reduce((t, n) => t + n.value, 0)

// output resultShort
// 6

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

const arr = Object.keys(obj);
// output arr: 
[a, b, c]

const result = arr.reduce((total, key) => {
    return sum + obj[key].value;
}, 0);
// output result
// 6

9 bắt đầu.

Các thay đổi đối với các chỉ mục đã được truy cập không khiến

const arr = Object.value(obj);
// output arr
[
   {value: 1},
   {value: 2},
   {value: 3},
]

const result = arr.reduce((total, singleValue) => {
   return total + singleValue.value;
}, 0);

// output result
// 6

// Or the short variant
const resultShort = Object.values(obj).reduce((t, n) => t + n.value, 0)

// output resultShort
// 6

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

const arr = Object.value(obj);
// output arr
[
   {value: 1},
   {value: 2},
   {value: 3},
]

const result = arr.reduce((total, singleValue) => {
   return total + singleValue.value;
}, 0);

// output result
// 6

// Or the short variant
const resultShort = Object.values(obj).reduce((t, n) => t + n.value, 0)

// output resultShort
// 6

1, giá trị của nó được chuyển cho

const arr = Object.value(obj);
// output arr
[
   {value: 1},
   {value: 2},
   {value: 3},
]

const result = arr.reduce((total, singleValue) => {
   return total + singleValue.value;
}, 0);

// output result
// 6

// Or the short variant
const resultShort = Object.values(obj).reduce((t, n) => t + n.value, 0)

// output resultShort
// 6

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

const arr = Object.keys(obj);
// output arr: 
[a, b, c]

const result = arr.reduce((total, key) => {
    return sum + obj[key].value;
}, 0);
// output result
// 6

9 là chung chung. Nó chỉ mong đợi giá trị

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);

1 có thuộc tính

[15, 16, 17, 18, 19].reduce(
  (accumulator, currentValue) => accumulator + currentValue,
  10,
);

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ư

const arr = Object.keys(obj);
// output arr: 
[a, b, c]

const result = arr.reduce((total, key) => {
    return sum + obj[key].value;
}, 0);
// output result
// 6

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

const arr = Object.keys(obj);
// output arr: 
[a, b, c]

const result = arr.reduce((total, key) => {
    return sum + obj[key].value;
}, 0);
// output result
// 6

9. Trong trường hợp

const arr = Object.keys(obj);
// output arr: 
[a, b, c]

const result = arr.reduce((total, key) => {
    return sum + obj[key].value;
}, 0);
// output result
// 6

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ạnh

Nếu mảng chỉ có một phần tử (bất kể vị trí) và không được cung cấp

const arr = Object.value(obj);
// output arr
[
   {value: 1},
   {value: 2},
   {value: 3},
]

const result = arr.reduce((total, singleValue) => {
   return total + singleValue.value;
}, 0);

// output result
// 6

// Or the short variant
const resultShort = Object.values(obj).reduce((t, n) => t + n.value, 0)

// output resultShort
// 6

7 hoặc nếu

const arr = Object.value(obj);
// output arr
[
   {value: 1},
   {value: 2},
   {value: 3},
]

const result = arr.reduce((total, singleValue) => {
   return total + singleValue.value;
}, 0);

// output result
// 6

// Or the short variant
const resultShort = Object.values(obj).reduce((t, n) => t + n.value, 0)

// output resultShort
// 6

7 được cung cấp nhưng mảng trống, giá trị solo sẽ được trả về mà không gọi

const arr = Object.value(obj);
// output arr
[
   {value: 1},
   {value: 2},
   {value: 3},
]

const result = arr.reduce((total, singleValue) => {
   return total + singleValue.value;
}, 0);

// output result
// 6

// Or the short variant
const resultShort = Object.values(obj).reduce((t, n) => t + n.value, 0)

// output resultShort
// 6

1.

Nếu

const arr = Object.value(obj);
// output arr
[
   {value: 1},
   {value: 2},
   {value: 3},
]

const result = arr.reduce((total, singleValue) => {
   return total + singleValue.value;
}, 0);

// output result
// 6

// Or the short variant
const resultShort = Object.values(obj).reduce((t, n) => t + n.value, 0)

// output resultShort
// 6

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

const arr = Object.value(obj);
// output arr
[
   {value: 1},
   {value: 2},
   {value: 3},
]

const result = arr.reduce((total, singleValue) => {
   return total + singleValue.value;
}, 0);

// output result
// 6

// Or the short variant
const resultShort = Object.values(obj).reduce((t, n) => t + n.value, 0)

// output resultShort
// 6

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

Ví dụ

Làm thế nào giảm () hoạt động mà không có giá trị ban đầu

Mã dưới đây cho thấy những gì xảy ra nếu chúng ta gọi

const arr = Object.keys(obj);
// output arr: 
[a, b, c]

const result = arr.reduce((total, key) => {
    return sum + obj[key].value;
}, 0);
// output result
// 6

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ố

const arr = Object.entries(obj)
// output arr
[
  ["a", {visitors: 1}],
  ["b", {visitors: 2}],
  ["c", {visitors: 4}]
]

const result = arr.reduce((total, singleArr) => {
  return total + singleArr[1].value;
}, 0);

// output result
// 6

8 không bao giờ thay đổi trong quá trình - nó luôn luôn là

const objects = [{ x: 1 }, { x: 2 }, { x: 3 }];
const sum = objects.reduce(
  (accumulator, currentValue) => accumulator + currentValue.x,
  0,
);

console.log(sum); // 6

7. Giá trị được trả về bởi

const arr = Object.keys(obj);
// output arr: 
[a, b, c]

const result = arr.reduce((total, key) => {
    return sum + obj[key].value;
}, 0);
// output result
// 6

9 sẽ là của lệnh gọi gọi lại cuối cùng (

const objects = [{ x: 1 }, { x: 2 }, { x: 3 }];
const sum = objects.reduce(
  (accumulator, currentValue) => accumulator + currentValue.x,
  0,
);

console.log(sum); // 6

9).

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

const arr = Object.value(obj);
// output arr
[
   {value: 1},
   {value: 2},
   {value: 3},
]

const result = arr.reduce((total, singleValue) => {
   return total + singleValue.value;
}, 0);

// output result
// 6

// Or the short variant
const resultShort = Object.values(obj).reduce((t, n) => t + n.value, 0)

// output resultShort
// 6

7 của

const flattened = [
  [0, 1],
  [2, 3],
  [4, 5],
].reduce(
  (accumulator, currentValue) => accumulator.concat(currentValue),
  [],
);
// flattened is [0, 1, 2, 3, 4, 5]

1 được chuyển làm đối số thứ hai cho

const arr = Object.keys(obj);
// output arr: 
[a, b, c]

const result = arr.reduce((total, key) => {
    return sum + obj[key].value;
}, 0);
// output result
// 6

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

const arr = Object.keys(obj);
// output arr: 
[a, b, c]

const result = arr.reduce((total, key) => {
    return sum + obj[key].value;
}, 0);
// output result
// 6

9 trong trường hợp này sẽ là

const flattened = [
  [0, 1],
  [2, 3],
  [4, 5],
].reduce(
  (accumulator, currentValue) => accumulator.concat(currentValue),
  [],
);
// flattened is [0, 1, 2, 3, 4, 5]

4.

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

const arr = Object.value(obj);
// output arr
[
   {value: 1},
   {value: 2},
   {value: 3},
]

const result = arr.reduce((total, singleValue) => {
   return total + singleValue.value;
}, 0);

// output result
// 6

// Or the short variant
const resultShort = Object.values(obj).reduce((t, n) => t + n.value, 0)

// output resultShort
// 6

7, để mỗi mục đi qua chức năng của bạn.must supply an

const arr = Object.value(obj);
// output arr
[
   {value: 1},
   {value: 2},
   {value: 3},
]

const result = arr.reduce((total, singleValue) => {
   return total + singleValue.value;
}, 0);

// output result
// 6

// Or the short variant
const resultShort = Object.values(obj).reduce((t, n) => t + n.value, 0)

// output resultShort
// 6

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ảng

const flattened = [
  [0, 1],
  [2, 3],
  [4, 5],
].reduce(
  (accumulator, currentValue) => accumulator.concat(currentValue),
  [],
);
// flattened is [0, 1, 2, 3, 4, 5]

Đếm các phiên bản của các giá trị trong một đối tượng

const arr = Object.keys(obj);
// output arr: 
[a, b, c]

const result = arr.reduce((total, key) => {
    return sum + obj[key].value;
}, 0);
// output result
// 6

0

Nhóm đối tượng bởi một tài sản

const arr = Object.keys(obj);
// output arr: 
[a, b, c]

const result = arr.reduce((total, key) => {
    return sum + obj[key].value;
}, 0);
// output result
// 6

1

Cá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à initValue

const arr = Object.keys(obj);
// output arr: 
[a, b, c]

const result = arr.reduce((total, key) => {
    return sum + obj[key].value;
}, 0);
// output result
// 6

2

Xóa các mục trùng lặp trong một mảng

Lưu ý: Hiệu ứng tương tự có thể đạt được với

const flattened = [
  [0, 1],
  [2, 3],
  [4, 5],
].reduce(
  (accumulator, currentValue) => accumulator.concat(currentValue),
  [],
);
// flattened is [0, 1, 2, 3, 4, 5]

6 và
const flattened = [ [0, 1], [2, 3], [4, 5], ].reduce( (accumulator, currentValue) => accumulator.concat(currentValue), [], ); // flattened is [0, 1, 2, 3, 4, 5]
7 là
const flattened = [ [0, 1], [2, 3], [4, 5], ].reduce( (accumulator, currentValue) => accumulator.concat(currentValue), [], ); // flattened is [0, 1, 2, 3, 4, 5]
8 với hiệu suất tốt hơn. The same effect can be achieved with

const flattened = [
  [0, 1],
  [2, 3],
  [4, 5],
].reduce(
  (accumulator, currentValue) => accumulator.concat(currentValue),
  [],
);
// flattened is [0, 1, 2, 3, 4, 5]

6 and

const flattened = [
  [0, 1],
  [2, 3],
  [4, 5],
].reduce(
  (accumulator, currentValue) => accumulator.concat(currentValue),
  [],
);
// flattened is [0, 1, 2, 3, 4, 5]

7 as

const flattened = [
  [0, 1],
  [2, 3],
  [4, 5],
].reduce(
  (accumulator, currentValue) => accumulator.concat(currentValue),
  [],
);
// flattened is [0, 1, 2, 3, 4, 5]

8 with better performance.

const arr = Object.keys(obj);
// output arr: 
[a, b, c]

const result = arr.reduce((total, key) => {
    return sum + obj[key].value;
}, 0);
// output result
// 6

3

Thay thế .filter (). Map () bằng .reduce ()

Sử dụng

const flattened = [
  [0, 1],
  [2, 3],
  [4, 5],
].reduce(
  (accumulator, currentValue) => accumulator.concat(currentValue),
  [],
);
// flattened is [0, 1, 2, 3, 4, 5]

9 sau đó

const arr = Object.keys(obj);
// output arr: 
[a, b, c]

const result = arr.reduce((total, key) => {
    return sum + obj[key].value;
}, 0);
// output result
// 6

00 đ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

const arr = Object.keys(obj);
// output arr: 
[a, b, c]

const result = arr.reduce((total, key) => {
    return sum + obj[key].value;
}, 0);
// output result
// 6

9, do đó hiệu quả hơn. .

const arr = Object.keys(obj);
// output arr: 
[a, b, c]

const result = arr.reduce((total, key) => {
    return sum + obj[key].value;
}, 0);
// output result
// 6

4

Chạy những lời hứa theo trình tự

const arr = Object.keys(obj);
// output arr: 
[a, b, c]

const result = arr.reduce((total, key) => {
    return sum + obj[key].value;
}, 0);
// output result
// 6

5

Thành phần chức năng cho phép đường ống

const arr = Object.keys(obj);
// output arr: 
[a, b, c]

const result = arr.reduce((total, key) => {
    return sum + obj[key].value;
}, 0);
// output result
// 6

6

Sử dụng giảm () với các mảng thưa thớt

const arr = Object.keys(obj);
// output arr: 
[a, b, c]

const result = arr.reduce((total, key) => {
    return sum + obj[key].value;
}, 0);
// output result
// 6

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ị

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);

0.

const arr = Object.keys(obj);
// output arr: 
[a, b, c]

const result = arr.reduce((total, key) => {
    return sum + obj[key].value;
}, 0);
// output result
// 6

7

Gọi giảm () trên các đối tượng không phải là

Phương thức

const arr = Object.keys(obj);
// output arr: 
[a, b, c]

const result = arr.reduce((total, key) => {
    return sum + obj[key].value;
}, 0);
// output result
// 6

9 đọc thuộc tính

[15, 16, 17, 18, 19].reduce(
  (accumulator, currentValue) => accumulator + currentValue,
  10,
);

6 của

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);

1 và sau đó truy cập vào từng chỉ mục số nguyên.

const arr = Object.keys(obj);
// output arr: 
[a, b, c]

const result = arr.reduce((total, key) => {
    return sum + obj[key].value;
}, 0);
// output result
// 6

8

Thô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 web

Bảng BCD chỉ tải trong trình duyệt

Xem thêm

Tôi có thể sử dụng giảm trong các đối tượng JavaScript 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 .

Giảm công việc trên đối tượng?

Giảm cũng hoạt động khi làm việc với một loạt các đối tượng.Một điều cần lưu ý là khi có nhiều dòng mã, một câu lệnh trả lại là hoàn toàn cần thiết.Ví dụ dưới đây cho thấy bảng điều khiển tích lũy.Đăng nhập bên trong việc giảm gọi lại và ví dụ giảm đa dòng đầu tiên.. One thing to make note of is that when there is more than one line of code, a return statement is absolutely necessary. The example below shows the accumulator console. log inside the reduce callback and the first multi-line reduce example.

Tôi có thể sử dụng giảm trên một mảng các đối tượng không?

Nếu bạn sử dụng Array giảm trên một mảng mà không có bất kỳ phần tử nào và không cung cấp initValue, nó sẽ ném một kiểu.Nếu mảng trống và initValue được cung cấp hoặc mảng chỉ có một phần tử và initValue, phương thức giảm sẽ trả về cùng một giá trị mà không gọi CallbackFn.. If the array is empty and initialValue is provided, or the array has only one element and initialValue, the reduce method will return the same value without calling the callbackfn.

Đối tượng Giảm 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.

programming javascript Reduce JS Reduce javascript freecodecamp Reduce trong js