Phương pháp đối tượng JavaScript Chaining: hữu ích?

Question

Vì vậy, ... rối tung xung quanh trong JavaScript với một ý tưởng đó là mới với tôi, có phương pháp của một đối tượng trả lại đối tượng mà họ là phương pháp; điều này sau đó dẫn đến chainability. Câu hỏi của tôi, sau đó: làm thế nào điều này có thể hữu ích? Tôi đã ném này lại với nhau để kiểm tra các hoạt động cơ bản:

<script> 
MathChain = function() 
{ 
    this.pass = function() 
    { 
     this.multiply = eval(arguments.join('*')); 
     this.add = eval(arguments.join('+')); 
     return this; 
    } 
} 

m = new MathChain().pass(5, 10, 20).multiply; // 1000 
a = new MathChain().pass(5, 10, 20).add;  // 35 
</script> 

Đó là rõ ràng không phải một trường hợp ác hiệu quả, trong đó người ta sẽ sử dụng khái niệm này, vì vậy bạn có thể chỉ cho tôi một cái gì đó mà làm như vậy đúng (ngoài jQuery, xin vui lòng)?

Answer 1

Vâng, đây là một ví dụ không áp dụng thực tế, nhưng tôi nghĩ bạn sẽ có ý tưởng. Nếu cho phép bạn thực hiện một số thao tác khác nhau trên một đối tượng và cung cấp sự tiện lợi.

var truck = function() { 

    this.turnLeft = function { 

     // turn left 
     return this; 

    } 

    this.turnRight = function { 

     // turn right 
     return this; 

    } 

    this.goReallyFast = function { 

     // go fast! 
     return this; 

    } 

}; 

// My get-away plan 
var myTruck = new truck(); 
myTruck.turnLeft().turnRight().goReallyFast(); 

Answer 2

thạo giao diện - http://en.wikipedia.org/wiki/Fluent_interface

Yea tôi nghĩ rằng nó có thể rất hữu ích nhưng cũng giống như bất kỳ mẫu thiết kế chỉ nên được sử dụng khi cần thiết

Edit: đây là api twitter khách hàng trong C# sử dụng thành thạo giao diện - http://code.google.com/p/tweetsharp/

Answer 3

Ví dụ rất khác (không phải OO), chuỗi có phần tương tự với Unix pipelines. Mỗi bước của một ống Unix trả về (sửa đổi) nội dung đầy đủ, phù hợp cho việc gửi sang bước tiếp theo:

cat file1 file2 | sort -n | awk '{print $2}' | sed 's/@/ at /g' 

Answer 4

Một ví dụ mà nó rất hữu ích là với sự thay đổi nhỏ về vấn đề của bạn — thay vì trả lại cùng một đối tượng , bạn thiết kế đối tượng là không thay đổi. Sau đó, tất cả các chức năng của bạn sẽ trả lại một ví dụ mới cùng loại, nhưng với các thuộc tính đã được đặt một cách thích hợp.

Điều này có nhiều ứng dụng thực tế, đặc biệt là trong lĩnh vực lập trình hàm.

Answer 5

Trong JavaScript, điều này luôn luôn xuất hiện khi điều hướng DOM. Đặc biệt khi cố gắng lội theo cách của bạn thông qua một loạt các yếu tố không có id.

Ví dụ: có câu hỏi về SO liên quan đến finding the first element of a table. Nó có thể liên quan đến rất nhiều vòng lặp hoặc chuỗi lệnh.

Answer 6

Mặc dù nó không hoạt động giống như ví dụ của bạn (TBH Tôi chưa bao giờ thấy nó được thực hiện theo cách đó trước đây), jquery considers "chaining" to be very useful, và jquery là khá nhiều thước đo trong những ngày này khi nói đến khuôn khổ web JS. .. do đó, yeah :-)

Answer 7

Tất cả trẻ em đều yêu thích chuỗi. Tuy nhiên, theo kinh nghiệm của tôi, nó nên được sử dụng cẩn thận vì nó có thể làm giảm khả năng đọc mã. Nói cách khác, hãy làm những gì có ý nghĩa với bạn và có thể dễ dàng được hiểu bởi các lập trình viên khác, những người có một sự hiểu biết cơ bản về khái niệm này ..

Answer 8

Chuỗi JavaScript có thể rất hữu ích nếu bạn muốn tạo chuỗi hành động đơn lẻ vật. Tôi đồng ý với Michael Luton bên dưới, chuỗi phải được xử lý cẩn thận. Nếu bạn thêm một hoặc hai phương pháp xích vào một đối tượng vẫn có thể đọc được. Nếu bạn bắt đầu thêm bốn, năm, hoặc thậm chí chín, sau đó mã của bạn trở nên khó hơn không chỉ để đọc nhưng để duy trì.

Answer 9

Tôi đã tìm thấy câu hỏi này trong khi tìm kiếm giải pháp chung để tạo các phương thức có thể chuỗi, sau khi chúng được xác định. Đây là những gì tôi nghĩ ra.Tôi là một người mới sử dụng JavaScript; người mua hãy cẩn thận.

makeChainable = function() { 
    var receiver = arguments[0] 
    for (var i = 1; i < arguments.length; i++) { 
     functionName = arguments[i]; 
     (function() { 
      wrapped = receiver[functionName]; 
      receiver[functionName] = function() { 
       wrapped.apply(receiver, arguments); 
       return receiver; 
      } 
     })(); 
    } 
} 

daisy = { 
    name: 'Daisy', 
    moo: function() { console.log(this.name + " moos!") } 
} 

makeChainable(daisy, 'moo'); 
daisy.moo().moo().moo();