Hướng dẫn how do you link objects in javascript? - làm thế nào để bạn liên kết các đối tượng trong javascript?


The Link object represents an HTML element.

You can access a element by using getElementById():

You can create a element by using the document.createElement() method:

PropertyDescription
charset Not supported in HTML5.
Sets or returns the character encoding of the linked document
crossOrigin Sets or returns the the CORS settings of the linked document
disabled Sets or returns whether the linked document is disabled, or not
href Sets or returns the URL of the linked document
hreflang Sets or returns the language code of the linked document
media Sets or returns the media type for the link element
rel Sets or returns the relationship between the current document and the linked document
rev Not supported in HTML5.
Sets or returns the reverse relationship from the linked document to the current document
sizes Returns the value of the sizes attribute of the linked resource
type Sets or returns the content type of the linked document

Standard Properties and Events

The Link object also supports the standard properties and events.


HTML reference: HTML tag



Tôi đang trải qua một số hành vi đối tượng thực sự kỳ lạ vào lúc này. Tôi có đối tượng mẫu này:

template: {
        trigger: {
            width: 32,
            height: 32,
            delay: 0
        },

        player: {
            direction: {
                value: "right",
                options: "left|right"
            }
        },

        apple: {
            direction: {
                value: "down",
                options: "up|down|left|right"
            }
        }
},

đó là một đối tượng của một đối tượng gọi là layers. Bên trong một hàm trong đối tượng layers Tôi thêm dữ liệu mới (thực thể) vào đối tượng entities trống.

if (!this.entities[which])
{ this.entities[which] = []; }

if (!this.entities[which][id])
{ this.entities[which][id] = {}; }

this.entities[which][id].pos = "0,0";
this.entities[which][id].variables = {};
this.entities[which][id].variables = this.template[which];

Vì vậy, sau này khi tôi đang cố gắng thay đổi this.entities[which][id].variables.width chẳng hạn, mọi quyền sở hữu cùng một mẫu cho which đều có cùng các thuộc tính cũng như đối tượng mẫu sẽ không được thay đổi ở bất cứ đâu trong mã. Tôi đã gỡ lỗi hầu hết mọi thứ và trải qua từng bit của mã. ID quyền lợi cũng là duy nhất.

Phần mà đối tượng bị thay đổi trông như thế này: input.setAttribute("onkeyup", "layers.entities['" + i + "'][" + j + "].variables['" + jj + "'] = this.value; layers.updateEntities();");

Trong đó tôi là tên của quyền lợi, J là ID và JJ tên tùy chọn.

Bạn có thể thử nó cho chính mình ngay tại đây: [Đã xóa]

Chuyển sang lớp thực thể, thêm hai bộ kích hoạt, kéo một cái xung quanh, bấm nó và thay đổi một trong các thuộc tính. Cả hai sẽ thay đổi mặc dù họ có ID khác nhau. Ngoài ra những cái mới sẽ có các thuộc tính này.

Bởi vì bản thân mẫu được thay đổi, tôi nghĩ rằng this.entities[which][id].variables = this.template[which]; này bằng cách nào đó liên kết hai đối tượng đó với nhau thay vì gán "bản sao" cho biến tay trái. Tôi chưa bao giờ nghe nói về bất cứ điều gì như vậy mặc dù.

Giới thiệu về các nguyên mẫu đối tượng và cách sử dụng Phái đoàn nguyên mẫu

Ảnh của JJ Ying trên unplash

Một trong những điều mà các nhà phát triển phần mềm nghĩ về rất nhiều là làm thế nào để làm khô (hãy lặp lại bản thân) mã của họ. Lý do cho điều này là tương đối đơn giản. Bạn càng có thể sử dụng lại mã của mình, cơ sở mã của bạn càng dễ dàng duy trì. Nếu bạn có hai đối tượng chia sẻ hành vi, tại sao xác định hành vi đó ở hai nơi? Và nếu bạn làm, điều gì xảy ra nếu bạn cần thay đổi một cái gì đó sau này? Đột nhiên bạn phải đi tìm kiếm cơ sở mã của mình cho mọi nơi mà một hành vi nhất định được xác định. Vì vậy, mã khô là một điều tốt - nhưng làm thế nào để bạn làm điều đó? Một câu trả lời phổ biến là sử dụng các lớp và kế thừa, nhưng chờ một phút, JavaScript thậm chí có các lớp và kế thừa không? Chà, không, nó không có, nhưng nó có một cái gì đó tốt như vậy - phái đoàn nguyên mẫu.

Thừa kế cổ điển

Bạn thực sự có thể thấy các thuật ngữ của lớp học, và người thừa kế, được sử dụng liên quan đến JavaScript, nhưng điều quan trọng là phải hiểu rằng các thuật ngữ đó chỉ được sử dụng để thuận tiện. JavaScript không có các lớp theo nghĩa của một ngôn ngữ dựa trên lớp thực sự (ví dụ như Ruby), cũng không có sự kế thừa cổ điển. Don Tiết cho phép từ khóa ES6

if (!this.entities[which])
{ this.entities[which] = []; }

if (!this.entities[which][id])
{ this.entities[which][id] = {}; }

this.entities[which][id].pos = "0,0";
this.entities[which][id].variables = {};
this.entities[which][id].variables = this.template[which];
0 làm bạn bối rối, nó thực sự chỉ là đường cú pháp được xây dựng trên đỉnh của mẫu tạo đối tượng cấu trúc phổ biến trong JavaScript (nghĩa là một hàm được gọi với từ khóa
if (!this.entities[which])
{ this.entities[which] = []; }

if (!this.entities[which][id])
{ this.entities[which][id] = {}; }

this.entities[which][id].pos = "0,0";
this.entities[which][id].variables = {};
this.entities[which][id].variables = this.template[which];
1 trả về một đối tượng). Trong một ngôn ngữ dựa trên lớp thực sự, bạn có thể có một cái gì đó trông giống như sau:

class House {
constructor(owner, rooms) {
self.owner = owner
self.rooms = rooms
}

ringDoorbell() {
log "ding dong!"
}

describe() {
log self.owner + "'s house has " + self.rooms + " rooms."
}
}

bobHouse = new House("Bob Belcher", 4)bobHouse.describe() // "Bob Belcher's house has 4 rooms."

Trên đây không phải là mã thực, mà là, một xấp xỉ thô về cách viết nhiều ngôn ngữ dựa trên lớp. Trong ví dụ này, chúng tôi đã xác định một lớp

if (!this.entities[which])
{ this.entities[which] = []; }

if (!this.entities[which][id])
{ this.entities[which][id] = {}; }

this.entities[which][id].pos = "0,0";
this.entities[which][id].variables = {};
this.entities[which][id].variables = this.template[which];
2, có hàm tạo và hai phương thức. Khi khởi tạo, hàm tạo gán hai thuộc tính cho các đối tượng mới của lớp
if (!this.entities[which])
{ this.entities[which] = []; }

if (!this.entities[which][id])
{ this.entities[which][id] = {}; }

this.entities[which][id].pos = "0,0";
this.entities[which][id].variables = {};
this.entities[which][id].variables = this.template[which];
2. Mỗi đối tượng
if (!this.entities[which])
{ this.entities[which] = []; }

if (!this.entities[which][id])
{ this.entities[which][id] = {}; }

this.entities[which][id].pos = "0,0";
this.entities[which][id].variables = {};
this.entities[which][id].variables = this.template[which];
2 mới cũng được truy cập vào các phương thức cá thể
if (!this.entities[which])
{ this.entities[which] = []; }

if (!this.entities[which][id])
{ this.entities[which][id] = {}; }

this.entities[which][id].pos = "0,0";
this.entities[which][id].variables = {};
this.entities[which][id].variables = this.template[which];
5 và
if (!this.entities[which])
{ this.entities[which] = []; }

if (!this.entities[which][id])
{ this.entities[which][id] = {}; }

this.entities[which][id].pos = "0,0";
this.entities[which][id].variables = {};
this.entities[which][id].variables = this.template[which];
6. Nếu chúng ta tạo ra mười ngôi nhà, tất cả chúng sẽ có thể tận dụng các phương pháp này.

Các ngôn ngữ dựa trên lớp rất mạnh mẽ vì bạn có thể sử dụng kế thừa để tạo ra các lớp con chia sẻ một số hành vi với lớp cha mẹ của họ, nhưng cũng có thể xác định hành vi của chính họ. Trong trường hợp một lớp trẻ em cụ thể cần ghi đè hành vi được xác định trên lớp cha mẹ của họ, họ có thể làm như vậy bằng cách sử dụng những gì được gọi là đa hình. Đây là khi một phương pháp cụ thể có thể được xác định lại trên các lớp con với một số hành vi mới. Trong ví dụ của chúng tôi, chúng tôi có thể làm một cái gì đó như xác định một lớp con của

if (!this.entities[which])
{ this.entities[which] = []; }

if (!this.entities[which][id])
{ this.entities[which][id] = {}; }

this.entities[which][id].pos = "0,0";
this.entities[which][id].variables = {};
this.entities[which][id].variables = this.template[which];
2 như thế này:
if (!this.entities[which])
{ this.entities[which] = []; }

if (!this.entities[which][id])
{ this.entities[which][id] = {}; }

this.entities[which][id].pos = "0,0";
this.entities[which][id].variables = {};
this.entities[which][id].variables = this.template[which];
8. Bên trong lớp con
if (!this.entities[which])
{ this.entities[which] = []; }

if (!this.entities[which][id])
{ this.entities[which][id] = {}; }

this.entities[which][id].pos = "0,0";
this.entities[which][id].variables = {};
this.entities[which][id].variables = this.template[which];
9 mới của chúng tôi, sau đó chúng tôi có thể xác định lại một số hành vi
if (!this.entities[which])
{ this.entities[which] = []; }

if (!this.entities[which][id])
{ this.entities[which][id] = {}; }

this.entities[which][id].pos = "0,0";
this.entities[which][id].variables = {};
this.entities[which][id].variables = this.template[which];
2 hoặc thậm chí thêm các hành vi mới.

Vì vậy, chúng tôi biết các lớp là gì và cách họ sử dụng kế thừa, nhưng điều đó có ý nghĩa gì với mã JavaScript của chúng tôi nếu JavaScript không có các lớp thực? Vâng, hiểu các lớp học và kế thừa cổ điển sẽ giúp chúng tôi xác định mô hình tinh thần của chúng tôi cho hành vi JavaScript. Bây giờ chúng ta có một ý tưởng về loại hành vi mà chúng ta muốn tạo ra (chia sẻ giống như hành vi giữa các đối tượng tương tự), bây giờ chúng ta chỉ cần xem cách thực hiện nó trong JavaScript. Câu trả lời là một cái gì đó được gọi là phái đoàn nguyên mẫu.

Phái đoàn nguyên mẫu

Trong JavaScript, mọi đối tượng đều có những gì được gọi là đối tượng nguyên mẫu. Hãy nghĩ về mối quan hệ này như liên kết trong một chuỗi. Khi một đối tượng cần truy cập vào một số hành vi, nó không giới hạn chỉ trong các phương thức đó được xác định chính thức là một trong những thuộc tính của riêng nó - nó cũng có thể yêu cầu các đối tượng tiếp tục lên chuỗi để được trợ giúp. Xem xét những điều sau:

Ở đây chúng tôi có một đối tượng trống, được gọi là

class House {
constructor(owner, rooms) {
self.owner = owner
self.rooms = rooms
}

ringDoorbell() {
log "ding dong!"
}

describe() {
log self.owner + "'s house has " + self.rooms + " rooms."
}
}

bobHouse = new House("Bob Belcher", 4)bobHouse.describe() // "Bob Belcher's house has 4 rooms."
1, không có thuộc tính được xác định trên đó. Tuy nhiên, khi chúng tôi gọi
class House {
constructor(owner, rooms) {
self.owner = owner
self.rooms = rooms
}

ringDoorbell() {
log "ding dong!"
}

describe() {
log self.owner + "'s house has " + self.rooms + " rooms."
}
}

bobHouse = new House("Bob Belcher", 4)bobHouse.describe() // "Bob Belcher's house has 4 rooms."
2, chúng tôi sẽ nhận được đầu ra là
class House {
constructor(owner, rooms) {
self.owner = owner
self.rooms = rooms
}

ringDoorbell() {
log "ding dong!"
}

describe() {
log self.owner + "'s house has " + self.rooms + " rooms."
}
}

bobHouse = new House("Bob Belcher", 4)bobHouse.describe() // "Bob Belcher's house has 4 rooms."
3. Điều đó đã xảy ra như thế nào? Giống như mọi đối tượng khác, đối tượng trống
class House {
constructor(owner, rooms) {
self.owner = owner
self.rooms = rooms
}

ringDoorbell() {
log "ding dong!"
}

describe() {
log self.owner + "'s house has " + self.rooms + " rooms."
}
}

bobHouse = new House("Bob Belcher", 4)bobHouse.describe() // "Bob Belcher's house has 4 rooms."
1 của chúng tôi có liên kết đến một nguyên mẫu - trong trường hợp này là đối tượng
class House {
constructor(owner, rooms) {
self.owner = owner
self.rooms = rooms
}

ringDoorbell() {
log "ding dong!"
}

describe() {
log self.owner + "'s house has " + self.rooms + " rooms."
}
}

bobHouse = new House("Bob Belcher", 4)bobHouse.describe() // "Bob Belcher's house has 4 rooms."
5 mặc định. Đối tượng nguyên mẫu này có một phương thức tích hợp được xác định trên nó được gọi là
class House {
constructor(owner, rooms) {
self.owner = owner
self.rooms = rooms
}

ringDoorbell() {
log "ding dong!"
}

describe() {
log self.owner + "'s house has " + self.rooms + " rooms."
}
}

bobHouse = new House("Bob Belcher", 4)bobHouse.describe() // "Bob Belcher's house has 4 rooms."
6 và khi chúng tôi cố gắng gọi phương thức đó vào
class House {
constructor(owner, rooms) {
self.owner = owner
self.rooms = rooms
}

ringDoorbell() {
log "ding dong!"
}

describe() {
log self.owner + "'s house has " + self.rooms + " rooms."
}
}

bobHouse = new House("Bob Belcher", 4)bobHouse.describe() // "Bob Belcher's house has 4 rooms."
1,
class House {
constructor(owner, rooms) {
self.owner = owner
self.rooms = rooms
}

ringDoorbell() {
log "ding dong!"
}

describe() {
log self.owner + "'s house has " + self.rooms + " rooms."
}
}

bobHouse = new House("Bob Belcher", 4)bobHouse.describe() // "Bob Belcher's house has 4 rooms."
1 tìm kiếm một thuộc tính theo định nghĩa của chính nó, phát hiện ra không có, và sau đó đi lên nguyên mẫu chuỗi để tiếp tục tìm kiếm.

Hãy cùng xem đối tượng nguyên mẫu bí ẩn này bằng cách sử dụng phương pháp tích hợp

class House {
constructor(owner, rooms) {
self.owner = owner
self.rooms = rooms
}

ringDoorbell() {
log "ding dong!"
}

describe() {
log self.owner + "'s house has " + self.rooms + " rooms."
}
}

bobHouse = new House("Bob Belcher", 4)bobHouse.describe() // "Bob Belcher's house has 4 rooms."
9:

Bây giờ chúng tôi đang nhận được một số cái nhìn sâu sắc về nơi

class House {
constructor(owner, rooms) {
self.owner = owner
self.rooms = rooms
}

ringDoorbell() {
log "ding dong!"
}

describe() {
log self.owner + "'s house has " + self.rooms + " rooms."
}
}

bobHouse = new House("Bob Belcher", 4)bobHouse.describe() // "Bob Belcher's house has 4 rooms."
1 đã đi tìm phương pháp
class House {
constructor(owner, rooms) {
self.owner = owner
self.rooms = rooms
}

ringDoorbell() {
log "ding dong!"
}

describe() {
log self.owner + "'s house has " + self.rooms + " rooms."
}
}

bobHouse = new House("Bob Belcher", 4)bobHouse.describe() // "Bob Belcher's house has 4 rooms."
6. layers2 Trả về nguyên mẫu ____ 21 và chúng ta có thể thấy rằng nó thực sự có một phương thức
class House {
constructor(owner, rooms) {
self.owner = owner
self.rooms = rooms
}

ringDoorbell() {
log "ding dong!"
}

describe() {
log self.owner + "'s house has " + self.rooms + " rooms."
}
}

bobHouse = new House("Bob Belcher", 4)bobHouse.describe() // "Bob Belcher's house has 4 rooms."
6 được xác định trên nó. Đây là phái đoàn nguyên mẫu trong hành động. Đối tượng
class House {
constructor(owner, rooms) {
self.owner = owner
self.rooms = rooms
}

ringDoorbell() {
log "ding dong!"
}

describe() {
log self.owner + "'s house has " + self.rooms + " rooms."
}
}

bobHouse = new House("Bob Belcher", 4)bobHouse.describe() // "Bob Belcher's house has 4 rooms."
1 đơn giản của chúng tôi đã ủy thác hành vi
class House {
constructor(owner, rooms) {
self.owner = owner
self.rooms = rooms
}

ringDoorbell() {
log "ding dong!"
}

describe() {
log self.owner + "'s house has " + self.rooms + " rooms."
}
}

bobHouse = new House("Bob Belcher", 4)bobHouse.describe() // "Bob Belcher's house has 4 rooms."
6 cho nguyên mẫu của nó. Lưu ý làm thế nào điều này khác với kế thừa.
class House {
constructor(owner, rooms) {
self.owner = owner
self.rooms = rooms
}

ringDoorbell() {
log "ding dong!"
}

describe() {
log self.owner + "'s house has " + self.rooms + " rooms."
}
}

bobHouse = new House("Bob Belcher", 4)bobHouse.describe() // "Bob Belcher's house has 4 rooms."
1 không có phương pháp
class House {
constructor(owner, rooms) {
self.owner = owner
self.rooms = rooms
}

ringDoorbell() {
log "ding dong!"
}

describe() {
log self.owner + "'s house has " + self.rooms + " rooms."
}
}

bobHouse = new House("Bob Belcher", 4)bobHouse.describe() // "Bob Belcher's house has 4 rooms."
6 của riêng mình, nó dựa vào nguyên mẫu của nó để xác định hành vi đó. Tất nhiên, Object, don don phải dựa vào các đối tượng khác lên chuỗi nguyên mẫu của họ, cũng không phải là mãi mãi bị mắc kẹt với việc thực hiện một số hành vi lên chuỗi đó. Nếu chúng tôi muốn, chúng tôi có thể xác định lại hành vi
class House {
constructor(owner, rooms) {
self.owner = owner
self.rooms = rooms
}

ringDoorbell() {
log "ding dong!"
}

describe() {
log self.owner + "'s house has " + self.rooms + " rooms."
}
}

bobHouse = new House("Bob Belcher", 4)bobHouse.describe() // "Bob Belcher's house has 4 rooms."
6 trực tiếp trên
class House {
constructor(owner, rooms) {
self.owner = owner
self.rooms = rooms
}

ringDoorbell() {
log "ding dong!"
}

describe() {
log self.owner + "'s house has " + self.rooms + " rooms."
}
}

bobHouse = new House("Bob Belcher", 4)bobHouse.describe() // "Bob Belcher's house has 4 rooms."
1 và nhận được kết quả mới:

Trong ví dụ này, chúng tôi đã xác định một hành vi

class House {
constructor(owner, rooms) {
self.owner = owner
self.rooms = rooms
}

ringDoorbell() {
log "ding dong!"
}

describe() {
log self.owner + "'s house has " + self.rooms + " rooms."
}
}

bobHouse = new House("Bob Belcher", 4)bobHouse.describe() // "Bob Belcher's house has 4 rooms."
6 mới trên
class House {
constructor(owner, rooms) {
self.owner = owner
self.rooms = rooms
}

ringDoorbell() {
log "ding dong!"
}

describe() {
log self.owner + "'s house has " + self.rooms + " rooms."
}
}

bobHouse = new House("Bob Belcher", 4)bobHouse.describe() // "Bob Belcher's house has 4 rooms."
1 và khi chúng tôi sau đó gọi
class House {
constructor(owner, rooms) {
self.owner = owner
self.rooms = rooms
}

ringDoorbell() {
log "ding dong!"
}

describe() {
log self.owner + "'s house has " + self.rooms + " rooms."
}
}

bobHouse = new House("Bob Belcher", 4)bobHouse.describe() // "Bob Belcher's house has 4 rooms."
6 trên đó,
class House {
constructor(owner, rooms) {
self.owner = owner
self.rooms = rooms
}

ringDoorbell() {
log "ding dong!"
}

describe() {
log self.owner + "'s house has " + self.rooms + " rooms."
}
}

bobHouse = new House("Bob Belcher", 4)bobHouse.describe() // "Bob Belcher's house has 4 rooms."
1 đã tìm thấy một phương thức bằng tên đó trong số các thuộc tính của chính nó và do đó không cần phải ủy thác hành vi của nó.

Liên kết các đối tượng

Bây giờ chúng ta đã biết cách thức của phái đoàn nguyên mẫu hoạt động, hãy để khám phá cách chúng ta có thể sử dụng nó để lợi thế của mình. Đầu tiên, chúng tôi sẽ xác định một đối tượng với một tập hợp các hành vi mà chúng tôi mong đợi chúng tôi sẽ cần một cách thường xuyên. Chúng tôi sẽ lưu trữ đối tượng này trong một biến có tên được viết hoa (điều này không cần thiết, nhưng nó là một quy ước hữu ích). Tiếp theo, chúng tôi sẽ tạo một đối tượng mới và sử dụng layers5 để liên kết đối tượng mới của chúng tôi trở lại đối tượng đầu tiên của chúng tôi. Bằng cách này, chúng tôi đang xây dựng chuỗi nguyên mẫu theo cách thủ công để chúng tôi có thể chắc chắn rằng các đối tượng cấp thấp hơn có thể ủy thác hành vi lên đến các đối tượng cấp cao hơn. Hãy nhìn vào một ví dụ:

Ở đây, chúng ta có một đối tượng

if (!this.entities[which])
{ this.entities[which] = []; }

if (!this.entities[which][id])
{ this.entities[which][id] = {}; }

this.entities[which][id].pos = "0,0";
this.entities[which][id].variables = {};
this.entities[which][id].variables = this.template[which];
2 xác định các phương thức
if (!this.entities[which])
{ this.entities[which] = []; }

if (!this.entities[which][id])
{ this.entities[which][id] = {}; }

this.entities[which][id].pos = "0,0";
this.entities[which][id].variables = {};
this.entities[which][id].variables = this.template[which];
5 và
if (!this.entities[which])
{ this.entities[which] = []; }

if (!this.entities[which][id])
{ this.entities[which][id] = {}; }

this.entities[which][id].pos = "0,0";
this.entities[which][id].variables = {};
this.entities[which][id].variables = this.template[which];
6. Sau đó, chúng tôi tạo một biến, layers9 và đặt nguyên mẫu của nó là
if (!this.entities[which])
{ this.entities[which] = []; }

if (!this.entities[which][id])
{ this.entities[which][id] = {}; }

this.entities[which][id].pos = "0,0";
this.entities[which][id].variables = {};
this.entities[which][id].variables = this.template[which];
2. Chúng ta có thể thấy mối quan hệ này bằng cách sử dụng
class House {
constructor(owner, rooms) {
self.owner = owner
self.rooms = rooms
}

ringDoorbell() {
log "ding dong!"
}

describe() {
log self.owner + "'s house has " + self.rooms + " rooms."
}
}

bobHouse = new House("Bob Belcher", 4)bobHouse.describe() // "Bob Belcher's house has 4 rooms."
9, cho thấy rõ rằng
if (!this.entities[which])
{ this.entities[which] = []; }

if (!this.entities[which][id])
{ this.entities[which][id] = {}; }

this.entities[which][id].pos = "0,0";
this.entities[which][id].variables = {};
this.entities[which][id].variables = this.template[which];
2 là nguyên mẫu cấp đầu tiên cho layers9. Bây giờ, layers9 có thể ủy thác hành vi lên chuỗi của nó cho các phương thức được xác định trên
if (!this.entities[which])
{ this.entities[which] = []; }

if (!this.entities[which][id])
{ this.entities[which][id] = {}; }

this.entities[which][id].pos = "0,0";
this.entities[which][id].variables = {};
this.entities[which][id].variables = this.template[which];
2. Chúng tôi thực hiện điều này trên dòng 21 khi chúng tôi sử dụng phương thức gọi
if (!this.entities[which])
{ this.entities[which] = []; }

if (!this.entities[which][id])
{ this.entities[which][id] = {}; }

this.entities[which][id].pos = "0,0";
this.entities[which][id].variables = {};
this.entities[which][id].variables = this.template[which];
6 trên layers9. Tất nhiên, đầu ra không đúng vì
if (!this.entities[which])
{ this.entities[which] = []; }

if (!this.entities[which][id])
{ this.entities[which][id] = {}; }

this.entities[which][id].pos = "0,0";
this.entities[which][id].variables = {};
this.entities[which][id].variables = this.template[which];
6 dựa vào đối tượng gọi của nó có quyền truy cập vào các thuộc tính được gọi là entities9 và this.entities[which][id].variables.width0. Khi chúng tôi đặt các thuộc tính này trên layers9, chúng tôi thấy rằng các chức năng
if (!this.entities[which])
{ this.entities[which] = []; }

if (!this.entities[which][id])
{ this.entities[which][id] = {}; }

this.entities[which][id].pos = "0,0";
this.entities[which][id].variables = {};
this.entities[which][id].variables = this.template[which];
6 như dự định.

Tất cả điều này có thể có một chút khó hiểu. Trong ví dụ này, chỉ có hai đối tượng trong chuỗi nguyên mẫu của ____ 49 (

if (!this.entities[which])
{ this.entities[which] = []; }

if (!this.entities[which][id])
{ this.entities[which][id] = {}; }

this.entities[which][id].pos = "0,0";
this.entities[which][id].variables = {};
this.entities[which][id].variables = this.template[which];
2 ở cấp độ đầu tiên và
class House {
constructor(owner, rooms) {
self.owner = owner
self.rooms = rooms
}

ringDoorbell() {
log "ding dong!"
}

describe() {
log self.owner + "'s house has " + self.rooms + " rooms."
}
}

bobHouse = new House("Bob Belcher", 4)bobHouse.describe() // "Bob Belcher's house has 4 rooms."
5 ở cấp độ trên đó.) Nhưng hãy tưởng tượng một chuỗi nguyên mẫu dài hơn - làm thế nào bạn biết liệu một đối tượng có sử dụng một số hành vi được xác định trong riêng của nó thuộc tính hoặc ủy thác hành vi đó lên chuỗi? Rất may, chúng tôi có thể kiểm tra chính xác rằng sử dụng các phương thức tích hợp this.entities[which][id].variables.width6 (bạn có thể nhận thấy phương pháp này sớm hơn khi chúng tôi thấy nó được xác định trên đối tượng
class House {
constructor(owner, rooms) {
self.owner = owner
self.rooms = rooms
}

ringDoorbell() {
log "ding dong!"
}

describe() {
log self.owner + "'s house has " + self.rooms + " rooms."
}
}

bobHouse = new House("Bob Belcher", 4)bobHouse.describe() // "Bob Belcher's house has 4 rooms."
5) và this.entities[which][id].variables.width8. Xem xét những điều sau:

Trong ví dụ này, chúng tôi sử dụng this.entities[which][id].variables.width8 trên dòng 17 để trả về một mảng các thuộc tính được xác định trực tiếp trên layers9. Chúng ta có thể thấy rằng một trong số đó là this.entities[which][id].variables.width0, mà sau đó chúng ta xác nhận trên dòng 20 khi chúng ta kiểm tra xem layers9 có tài sản riêng được gọi là this.entities[which][id].variables.width0 hay không. Trên dòng 23, chúng tôi thấy rằng layers9 không có tài sản riêng được gọi là

if (!this.entities[which])
{ this.entities[which] = []; }

if (!this.entities[which][id])
{ this.entities[which][id] = {}; }

this.entities[which][id].pos = "0,0";
this.entities[which][id].variables = {};
this.entities[which][id].variables = this.template[which];
5, nhưng nó vẫn có quyền truy cập vào một hành vi như vậy nhờ nguyên mẫu của nó,
if (!this.entities[which])
{ this.entities[which] = []; }

if (!this.entities[which][id])
{ this.entities[which][id] = {}; }

this.entities[which][id].pos = "0,0";
this.entities[which][id].variables = {};
this.entities[which][id].variables = this.template[which];
2, trên dòng 26 mà chúng ta thấy có thuộc tính riêng của nó.

Phái đoàn nguyên mẫu là một cách mạnh mẽ để xác định hành vi ở một nơi và sau đó sử dụng nó ở nhiều nơi khác. Nếu chúng tôi muốn, chúng tôi có thể tạo ra một ngàn ngôi nhà, sử dụng

if (!this.entities[which])
{ this.entities[which] = []; }

if (!this.entities[which][id])
{ this.entities[which][id] = {}; }

this.entities[which][id].pos = "0,0";
this.entities[which][id].variables = {};
this.entities[which][id].variables = this.template[which];
2 cho nguyên mẫu của mỗi ngôi nhà, và tất cả họ sẽ có quyền truy cập vào các hành vi được xác định trên
if (!this.entities[which])
{ this.entities[which] = []; }

if (!this.entities[which][id])
{ this.entities[which][id] = {}; }

this.entities[which][id].pos = "0,0";
this.entities[which][id].variables = {};
this.entities[which][id].variables = this.template[which];
2. Và điều gì sẽ xảy ra nếu sau này chúng tôi quyết định rằng những ngôi nhà nên có nhà để xe và có thể mở chúng? Không vấn đề gì. Chúng tôi chỉ có thể thêm một phương thức mới vào
if (!this.entities[which])
{ this.entities[which] = []; }

if (!this.entities[which][id])
{ this.entities[which][id] = {}; }

this.entities[which][id].pos = "0,0";
this.entities[which][id].variables = {};
this.entities[which][id].variables = this.template[which];
2, được gọi là input.setAttribute("onkeyup", "layers.entities['" + i + "'][" + j + "].variables['" + jj + "'] = this.value; layers.updateEntities();");0 và mọi ngôi nhà riêng lẻ được liên kết với đối tượng
if (!this.entities[which])
{ this.entities[which] = []; }

if (!this.entities[which][id])
{ this.entities[which][id] = {}; }

this.entities[which][id].pos = "0,0";
this.entities[which][id].variables = {};
this.entities[which][id].variables = this.template[which];
2 sẽ có quyền truy cập vào hành vi đó.

Nhiều liên kết trong chuỗi

Trước đó chúng tôi đã nói rằng một trong những lợi thế của thừa kế cổ điển là khả năng tạo ra các lớp con. Trong JavaScript, chúng tôi không tạo ra các lớp con nhưng chúng tôi vẫn có thể tận dụng phái đoàn nguyên mẫu để đạt được kết quả tương tự. Chúng tôi làm điều này bằng cách tạo nhiều liên kết trong chuỗi nguyên mẫu. Hãy để thử nó ra.

Giống như trước đây, chúng ta có một đối tượng

if (!this.entities[which])
{ this.entities[which] = []; }

if (!this.entities[which][id])
{ this.entities[which][id] = {}; }

this.entities[which][id].pos = "0,0";
this.entities[which][id].variables = {};
this.entities[which][id].variables = this.template[which];
2, nhưng bây giờ chúng ta muốn tạo ra những thứ trên, chúng ta sẽ nói, một thang đo lớn hơn. Bây giờ, chúng tôi cũng muốn làm lâu đài. Đầu tiên, chúng tôi xác định một đối tượng
if (!this.entities[which])
{ this.entities[which] = []; }

if (!this.entities[which][id])
{ this.entities[which][id] = {}; }

this.entities[which][id].pos = "0,0";
this.entities[which][id].variables = {};
this.entities[which][id].variables = this.template[which];
9 và đặt
if (!this.entities[which])
{ this.entities[which] = []; }

if (!this.entities[which][id])
{ this.entities[which][id] = {}; }

this.entities[which][id].pos = "0,0";
this.entities[which][id].variables = {};
this.entities[which][id].variables = this.template[which];
2 làm nguyên mẫu của nó. Nhưng các lâu đài và nhà ở aren chính xác giống nhau, vì vậy có lẽ chúng ta không nên mô tả chúng theo cùng một cách. Để khắc phục điều này, chúng tôi chỉ cần xác định một phiên bản mới của hành vi
if (!this.entities[which])
{ this.entities[which] = []; }

if (!this.entities[which][id])
{ this.entities[which][id] = {}; }

this.entities[which][id].pos = "0,0";
this.entities[which][id].variables = {};
this.entities[which][id].variables = this.template[which];
6 trên đối tượng
if (!this.entities[which])
{ this.entities[which] = []; }

if (!this.entities[which][id])
{ this.entities[which][id] = {}; }

this.entities[which][id].pos = "0,0";
this.entities[which][id].variables = {};
this.entities[which][id].variables = this.template[which];
9. Cuối cùng, chúng tôi tạo ra một lâu đài riêng lẻ gọi là input.setAttribute("onkeyup", "layers.entities['" + i + "'][" + j + "].variables['" + jj + "'] = this.value; layers.updateEntities();");7 và đặt
if (!this.entities[which])
{ this.entities[which] = []; }

if (!this.entities[which][id])
{ this.entities[which][id] = {}; }

this.entities[which][id].pos = "0,0";
this.entities[which][id].variables = {};
this.entities[which][id].variables = this.template[which];
9 làm nguyên mẫu của nó. Như bạn có thể thấy, khi chúng ta gọi
if (!this.entities[which])
{ this.entities[which] = []; }

if (!this.entities[which][id])
{ this.entities[which][id] = {}; }

this.entities[which][id].pos = "0,0";
this.entities[which][id].variables = {};
this.entities[which][id].variables = this.template[which];
6 trên input.setAttribute("onkeyup", "layers.entities['" + i + "'][" + j + "].variables['" + jj + "'] = this.value; layers.updateEntities();");7, nó sử dụng hành vi này bằng tên đó được xác định trên
if (!this.entities[which])
{ this.entities[which] = []; }

if (!this.entities[which][id])
{ this.entities[which][id] = {}; }

this.entities[which][id].pos = "0,0";
this.entities[which][id].variables = {};
this.entities[which][id].variables = this.template[which];
9 thay vì định nghĩa trên
if (!this.entities[which])
{ this.entities[which] = []; }

if (!this.entities[which][id])
{ this.entities[which][id] = {}; }

this.entities[which][id].pos = "0,0";
this.entities[which][id].variables = {};
this.entities[which][id].variables = this.template[which];
2. Điều này là do khi JavaScript tìm kiếm chuỗi nguyên mẫu cho một hành vi, nó dừng lại ngay khi tìm thấy một thứ có tên đúng. Tất nhiên, việc chèn các liên kết giữa hai đối tượng không ngăn cản các đối tượng thấp nhất sử dụng các hành vi trên các đối tượng cấp cao hơn, đó là lý do tại sao input.setAttribute("onkeyup", "layers.entities['" + i + "'][" + j + "].variables['" + jj + "'] = this.value; layers.updateEntities();");7 vẫn có quyền truy cập vào
if (!this.entities[which])
{ this.entities[which] = []; }

if (!this.entities[which][id])
{ this.entities[which][id] = {}; }

this.entities[which][id].pos = "0,0";
this.entities[which][id].variables = {};
this.entities[which][id].variables = this.template[which];
5, được xác định trở lại trên
if (!this.entities[which])
{ this.entities[which] = []; }

if (!this.entities[which][id])
{ this.entities[which][id] = {}; }

this.entities[which][id].pos = "0,0";
this.entities[which][id].variables = {};
this.entities[which][id].variables = this.template[which];
2.

Để minh họa chuỗi hoạt động, hãy để xem liệu chúng ta có thể truy cập từng đối tượng dọc theo nó và xem các thuộc tính của nó không. Chúng ta có thể làm điều này bằng cách sử dụng một hàm đệ quy ngắn sẽ thu thập dữ liệu chuỗi nguyên mẫu của đối tượng nhất định và ghi nhật ký các thuộc tính được xác định trên mỗi liên kết. Hàm đệ quy ngừng tự gọi ngay khi nó gặp giá trị this.entities[which][id].variables = this.template[which];6, đó là những gì bạn nhận được khi bạn cố gắng nhìn vào nguyên mẫu của đối tượng

class House {
constructor(owner, rooms) {
self.owner = owner
self.rooms = rooms
}

ringDoorbell() {
log "ding dong!"
}

describe() {
log self.owner + "'s house has " + self.rooms + " rooms."
}
}

bobHouse = new House("Bob Belcher", 4)bobHouse.describe() // "Bob Belcher's house has 4 rooms."
5 cấp cao nhất.

Khi hàm đệ quy thực hiện, bắt đầu bằng input.setAttribute("onkeyup", "layers.entities['" + i + "'][" + j + "].variables['" + jj + "'] = this.value; layers.updateEntities();");7, nó sẽ đăng xuất các đối tượng hiện tại và các thuộc tính của chính nó và sau đó có được nguyên mẫu đối tượng đó để nó có thể tiếp tục chuỗi. Điều này cho chúng ta một cái nhìn cấp cao hơn về các thuộc tính được xác định ở mỗi bước và nếu/khi chúng được xác định lại ở các bước thấp hơn (ví dụ, trong đó cả

if (!this.entities[which])
{ this.entities[which] = []; }

if (!this.entities[which][id])
{ this.entities[which][id] = {}; }

this.entities[which][id].pos = "0,0";
this.entities[which][id].variables = {};
this.entities[which][id].variables = this.template[which];
9 và
if (!this.entities[which])
{ this.entities[which] = []; }

if (!this.entities[which][id])
{ this.entities[which][id] = {}; }

this.entities[which][id].pos = "0,0";
this.entities[which][id].variables = {};
this.entities[which][id].variables = this.template[which];
2 có một thuộc tính gọi là
if (!this.entities[which])
{ this.entities[which] = []; }

if (!this.entities[which][id])
{ this.entities[which][id] = {}; }

this.entities[which][id].pos = "0,0";
this.entities[which][id].variables = {};
this.entities[which][id].variables = this.template[which];
6.)

TL;DR

Kế thừa cổ điển, chẳng hạn như được sử dụng trong một ngôn ngữ như Ruby, cung cấp một cơ chế để xác định hành vi trên một lớp, tạo các lớp con kế thừa hành vi đó (hoặc ghi đè lên nó). Khi các lớp được xác định, sau đó bạn có thể khởi tạo các đối tượng từ một lớp, sẽ có thể sử dụng các phương thức thể hiện được xác định trên lớp của chúng. JavaScript không có hệ thống kế thừa như thế này nhưng có thể đạt được chức năng tương tự bằng cách sử dụng ủy quyền nguyên mẫu. Mỗi đối tượng trong JavaScript có một đối tượng nguyên mẫu và bất kỳ đối tượng nào thấp hơn trên chuỗi nguyên mẫu có thể sử dụng các thuộc tính được xác định trên các đối tượng lên chuỗi. Hoặc, các đối tượng cấp thấp hơn có thể xác định hành vi của chính họ cùng tên, sau đó họ sẽ sử dụng thay vì cố gắng ủy thác hành vi lên chuỗi. Để kiểm tra xem một đối tượng nhất định có thuộc tính được tự xác định hay không, hoặc nếu nó ủy thác hành vi đó lên chuỗi nguyên mẫu của nó, bạn có thể sử dụng this.entities[which][id].variables.width8 và

if (!this.entities[which])
{ this.entities[which] = []; }

if (!this.entities[which][id])
{ this.entities[which][id] = {}; }

this.entities[which][id].pos = "0,0";
this.entities[which][id].variables = {};
this.entities[which][id].variables = this.template[which];
03Methods.

Đó là tất cả cho giới thiệu của chúng tôi về chuỗi nguyên mẫu đối tượng. Có rất nhiều điều để khám phá ở đây, đặc biệt là cách các nguyên mẫu có liên quan đến các chức năng của hàm tạo. Nhưng đó là một câu chuyện cho một ngày khác. Trong thời gian chờ đợi, nếu bạn muốn tìm hiểu thêm về cách tận dụng phái đoàn nguyên mẫu, hãy xem bài viết này về các mẫu thiết kế đối tượng phổ biến.

Làm thế nào để bạn liên kết một cái gì đó trong JavaScript?

Approach:..
Tạo một phần tử neo ..
Tạo một nút văn bản với một số văn bản sẽ hiển thị dưới dạng liên kết ..
Nối nút văn bản vào phần tử neo ..
Đặt thuộc tính Tiêu đề và HREF của phần tử ..
Chất nối phần tử trong cơ thể ..

Hàm liên kết trong JavaScript là gì?

Trong javascript, link () là một phương thức chuỗi được sử dụng để tạo phần tử HTML với một siêu liên kết.Vì phương thức link () là một phương thức của đối tượng chuỗi, nó phải được gọi thông qua một thể hiện cụ thể của lớp chuỗi.a string method that is used to create the HTML element with a hyperlink. Because the link() method is a method of the String object, it must be invoked through a particular instance of the String class.
Trong JavaScript, bạn có thể gọi hàm hoặc đoạn mã JavaScript thông qua thẻ HREF của liên kết.Điều này có thể hữu ích vì điều đó có nghĩa là mã JavaScript đã cho sẽ tự động chạy cho ai đó nhấp vào liên kết.HREF đề cập đến thuộc tính của HREF, trong một thẻ liên kết (siêu liên kết trong HTML).HREF refers to the “HREF” attribute within an A LINK tag (hyperlink in HTML).

Liên kết trong DOM là gì?