Hướng dẫn foreach conditional javascript - foreach javascript có điều kiện

1. Đặt vấn đề

Xét một ví dụ đơn giản : " Tính tổng của mảng numbers = [1,2,3,4,5,6]" .

Show

Nội dung chính

  • 1. Đặt vấn đề
  • 2. Sử dụng forEach thế nào ?
  • 3. Giới thiệu về forEach
  • 4. Một số hàm khác
  • Đặt bài toán
  • Cách triển khai hàm forEach JavaScript
  • Áp dụng hàm forEach để giải quyết bài toán trên
  • Giới thiệu hàm forEach trong JavaScript
  • Giải thích
  • Ví dụ in ra nội dung của mảng
  • Ví dụ sử dụng thisArg
  • Ưu, nhược điểm của việc sử dụng forEach
  • Ưu điểm
  • Nhược điểm
  • Một số từ khóa trong vòng lặp forEach JS
  • Từ khóa return trong forEach
  • Từ khóa break trong forEach
  • Từ khóa continue trong forEach
  • Từ JavaScript forEach đến các phương thức khác
  • Hàm arr.entries()
  • Hàm arr.every()
  • Hàm arr.filter()
  • Hàm arr.find()
  • Hàm arr.findIndex()
  • Hàm arr.map()
  • Thực hành
  • 1. Flattening
  • 2. Every and some
  • Tổng kết

Thông thường, chúng ta sẽ làm như sau :

const numbers = [1, 2, 3, 4, 5, 6];
let sum = 0;
for(let i = 0; i < numbers.length; i++) {
  sum += numbers[i];
}
console.log(sum);
// => 21

Cách trên khá dễ hiểu và thường đọc xong người ta sẽ nghĩ đến dùng cách này luôn. Tuy nhiên, trong trường hợp nào đó, vô tình chúng ta bị nhầm lẫn biến i đó với một biến số nào trước đó thì thật tệ hại.

Ngoài cách dùng vòng for, chúng ta có thể dùng tới forEach, một hàm khá hay và ngắn gọn.

2. Sử dụng forEach thế nào ?

3. Giới thiệu về forEach

const numbers = [1, 2, 3, 4, 5, 6];
let sum = 0;
forEach(numbers, function(element){
    sum += element;
});
console.log(sum);
// => 21

4. Một số hàm khác

3. Giới thiệu về forEach

4. Một số hàm khác

Đặt bài toán

arr.forEach(function callback(currentValue, index, array) {
    // your iterator
}[, thisArg]);

Giải thích

Ví dụ in ra nội dung của mảng

Ví dụ sử dụng thisArg

Ưu, nhược điểm của việc sử dụng forEach

Ưu điểm

Nhược điểm

Một số từ khóa trong vòng lặp forEach JS

function sumOfArray(numbers){
  numbers.forEach(function sumElement(element){
    console.log(element);
  });
}

Từ khóa return trong forEach

function Counter() {
  this.sum = 0;
  this.count = 0;
}
Counter.prototype.add = function(array) {
 array.forEach(function(item) {
   this.sum += item;
   ++this.count;
 }, this);
};

const obj = new Counter();
obj.add([2, 5, 9]);
console.log(obj.count); // => 3 
console.log(obj.sum);   // => 16

Từ khóa break trong forEach

4. Một số hàm khác

Đặt bài toán

  1. Cách triển khai hàm forEach JavaScript

Áp dụng hàm forEach để giải quyết bài toán trên

Giới thiệu hàm forEach trong JavaScript

let arrayName = dataResponse.map( item => {
    return item.Name
}

Giải thích

  1. Ví dụ in ra nội dung của mảng

Ví dụ sử dụng thisArg

Ưu, nhược điểm của việc sử dụng forEach

let companyObject = dataCompany.filter((company) => {
              return company["companyId"] === companyId;
            })
  1. Ưu điểm

Nhược điểm

Một số từ khóa trong vòng lặp forEach JS

let total_weight = animals.reduce((weight, animal, index, animals) => {
    return weight += animal.weight
}, 0)

Từ khóa return trong forEach

Từ khóa break trong forEach

Từ khóa continue trong forEach

Từ JavaScript forEach đến các phương thức khác

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array

Hàm arr.entries()forEach là một hàm rất hay. Vậy hàm forEach trong JavaScript cụ thể là như thế nào? Cách sử dụng forEach JavaScript ra sao? Mình hãy cùng tìm hiểu để làm chủ forEach js nhé!

Đặt bài toán

Cách triển khai hàm forEach JavaScriptconsole.

Áp dụng hàm forEach để giải quyết bài toán trên

const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
let sum = 0;

// duyệt từng phần tử của mảng để cộng dồn vào biến sum
for (let i = 0; i < numbers.length; i++) {
  sum += numbers[i];
}

console.log(sum); // 55

Giới thiệu hàm forEach trong JavaScript

Giải thích

Ví dụ in ra nội dung của mảngforEach JavaScript xuất hiện giúp bạn giải quyết vấn đề trên.

Cách triển khai hàm forEach JavaScript

Áp dụng hàm forEach để giải quyết bài toán trên

function forEach(array, action) {
  for (let i = 0; i < array.length; i++) {
    action(array[i]);
  }
}

Giới thiệu hàm forEach trong JavaScript

Áp dụng hàm forEach để giải quyết bài toán trên

const numbers = [1, 2, 3, 4, 5, 6];
let sum = 0;
forEach(numbers, function(element){
    sum += element;
});
console.log(sum);
// => 21
0

Mình có thể diễn giải thuật toán trên bằng lới như sau: Với mỗi phần tử trong mảng

function Counter() {
  this.sum = 0;
  this.count = 0;
}
Counter.prototype.add = function(array) {
 array.forEach(function(item) {
   this.sum += item;
   ++this.count;
 }, this);
};

const obj = new Counter();
obj.add([2, 5, 9]);
console.log(obj.count); // => 3 
console.log(obj.sum);   // => 16
4, mình lấy nó ra và cộng dồn với biến sum. Kết quả thu được, sẽ ghi ra console.

Nếu so sánh với cách làm trước thì cách này rõ ràng là dài hơn. Tuy nhiên, đây chỉ là một ví dụ cơ bản, nên mình sẽ không bàn về độ dài, ngắn của code.độ dài, ngắn của code.

Vấn đề nên quan tâm trước tiên đó là: code-đọc-dễ-hiểu.code-đọc-dễ-hiểu.

Theo quan điểm cá nhân mình, việc sử dụng hàm forEach giúp code gần giống với ngôn ngữ tự nhiên hơn. Quan điểm của bạn về vấn đề này thế nào?forEach giúp code gần giống với ngôn ngữ tự nhiên hơn. Quan điểm của bạn về vấn đề này thế nào?

Giới thiệu hàm forEach trong JavaScript

Hàm forEach là gì? Hay vòng lặp forEach trong JavaScript là gì?

Trả lời: forEach là một phương thức có sẵn của array, để duyệt qua mỗi phần tử của mảng và thực hiện một hành động nào đó.forEach là một phương thức có sẵn của array, để duyệt qua mỗi phần tử của mảng và thực hiện một hành động nào đó.

Cú pháp

const numbers = [1, 2, 3, 4, 5, 6];
let sum = 0;
forEach(numbers, function(element){
    sum += element;
});
console.log(sum);
// => 21
1

Giải thích

  • function Counter() {
      this.sum = 0;
      this.count = 0;
    }
    Counter.prototype.add = function(array) {
     array.forEach(function(item) {
       this.sum += item;
       ++this.count;
     }, this);
    };
    
    const obj = new Counter();
    obj.add([2, 5, 9]);
    console.log(obj.count); // => 3 
    console.log(obj.sum);   // => 16
    
    5: Hàm callback là hàm để thực hiện với mỗi phần tử của mảng, bao gồm 3 tham số:
    • function Counter() {
        this.sum = 0;
        this.count = 0;
      }
      Counter.prototype.add = function(array) {
       array.forEach(function(item) {
         this.sum += item;
         ++this.count;
       }, this);
      };
      
      const obj = new Counter();
      obj.add([2, 5, 9]);
      console.log(obj.count); // => 3 
      console.log(obj.sum);   // => 16
      
      6: phần tử hiện tại đang được xử lý của array.
    • function Counter() {
        this.sum = 0;
        this.count = 0;
      }
      Counter.prototype.add = function(array) {
       array.forEach(function(item) {
         this.sum += item;
         ++this.count;
       }, this);
      };
      
      const obj = new Counter();
      obj.add([2, 5, 9]);
      console.log(obj.count); // => 3 
      console.log(obj.sum);   // => 16
      
      7: chỉ số của phần tử hiện tại đang được xử lý của array.
    • function Counter() {
        this.sum = 0;
        this.count = 0;
      }
      Counter.prototype.add = function(array) {
       array.forEach(function(item) {
         this.sum += item;
         ++this.count;
       }, this);
      };
      
      const obj = new Counter();
      obj.add([2, 5, 9]);
      console.log(obj.count); // => 3 
      console.log(obj.sum);   // => 16
      
      1: mảng hiện tại đang gọi hàm forEach.
  • function Counter() {
      this.sum = 0;
      this.count = 0;
    }
    Counter.prototype.add = function(array) {
     array.forEach(function(item) {
       this.sum += item;
       ++this.count;
     }, this);
    };
    
    const obj = new Counter();
    obj.add([2, 5, 9]);
    console.log(obj.count); // => 3 
    console.log(obj.sum);   // => 16
    
    9: giá trị được sử dụng như là
    let arrayName = dataResponse.map( item => {
        return item.Name
    }
    
    0 - tham chiếu tới đối tượng khi thực hiện hàm
    function Counter() {
      this.sum = 0;
      this.count = 0;
    }
    Counter.prototype.add = function(array) {
     array.forEach(function(item) {
       this.sum += item;
       ++this.count;
     }, this);
    };
    
    const obj = new Counter();
    obj.add([2, 5, 9]);
    console.log(obj.count); // => 3 
    console.log(obj.sum);   // => 16
    
    5.

Chú ý::

  • Nếu
    function Counter() {
      this.sum = 0;
      this.count = 0;
    }
    Counter.prototype.add = function(array) {
     array.forEach(function(item) {
       this.sum += item;
       ++this.count;
     }, this);
    };
    
    const obj = new Counter();
    obj.add([2, 5, 9]);
    console.log(obj.count); // => 3 
    console.log(obj.sum);   // => 16
    
    9 bị bỏ qua thì mặc định giá trị đó là
    let arrayName = dataResponse.map( item => {
        return item.Name
    }
    
    3.
  • Bạn có thể bỏ qua tên hàm
    function Counter() {
      this.sum = 0;
      this.count = 0;
    }
    Counter.prototype.add = function(array) {
     array.forEach(function(item) {
       this.sum += item;
       ++this.count;
     }, this);
    };
    
    const obj = new Counter();
    obj.add([2, 5, 9]);
    console.log(obj.count); // => 3 
    console.log(obj.sum);   // => 16
    
    5.
const numbers = [1, 2, 3, 4, 5, 6];
let sum = 0;
forEach(numbers, function(element){
    sum += element;
});
console.log(sum);
// => 21
2

Ví dụ in ra nội dung của mảng

const numbers = [1, 2, 3, 4, 5, 6];
let sum = 0;
forEach(numbers, function(element){
    sum += element;
});
console.log(sum);
// => 21
3

Kết quả:

Ví dụ sử dụng thisArg

const numbers = [1, 2, 3, 4, 5, 6];
let sum = 0;
forEach(numbers, function(element){
    sum += element;
});
console.log(sum);
// => 21
4

Ưu, nhược điểm của việc sử dụng forEach

Bất cứ thứ gì cũng có hai mặt, forEach JavaScript cũng không ngoại lệ. Sau đây là một số ưu, nhược điểm của phương thức

function Counter() {
  this.sum = 0;
  this.count = 0;
}
Counter.prototype.add = function(array) {
 array.forEach(function(item) {
   this.sum += item;
   ++this.count;
 }, this);
};

const obj = new Counter();
obj.add([2, 5, 9]);
console.log(obj.count); // => 3 
console.log(obj.sum);   // => 16
0:forEach JavaScript cũng không ngoại lệ. Sau đây là một số ưu, nhược điểm của phương thức
function Counter() {
  this.sum = 0;
  this.count = 0;
}
Counter.prototype.add = function(array) {
 array.forEach(function(item) {
   this.sum += item;
   ++this.count;
 }, this);
};

const obj = new Counter();
obj.add([2, 5, 9]);
console.log(obj.count); // => 3 
console.log(obj.sum);   // => 16
0:

Ưu điểm

  • Code rõ ràng, gần với ngôn ngữ tự nhiên.
  • Trong nhiều trường hợp sẽ ngắn gọn hơn việc sử dụng vòng lặp
    let arrayName = dataResponse.map( item => {
        return item.Name
    }
    
    6 hay
    let arrayName = dataResponse.map( item => {
        return item.Name
    }
    
    7.

Nhược điểm

  • Code thường sẽ chạy chậm hơn so với việc sử dụng vòng lặp (tuy nhiên không đáng kể).
  • Không giống các ngôn ngữ lập trình khác như C/C++, Java (hầu như chỉ sử dụng vòng lặp).

Trên đây là một số ưu, nhược điểm của việc sử dụng

function Counter() {
  this.sum = 0;
  this.count = 0;
}
Counter.prototype.add = function(array) {
 array.forEach(function(item) {
   this.sum += item;
   ++this.count;
 }, this);
};

const obj = new Counter();
obj.add([2, 5, 9]);
console.log(obj.count); // => 3 
console.log(obj.sum);   // => 16
0. Mình không khuyên bạn nên hay không nên sử dụng phương thức này.nên hay không nên sử dụng phương thức này.

Đây chỉ đơn giản là một cách thức để duyệt mảng, bạn có thể sử dụng nó hoặc bạn chỉ cần sử dụng vòng lặp.

It's the choice.

Một số từ khóa trong vòng lặp forEach JS

Khi so sánh với các vòng lặp khác, ngôn ngữ lập trình khác, bạn sẽ thấy một số từ khóa hay sử dụng trong vòng lặp như:

let arrayName = dataResponse.map( item => {
    return item.Name
}
9,
let companyObject = dataCompany.filter((company) => {
              return company["companyId"] === companyId;
            })
0 và
let companyObject = dataCompany.filter((company) => {
              return company["companyId"] === companyId;
            })
1.vòng lặp khác, ngôn ngữ lập trình khác, bạn sẽ thấy một số từ khóa hay sử dụng trong vòng lặp như:
let arrayName = dataResponse.map( item => {
    return item.Name
}
9,
let companyObject = dataCompany.filter((company) => {
              return company["companyId"] === companyId;
            })
0 và
let companyObject = dataCompany.filter((company) => {
              return company["companyId"] === companyId;
            })
1.

Câu hỏi đặt ra là liệu những từ khóa này có sử dụng được trong vòng lặp forEach JavaScript hay không? Cách sử dụng của chúng có giống hay không?

Sau đây là câu trả lời.

Từ khóa return trong forEach

Từ khóa

let arrayName = dataResponse.map( item => {
    return item.Name
}
9 dùng để dừng lại một hàm và trả về giá trị từ hàm đó.

Giả sử, bạn cần viết một hàm tìm vị trí của số chẵn đầu tiên trong một mảng. Nếu không tìm thấy thì trả về giá trị

let companyObject = dataCompany.filter((company) => {
              return company["companyId"] === companyId;
            })
3.vị trí của số chẵn đầu tiên trong một mảng. Nếu không tìm thấy thì trả về giá trị
let companyObject = dataCompany.filter((company) => {
              return company["companyId"] === companyId;
            })
3.

Sau đây là code sử dụng vòng lặp for thông thường:vòng lặp for thông thường:

const numbers = [1, 2, 3, 4, 5, 6];
let sum = 0;
forEach(numbers, function(element){
    sum += element;
});
console.log(sum);
// => 21
5

Chuyển đoạn code trên sang forEach như sau:

const numbers = [1, 2, 3, 4, 5, 6];
let sum = 0;
forEach(numbers, function(element){
    sum += element;
});
console.log(sum);
// => 21
6

Tại sao kết quả lại là -1?-1?

Tại vì từ khóa

let arrayName = dataResponse.map( item => {
    return item.Name
}
9 trong forEach chỉ có tác dụng để thoát khỏi hàm callback bên trong forEach mà thôi. Do đó, kết quả của hàm trên là giá trị của câu lệnh
let companyObject = dataCompany.filter((company) => {
              return company["companyId"] === companyId;
            })
5 cuối cùng.thoát khỏi hàm callback bên trong forEach mà thôi. Do đó, kết quả của hàm trên là giá trị của câu lệnh
let companyObject = dataCompany.filter((company) => {
              return company["companyId"] === companyId;
            })
5 cuối cùng.

Dể giải quyết bài toán này, mình khuyên bạn không nên dùng

function Counter() {
  this.sum = 0;
  this.count = 0;
}
Counter.prototype.add = function(array) {
 array.forEach(function(item) {
   this.sum += item;
   ++this.count;
 }, this);
};

const obj = new Counter();
obj.add([2, 5, 9]);
console.log(obj.count); // => 3 
console.log(obj.sum);   // => 16
0. Thay vào đó bạn có thể dùng vòng lặp for thông thường như trên, hoặc sử dụng vòng lặp for...in như sau:for...in như sau:

const numbers = [1, 2, 3, 4, 5, 6];
let sum = 0;
forEach(numbers, function(element){
    sum += element;
});
console.log(sum);
// => 21
7

Chú ý: vòng lặp

let companyObject = dataCompany.filter((company) => {
              return company["companyId"] === companyId;
            })
7 chỉ nên dùng với array, không nên sử dụng với đối tượng
let companyObject = dataCompany.filter((company) => {
              return company["companyId"] === companyId;
            })
8.
vòng lặp
let companyObject = dataCompany.filter((company) => {
              return company["companyId"] === companyId;
            })
7 chỉ nên dùng với array, không nên sử dụng với đối tượng
let companyObject = dataCompany.filter((company) => {
              return company["companyId"] === companyId;
            })
8.

Từ khóa break trong forEach

Từ khóa

let companyObject = dataCompany.filter((company) => {
              return company["companyId"] === companyId;
            })
0 thường dùng để thoát khỏi câu lệnh
let total_weight = animals.reduce((weight, animal, index, animals) => {
    return weight += animal.weight
}, 0)
0 hoặc thoát khỏi vòng lặp (
let arrayName = dataResponse.map( item => {
    return item.Name
}
6,
let arrayName = dataResponse.map( item => {
    return item.Name
}
7,
let total_weight = animals.reduce((weight, animal, index, animals) => {
    return weight += animal.weight
}, 0)
3,
let companyObject = dataCompany.filter((company) => {
              return company["companyId"] === companyId;
            })
7).

Ví dụ đoạn code sau dùng để thoát khỏi vòng lặp for khi

function sumOfArray(numbers){
  numbers.forEach(function sumElement(element){
    console.log(element);
  });
}
9 bằng
let total_weight = animals.reduce((weight, animal, index, animals) => {
    return weight += animal.weight
}, 0)
6:

const numbers = [1, 2, 3, 4, 5, 6];
let sum = 0;
forEach(numbers, function(element){
    sum += element;
});
console.log(sum);
// => 21
8

Nếu sử dụng từ khóa

let companyObject = dataCompany.filter((company) => {
              return company["companyId"] === companyId;
            })
0 với forEach thì sao?

const numbers = [1, 2, 3, 4, 5, 6];
let sum = 0;
forEach(numbers, function(element){
    sum += element;
});
console.log(sum);
// => 21
9

Đúng vậy, bạn sẽ bị lỗi cú pháp Illegal break statement vì từ khóa break là không hợp lệ với forEach JS.Illegal break statement vì từ khóa break là không hợp lệ với forEach JS.

Nghĩa là bạn không thể sử dụng từ khóa break với forEach. Thay vào đó bạn có thể sử dụng vòng lặp for như trên hoặc dùng phương thức

let total_weight = animals.reduce((weight, animal, index, animals) => {
    return weight += animal.weight
}, 0)
8 để thay thế:for như trên hoặc dùng phương thức
let total_weight = animals.reduce((weight, animal, index, animals) => {
    return weight += animal.weight
}, 0)
8 để thay thế:

arr.forEach(function callback(currentValue, index, array) {
    // your iterator
}[, thisArg]);
0

Từ khóa continue trong forEach

Từ khóa

let companyObject = dataCompany.filter((company) => {
              return company["companyId"] === companyId;
            })
1 thường dùng để bỏ qua một lượt lặp trong vòng lặp.bỏ qua một lượt lặp trong vòng lặp.

Ví dụ đoạn code sau dùng để bỏ qua lượt lặp khi

function sumOfArray(numbers){
  numbers.forEach(function sumElement(element){
    console.log(element);
  });
}
9 bằng
let total_weight = animals.reduce((weight, animal, index, animals) => {
    return weight += animal.weight
}, 0)
6:

arr.forEach(function callback(currentValue, index, array) {
    // your iterator
}[, thisArg]);
1

Nếu chuyển sang dùng với

function Counter() {
  this.sum = 0;
  this.count = 0;
}
Counter.prototype.add = function(array) {
 array.forEach(function(item) {
   this.sum += item;
   ++this.count;
 }, this);
};

const obj = new Counter();
obj.add([2, 5, 9]);
console.log(obj.count); // => 3 
console.log(obj.sum);   // => 16
0:

arr.forEach(function callback(currentValue, index, array) {
    // your iterator
}[, thisArg]);
2

Bạn sẽ bị lỗi Illegal continue statement: no surrounding iteration statement. Vì từ khóa

let companyObject = dataCompany.filter((company) => {
              return company["companyId"] === companyId;
            })
1 không hợp lệ với forEach JavaScript.Illegal continue statement: no surrounding iteration statement. Vì từ khóa
let companyObject = dataCompany.filter((company) => {
              return company["companyId"] === companyId;
            })
1 không hợp lệ với forEach JavaScript.

Nghĩa là bạn cũng không thể dùng

let companyObject = dataCompany.filter((company) => {
              return company["companyId"] === companyId;
            })
1 bên trong
function Counter() {
  this.sum = 0;
  this.count = 0;
}
Counter.prototype.add = function(array) {
 array.forEach(function(item) {
   this.sum += item;
   ++this.count;
 }, this);
};

const obj = new Counter();
obj.add([2, 5, 9]);
console.log(obj.count); // => 3 
console.log(obj.sum);   // => 16
0 được. Thay vào đó, bạn có thể dùng vòng lặp for như trên hoặc sử dụng từ khóa
let arrayName = dataResponse.map( item => {
    return item.Name
}
9 như sau:vòng lặp for như trên hoặc sử dụng từ khóa
let arrayName = dataResponse.map( item => {
    return item.Name
}
9 như sau:

arr.forEach(function callback(currentValue, index, array) {
    // your iterator
}[, thisArg]);
3

Từ JavaScript forEach đến các phương thức khác

Ngoài forEach, JavaScript còn cung cấp một số phương thức khác, tương tự dành cho array. Đó là: entries, every, filter, find, findIndex, keys, map, reduce, reduceRight, some, values.

Hàm arr.entries()

Trả về một mảng đối tượng mới, chứa key/value cho mỗi phần tử trong array.key/value cho mỗi phần tử trong array.

Để duyệt mảng đối tượng mới này, mình sử dụng vòng lặp

const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
let sum = 0;

// duyệt từng phần tử của mảng để cộng dồn vào biến sum
for (let i = 0; i < numbers.length; i++) {
  sum += numbers[i];
}

console.log(sum); // 55
7:

arr.forEach(function callback(currentValue, index, array) {
    // your iterator
}[, thisArg]);
4

Hàm arr.every()

Trả về

const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
let sum = 0;

// duyệt từng phần tử của mảng để cộng dồn vào biến sum
for (let i = 0; i < numbers.length; i++) {
  sum += numbers[i];
}

console.log(sum); // 55
8 nếu như tất cả các phần tử trong mảng thoả mãn 1 hàm kiểm tra, ngược lại trả về
const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
let sum = 0;

// duyệt từng phần tử của mảng để cộng dồn vào biến sum
for (let i = 0; i < numbers.length; i++) {
  sum += numbers[i];
}

console.log(sum); // 55
9.

arr.forEach(function callback(currentValue, index, array) {
    // your iterator
}[, thisArg]);
5

Tham số truyền vào giống với hàm

function Counter() {
  this.sum = 0;
  this.count = 0;
}
Counter.prototype.add = function(array) {
 array.forEach(function(item) {
   this.sum += item;
   ++this.count;
 }, this);
};

const obj = new Counter();
obj.add([2, 5, 9]);
console.log(obj.count); // => 3 
console.log(obj.sum);   // => 16
0.

Ví dụ sau trả về

const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
let sum = 0;

// duyệt từng phần tử của mảng để cộng dồn vào biến sum
for (let i = 0; i < numbers.length; i++) {
  sum += numbers[i];
}

console.log(sum); // 55
8 nếu tất cả các phần tử trong mảng thoả mãn đều lớn hơn hoặc bằng 10:

arr.forEach(function callback(currentValue, index, array) {
    // your iterator
}[, thisArg]);
6

Hàm arr.filter()

Giống như cái tên của nó, phương thức này dùng để lọc ra các phần tử trong mảng thoả mãn một điều kiện cho trước và trả về một mảng mới chứa những phần tử đó.lọc ra các phần tử trong mảng thoả mãn một điều kiện cho trước và trả về một mảng mới chứa những phần tử đó.

arr.forEach(function callback(currentValue, index, array) {
    // your iterator
}[, thisArg]);
7

Tham số truyền vào giống với hàm

function Counter() {
  this.sum = 0;
  this.count = 0;
}
Counter.prototype.add = function(array) {
 array.forEach(function(item) {
   this.sum += item;
   ++this.count;
 }, this);
};

const obj = new Counter();
obj.add([2, 5, 9]);
console.log(obj.count); // => 3 
console.log(obj.sum);   // => 16
0.

Ví dụ sau trả về

const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
let sum = 0;

// duyệt từng phần tử của mảng để cộng dồn vào biến sum
for (let i = 0; i < numbers.length; i++) {
  sum += numbers[i];
}

console.log(sum); // 55
8 nếu tất cả các phần tử trong mảng thoả mãn đều lớn hơn hoặc bằng 10:

arr.forEach(function callback(currentValue, index, array) {
    // your iterator
}[, thisArg]);
8

Hàm arr.filter()

Giống như cái tên của nó, phương thức này dùng để lọc ra các phần tử trong mảng thoả mãn một điều kiện cho trước và trả về một mảng mới chứa những phần tử đó.phần tử đầu tiên trong mảng thoả mãn điều kiện cho trước, nếu không tìm thấy thì trả về

let arrayName = dataResponse.map( item => {
    return item.Name
}
3.

arr.forEach(function callback(currentValue, index, array) {
    // your iterator
}[, thisArg]);
9

Ví dụ sau lọc ra những phần tử trong mảng có giá trị lớn hơn hoặc bằng 10:

Hàm arr.find()

function sumOfArray(numbers){
  numbers.forEach(function sumElement(element){
    console.log(element);
  });
}
0

Trả về giá trị của phần tử đầu tiên trong mảng thoả mãn điều kiện cho trước, nếu không tìm thấy thì trả về let arrayName = dataResponse.map( item => { return item.Name } 3.

Tham số truyền vào cũng giống như hàm

function Counter() {
  this.sum = 0;
  this.count = 0;
}
Counter.prototype.add = function(array) {
 array.forEach(function(item) {
   this.sum += item;
   ++this.count;
 }, this);
};

const obj = new Counter();
obj.add([2, 5, 9]);
console.log(obj.count); // => 3 
console.log(obj.sum);   // => 16
0.chỉ số đầu tiên của phần tử thoả mãn điều kiện cho trước, ngược lại trả về
let companyObject = dataCompany.filter((company) => {
              return company["companyId"] === companyId;
            })
3.

function sumOfArray(numbers){
  numbers.forEach(function sumElement(element){
    console.log(element);
  });
}
1

Ví dụ sau lọc ra những phần tử trong mảng có giá trị lớn hơn hoặc bằng 10:

Hàm arr.find()

Trả về giá trị của phần tử đầu tiên trong mảng thoả mãn điều kiện cho trước, nếu không tìm thấy thì trả về
let arrayName = dataResponse.map( item => {
    return item.Name
}
3.

Tham số truyền vào cũng giống như hàm function Counter() { this.sum = 0; this.count = 0; } Counter.prototype.add = function(array) { array.forEach(function(item) { this.sum += item; ++this.count; }, this); }; const obj = new Counter(); obj.add([2, 5, 9]); console.log(obj.count); // => 3 console.log(obj.sum); // => 16 0.

Ví dụ sau tìm ra một object với

function forEach(array, action) {
  for (let i = 0; i < array.length; i++) {
    action(array[i]);
  }
}
5 thoả mãn điều kiện cho trước:

function sumOfArray(numbers){
  numbers.forEach(function sumElement(element){
    console.log(element);
  });
}
3

Hàm arr.findIndex()

Trả về chỉ số đầu tiên của phần tử thoả mãn điều kiện cho trước, ngược lại trả về

let companyObject = dataCompany.filter((company) => {
              return company["companyId"] === companyId;
            })
3.căn bậc hai của phần tử tương ứng trong mảng ban đầu:

function sumOfArray(numbers){
  numbers.forEach(function sumElement(element){
    console.log(element);
  });
}
4

Ví dụ sau tìm ra chỉ số object với

function forEach(array, action) {
  for (let i = 0; i < array.length; i++) {
    action(array[i]);
  }
}
5 thoả mãn điều kiện cho trước:

function sumOfArray(numbers){ numbers.forEach(function sumElement(element){ console.log(element); }); } 2

Hàm arr.map()

Trả về mảng mới với mỗi phần tử là kết quả của việc gọi hàm callback với mỗi phần tử của mảng ban đầu.

function sumOfArray(numbers){
  numbers.forEach(function sumElement(element){
    console.log(element);
  });
}
5

Tham số truyền vào cũng giống như hàm

function Counter() {
  this.sum = 0;
  this.count = 0;
}
Counter.prototype.add = function(array) {
 array.forEach(function(item) {
   this.sum += item;
   ++this.count;
 }, this);
};

const obj = new Counter();
obj.add([2, 5, 9]);
console.log(obj.count); // => 3 
console.log(obj.sum);   // => 16
0 JavaScript.

Ví dụ sau trả về mảng mới, mà mỗi phần tử của mảng mới là căn bậc hai của phần tử tương ứng trong mảng ban đầu:

Những phương thức còn lại bạn có thể tham khảo thêm tại bài viết: Các phương thức của mảng trong JavaScript.

Ví dụ sau trả về mảng mới, mà mỗi phần tử của mảng mới là căn bậc hai của phần tử tương ứng trong mảng ban đầu:

Những phương thức còn lại bạn có thể tham khảo thêm tại bài viết: Các phương thức của mảng trong JavaScript.

Thực hành

  • 1. Flatteningtất cả các phần tử của mảng
    const numbers = [1, 2, 3, 4, 5, 6];
    let sum = 0;
    forEach(numbers, function(element){
        sum += element;
    });
    console.log(sum);
    // => 21
    
    06 làm hàm
    const numbers = [1, 2, 3, 4, 5, 6];
    let sum = 0;
    forEach(numbers, function(element){
        sum += element;
    });
    console.log(sum);
    // => 21
    
    07 trả về
    const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
    let sum = 0;
    
    // duyệt từng phần tử của mảng để cộng dồn vào biến sum
    for (let i = 0; i < numbers.length; i++) {
      sum += numbers[i];
    }
    
    console.log(sum); // 55
    8, ngược lại thì trả về
    const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
    let sum = 0;
    
    // duyệt từng phần tử của mảng để cộng dồn vào biến sum
    for (let i = 0; i < numbers.length; i++) {
      sum += numbers[i];
    }
    
    console.log(sum); // 55
    9.
  • Cho một mảng hai chiều, hãy chuyển mảng đó thành mảng một chiều, ví dụ:ít nhất một phần tử của mảng
    const numbers = [1, 2, 3, 4, 5, 6];
    let sum = 0;
    forEach(numbers, function(element){
        sum += element;
    });
    console.log(sum);
    // => 21
    
    06 làm hàm
    const numbers = [1, 2, 3, 4, 5, 6];
    let sum = 0;
    forEach(numbers, function(element){
        sum += element;
    });
    console.log(sum);
    // => 21
    
    07 trả về
    const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
    let sum = 0;
    
    // duyệt từng phần tử của mảng để cộng dồn vào biến sum
    for (let i = 0; i < numbers.length; i++) {
      sum += numbers[i];
    }
    
    console.log(sum); // 55
    8, ngược lại thì trả về
    const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
    let sum = 0;
    
    // duyệt từng phần tử của mảng để cộng dồn vào biến sum
    for (let i = 0; i < numbers.length; i++) {
      sum += numbers[i];
    }
    
    console.log(sum); // 55
    9.
function sumOfArray(numbers){
  numbers.forEach(function sumElement(element){
    console.log(element);
  });
}
6

► Sử dụng phương thức

const numbers = [1, 2, 3, 4, 5, 6];
let sum = 0;
forEach(numbers, function(element){
    sum += element;
});
console.log(sum);
// => 21
00 và
const numbers = [1, 2, 3, 4, 5, 6];
let sum = 0;
forEach(numbers, function(element){
    sum += element;
});
console.log(sum);
// => 21
01.

  • Xem đáp án
  • ► Sử dụng vòng lặp for, while thông thường.

2. Every and some

Hãy viết hàm

const numbers = [1, 2, 3, 4, 5, 6];
let sum = 0;
forEach(numbers, function(element){
    sum += element;
});
console.log(sum);
// => 21
02 và
const numbers = [1, 2, 3, 4, 5, 6];
let sum = 0;
forEach(numbers, function(element){
    sum += element;
});
console.log(sum);
// => 21
03 thoả mãn:

const numbers = [1, 2, 3, 4, 5, 6];
let sum = 0;
forEach(numbers, function(element){
    sum += element;
});
console.log(sum);
// => 21
04: trả về
const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
let sum = 0;

// duyệt từng phần tử của mảng để cộng dồn vào biến sum
for (let i = 0; i < numbers.length; i++) {
  sum += numbers[i];
}

console.log(sum); // 55
8 khi tất cả các phần tử của mảng
const numbers = [1, 2, 3, 4, 5, 6];
let sum = 0;
forEach(numbers, function(element){
    sum += element;
});
console.log(sum);
// => 21
06 làm hàm
const numbers = [1, 2, 3, 4, 5, 6];
let sum = 0;
forEach(numbers, function(element){
    sum += element;
});
console.log(sum);
// => 21
07 trả về
const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
let sum = 0;

// duyệt từng phần tử của mảng để cộng dồn vào biến sum
for (let i = 0; i < numbers.length; i++) {
  sum += numbers[i];
}

console.log(sum); // 55
8, ngược lại thì trả về
const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
let sum = 0;

// duyệt từng phần tử của mảng để cộng dồn vào biến sum
for (let i = 0; i < numbers.length; i++) {
  sum += numbers[i];
}

console.log(sum); // 55
9.

const numbers = [1, 2, 3, 4, 5, 6];
let sum = 0;
forEach(numbers, function(element){
    sum += element;
});
console.log(sum);
// => 21
10: trả về
const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
let sum = 0;

// duyệt từng phần tử của mảng để cộng dồn vào biến sum
for (let i = 0; i < numbers.length; i++) {
  sum += numbers[i];
}

console.log(sum); // 55
8 khi ít nhất một phần tử của mảng
const numbers = [1, 2, 3, 4, 5, 6];
let sum = 0;
forEach(numbers, function(element){
    sum += element;
});
console.log(sum);
// => 21
06 làm hàm
const numbers = [1, 2, 3, 4, 5, 6];
let sum = 0;
forEach(numbers, function(element){
    sum += element;
});
console.log(sum);
// => 21
07 trả về
const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
let sum = 0;

// duyệt từng phần tử của mảng để cộng dồn vào biến sum
for (let i = 0; i < numbers.length; i++) {
  sum += numbers[i];
}

console.log(sum); // 55
8, ngược lại thì trả về
const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
let sum = 0;

// duyệt từng phần tử của mảng để cộng dồn vào biến sum
for (let i = 0; i < numbers.length; i++) {
  sum += numbers[i];
}

console.log(sum); // 55
9.

Xem đáp án: