Javascript truy cập cha mẹ đối tượng thuộc tính

Question

Tôi có một vấn đề nhỏ trong JS, tôi có hai đối tượng lồng nhau, và tôi muốn truy cập vào một biến từ phụ huynh, như vậy:

var parent = { 
    a : 5, 

    child: { 
     b : 3, 
     displayA : function(){ 
      console.log(this.a); 
      //undefined 
      }, 

     displayB : function(){ 
      console.log(this.b); 
      //displays 3 
      } 
     } 
} 

Và tôi chỉ muốn biết cách làm cho công việc parent.child.displayA :) (Tôi có các đối tượng con cần truy cập vào biến của cha mẹ)

Bất kỳ trợ giúp nào được đánh giá cao Cảm ơn bạn rất nhiều!

Answer 1

Bạn có thể sử dụng call để thiết lập giá trị của this:

parent.child.displayA.call(parent); // 5 

Bạn cũng có thể quan tâm đến binding nó:

parent.child.displayA = function(){ 
    console.log(this.a); 
}.bind(parent); 
parent.child.displayA(); // 5 

Hoặc bạn bạn chỉ có thể sử dụng parent thay vì this:

parent.child.displayA = function(){ 
    console.log(parent.a); 
}; 
parent.child.displayA(); // 5 

Answer 2

Javascript là prototype based, đây không phải là ngôn ngữ OOP thông thường như PHP hoặc Java.

Hãy xem Inheritance and the prototype chain và triển khai một cái gì đó như Simple Javascript inheritance.

Bạn có thể truy cập vào phụ huynh thông qua window.parent nếu phạm vi đó nằm trong phạm vi toàn cầu, nhưng ví dụ của bạn sẽ không hoạt động trong mọi trường hợp.

Answer 3

Không có cách chung cho đối tượng child để biết rằng đó là thành viên của đối tượng mẹ. Trong trường hợp của bạn, bạn có thể tạo ra một tài liệu tham khảo trực tiếp đến đối tượng phụ huynh trong displayA(), như vậy:

displayA : function(){ 
    console.log(parent.a); 
} 

Bạn không cần phải đặt mẹ trong phạm vi toàn cầu và sử dụng window.parent như câu trả lời khác đề nghị; vì bạn đang khai báo displayA trong phạm vi parent, chức năng sẽ đóng trên parent và nó sẽ có thể truy cập ở mọi nơi trong phạm vi child. Vì việc đóng có chứa tham chiếu đến đối tượng parent, bạn sẽ thấy các thay đổi đối với parent sẽ được phản ánh trong hành vi của displayA. Ví dụ: giả sử parent và child được định nghĩa như trong ví dụ của bạn, ngoại trừ displayA được sửa đổi để sử dụng parent.a. Sau đó:

parent.child.displayA(); //=> 5 
parent.a = 10; 
parent.child.displayA(); //=> 10 

Tất cả điều này được nói, nếu bạn đang cố gắng để bắt chước OOP, thì câu trả lời khác là đúng: bạn nên đọc thêm về cách thức hoạt động của chuỗi nguyên mẫu Javascript.

Answer 4

Tôi nghĩ rằng nó không thực sự làm cho sence để làm điều đó như thế vì bạn có thể truy cập đối tượng con chỉ thông qua cha mẹ của nó. vậy tại sao thêm một mthod displayB cho đứa trẻ trong khi bạn có thể thêm nó vào cha mẹ có quyền truy cập vào tất cả các thuộc tính con.

Answer 5

Trong ví dụ của bạn, bạn không kế thừa. Bạn có thể làm điều này

... 
    displayA : function(){ 
     console.log(parent.a); 
     // 5 
    }, 
... 
parent.child.parent = parent; 
parent.child.displayA(); 

Answer 6

Bạn có thể sử dụng super.prop để truy cập các thuộc tính lớp cha. Tất nhiên, chỉ khi bạn đang sử dụng ES6.