Yêu cầu thg 5 17, 2018 7:51 SA 352 0 1
  • 352 0 1
0

Difference between .each() | $.each() | .forEach() in jquery

Chia sẻ
  • 352 0 1

Giả sử mình có :

var list = ['a','b','c','d'];

Với .each() :

$(list).each(function(index, value){
   console.log(index + " : " + value)
});

Với $.each()

$.each(list, function(index, value){
   console.log(index + " : " + value)
});

Với .forEach()

  list.forEach(function(index,value){
     console.log(index+":"+value);
  })

Đều thu được kết quả:

"0 : a"
"1 : b"
"2 : c"
"3 : d"

Mình không biết 3 phương thức này khác nhau ở chỗ nào. Nhờ các bạn giải thích giúp mình với

1 CÂU TRẢ LỜI


Đã trả lời thg 5 17, 2018 8:18 SA
Đã được chấp nhận
+6

Hàm $(element).each() với $.each() về cơ bản là giống nhau bạn ạ, chúng chỉ khác nhau cách viết (cách gọi hàm thôi) 😂

Thực tế thì hàm $(element).each() sẽ gọi đến $.each() đấy 😄

Bạn có thể check source code của nó trên repo Github tại đây

jQuery.fn = jQuery.prototype = {
    // Execute a callback for every element in the matched set.
    each: function( callback ) {
        return jQuery.each( this, callback );
    },
}

Còn hàm .forEach() thì là hàm vốn có của Javascript, không cần jQuery bạn cũng có thể sử dụng được, kết quả thì cũng giống 2 hàm trên thôi 😄

Chia sẻ
Avatar Hoang vn @wiliamfeng
thg 5 17, 2018 9:09 SA

Cám ơn bạn ạ, vậy là nói chung 3 thằng này không có khác biệt nhau gì về chức năng đúng không ạ

Avatar Tran Duc Thang @thangtd90
thg 5 17, 2018 9:40 SA

@wiliamfeng $(element).each() với $.each() thì không có gì khác biệt về chức năng (bởi 1 hàm thực chất là gọi đến hàm kia), tuy nhiên .forEach() thì hơi khác biệt một chút.

.forEach() là một hàm của Array.prototype, nên chỉ dùng được với array, không dùng được với object.

Tuyên nhiên $(element).each() với $.each() thì dùng được với cả object nữa. Bạn có thể check qua source code ở đây

Ở trên, bạn lấy ví dụ là var list = ['a','b','c','d']; tức với 1 array, nên cả 3 hàm đều trả ra kết quả giống nhau.

Nhưng khi list của bạn là một object jQuery, như var list = $('a') chẳng hạn, thì bạn chỉ có thể dùng list.each() với $.each(list, function() {}) thôi 😃

Avatar Hoang vn @wiliamfeng
thg 5 17, 2018 10:10 SA

@thangtd90 Mình hiểu rồi, cám ơn bạn đã nhiệt tình giúp mình ạ

Viblo
Hãy đăng ký một tài khoản Viblo để nhận được nhiều bài viết thú vị hơn.
Đăng kí