Sự khác biệt giữa .map, .every và .forEach là gì?


118

Tôi luôn tự hỏi sự khác biệt giữa chúng là gì. Tất cả họ dường như làm cùng một điều ...


6
Ai đó đã thêm thẻ jQuery ... đang xem xét everyforEachkhông phải là phương thức jQuery, tôi nghĩ rằng không chắc câu hỏi liên quan đến jQuery theo bất kỳ cách nào. developer.mozilla.org/en/JavaScript/New_in_JavaScript/1.6
James Allardice

Tôi nghĩ rằng liên kết này sẽ có câu trả lời mà bạn đang tìm kiếm.
zBomb

Tôi có đúng khi nghĩ rằng bạn đang đề cập đến các phương pháp mảng cụ thể mới của Mozilla như được nêu chi tiết trong liên kết trong nhận xét trước của tôi không?
James Allardice

@James - Đây không phải là Mozilla cụ thể . Tôi cũng muốn chia sẻ một liên kết đến webkit và tài liệu opera, nhưng tôi không biết chúng ở đâu ra khỏi đầu tôi.
gilly3

@ gilly3 - Ahh, điểm tốt. Tôi tin rằng chúng chỉ được hỗ trợ trong IE9, không phải bên dưới.
James Allardice

Câu trả lời:


224

Sự khác biệt là ở các giá trị trả về.

.map() trả về một Mảng đối tượng mới được tạo bằng cách thực hiện một số hành động trên mục gốc.

.every() trả về boolean - true nếu mọi phần tử trong mảng này thỏa mãn hàm kiểm tra được cung cấp. Một điểm khác biệt quan trọng .every()là hàm kiểm tra có thể không phải lúc nào cũng được gọi cho mọi phần tử trong mảng. Khi hàm kiểm tra trả về false cho bất kỳ phần tử nào, không có phần tử mảng nào được lặp lại. Do đó, chức năng thử nghiệm thường không có tác dụng phụ .

.forEach() không trả về gì - Nó lặp lại Mảng thực hiện một hành động nhất định cho từng mục trong Mảng.

Đọc về những điều này và nhiều phương pháp lặp mảng khác tại MDN .


Ngoài ra, MDN có thể được trích dẫn
JoshWillik

3
@josh - Tôi đã trích dẫn MDN. Mỗi tên phương thức được liên kết với tài liệu tương ứng của nó tại MDN.
gilly 3

@ gilly3, tôi xin lỗi, tôi đã đánh bóng dòng chữ màu xanh lam>.>
JoshWillik

.forEach () trả về không có gì sai bây giờ, có thể không phải là vào năm 2012 nhưng ít nhất là vào năm 2015 trong Chrome, hãy thử điều này arr2 = ['sue', 'joe', 'ben', 'guy', 'tom', 'jon ']; b = arr2.forEach (function (el, indx) {console.log (indx + ':' + el);}); console.log (b);
jason

1
@EugeneMercer Theo "mục gốc", ý tôi là giá trị ban đầu của mỗi phần tử của mảng.
gilly 3

88

câu trả lời của gilly3 là tuyệt vời. Tôi chỉ muốn thêm một chút thông tin về các loại hàm "lặp qua các phần tử" khác.

  • .every() (ngừng lặp lại lần đầu tiên trình lặp trả về false hoặc cái gì đó falsey)
  • .some() (ngừng lặp lại lần đầu tiên trình lặp trả về true hoặc một cái gì đó trung thực)
  • .filter() (tạo một mảng mới bao gồm các phần tử mà hàm bộ lọc trả về true và bỏ qua những phần tử mà nó trả về false)
  • .map() (tạo một mảng mới từ các giá trị được trả về bởi hàm vòng lặp)
  • .reduce() (xây dựng một giá trị bằng cách gọi lặp lại trình lặp, chuyển các giá trị trước đó; xem thông số kỹ thuật để biết chi tiết; hữu ích cho việc tổng hợp nội dung của một mảng và nhiều thứ khác)
  • .reduceRight() (giống như giảm, nhưng hoạt động theo thứ tự giảm dần thay vì tăng dần)

tín dụng cho: TJCrowder Cho từng mảng trong JavaScript?


Nhận 100 lượt thích từ tôi!
Shamim

6

Một xem xét khác cho các câu trả lời tuyệt vời ở trên là chuỗi. Với forEach (), bạn không thể xâu chuỗi, nhưng với map (), bạn có thể.

Ví dụ:

var arrayNumbers = [3,1,2,4,5];

arrayNumbers.map(function(i) {
    return i * 2
}).sort();

với .forEach (), bạn không thể thực hiện .sort (), bạn sẽ gặp lỗi.


0

Đối với Ramda , sự khác biệt giữa R.map()R.forEach()là:

  1. R.forEach()trả về mảng ban đầu trong khi R.map()trả về một hàm
  2. R.forEach()chỉ có thể hoạt động trên mảng nhưng R.map()cũng có thể hoạt động trên một đối tượng (nghĩa là các cặp khóa / giá trị của đối tượng được coi như một mảng)

Câu hỏi có liên quan đến ngôn ngữ Javascript. Ramda trong khi tuyệt vời là một chủ đề hoàn toàn khác và một thư viện.
SeaWarrior404
Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.