2016-09-07 35 views
7

Tôi mới sử dụng JavaScript và cố gắng tìm hiểu một số nguyên tắc cơ bản của OOP và mô phỏng "các lớp".

Khi thực thi dòng cuối cùng của tập lệnh này, tôi muốn con trỏ đối tượng được gọi là this trên dòng 4 để tham chiếu đến đối tượng farm (giống như chính xác trong dòng 2 và 3).Chức năng thay đổi biến "này"

Thật không may là không, và tôi đoán rằng con trỏ đối tượng this thay vì trỏ về phía document.

var Building = function(cost){ 
    this.cost = cost; 
    this.printCost = function(){ 
     document.getElementById(this).innerHTML = this.cost; 
    } 
} 

var farm = new Building (50); 

farm.printCost(); 

-

<html> 
<body> 
<p id="farm"> 
</p> 
</body> 
</html> 

Có cách nào để có được chức năng này để sử dụng đối tượng phải không? Nếu có bất kỳ lỗi nào trong sự hiểu biết của tôi, hãy cho tôi biết.

Tôi chưa quen với jQuery nên nếu bạn có thể dính vào cú pháp JavaScript cốt lõi, tôi sẽ đánh giá cao nó!

JSFiddle: https://jsfiddle.net/7n2of9k7/

+4

'getElementById (this)' sẽ không bao giờ làm việc bất kể –

+1

Tại sao không chỉ cần vượt qua 'farm' như là một chuỗi hoạt động? – Li357

+0

Chỉ cần chuyển nó thành một chuỗi: '... = hàm (chi phí, phần tử)' trong đó phần tử là phần tử chèn vào. – Li357

Trả lời

4

Theo như tôi biết, nhận được tên biến của dụ như là một chuỗi là không thể. Tôi cũng thực sự không thấy lý do tại sao bạn sẽ làm điều này vì nó khá không thực tế. Tôi sẽ chỉ vượt qua trong những yếu tố mà bạn muốn đưa vào như là một chuỗi:

var Building = function(cost, element){ 
 
    this.cost = cost; 
 
    this.printCost = function(){ 
 
     document.getElementById(element).innerHTML = this.cost; 
 
    } 
 
} 
 

 
var farm = new Building(50, 'farm'); 
 

 
farm.printCost();
<p id="farm"> 
 
</p>

này bây giờ chỉ cần vượt qua một ID vào chức năng nên nó chèn một cách chính xác. Bạn cũng có thể chuyển số này đến printCost.

+0

Ah, cảm ơn rất nhiều! Điều này hoạt động hoàn hảo và đã làm sáng tỏ rất nhiều rắc rối cho tôi! Tôi nghĩ rằng tôi đã cố gắng để tự động hóa _too_ nhiều. – Rilke

-4

Bạn phải gán này để thay đổi, và sử dụng nó trên của bạn ẩn danh

function 
    var Building = function(cost){ 
    this.cost = cost; 
    var currentObj = this; 
    this.printCost = function(){ 
     document.getElementById(this).innerHTML = currentObj.cost; 
    } 
} 

var farm = new Building (50); 

farm.printCost(); 
+2

Điều này hoàn toàn không hợp lệ. Tại sao có một từ khóa chức năng trước một khai báo biến? 'var Building = function (cost) {...}' là hoàn toàn hợp lệ. – Li357

2

"NÀY" bên trong một phương pháp hàm constructor luôn chỉ ra ví dụ về điều đó hàm xây dựng, trong trường hợp của bạn trại == này .Bạn đang đi qua các ví dụ toàn bộ đối tượng bên trong getElementById() method.Change phương pháp printCost của bạn để lấy tên của cá thể đối tượng khớp với này. Bạn cần phải lặp qua đối tượng cửa sổ sẽ có tất cả các biến được xác định trong phạm vi của nó. Vì vậy, đối tượng của bạn sẽ nhận được tên biến từ đối tượng cửa sổ khớp với tên của biến "farm". Sau đó, sử dụng nó trong getElementById(). check this answer for more detail

this.printCost = function(){ 
    for(var prop in window){ 
     if(window[prop]==this){ 
      document.getElementById(prop).innerHTML = this.cost; 
     } 
    } 

} 
+0

i có nghĩa là nó sẽ sau khi tạo ra các trường hợp ofcourse.That những gì op đang làm :) –

+0

Điều này dường như không hoạt động: https://jsfiddle.net/u2nxxg6d/ – Li357

+0

hoạt động cho tôi trong firefox, chrome và whatnot –

Các vấn đề liên quan