Metodi degli oggetti JavaScript

MetodoÈ un metodo associato a un oggetto, o a una funzione, in cui un metodo è un oggetto che è una proprietà di una funzione.

La definizione dei metodi è esattamente la stessa della definizione delle funzioni regolari, con la differenza che devono essere assegnati come proprietà dell'oggetto.

Accedi ai metodi JavaScript

Per recuperare un metodo dell'oggetto, lo chiamerai nel modo in cui chiameresti una funzione regolare, ma lo aggiungerai alla variabile dell'oggetto variabile.

// 创建对象
var user = {
　　firstName: "Seagull",
　　lastName : "an",
　　age: 22,
　　location: "New Delhi",
　　getName : function() {
　return this.firstName + " " + this.lastName;
　　}
};
// Accesso al metodo getName()
user.getName();

Se si accede al metodo senza parentesi graffe (), restituirà la definizione della funzione:

user.getName;

UsathisCome riferimento all'oggetto

JavaScript ha una parola chiave speciale this che puoi usare nei metodi per fare riferimento all'oggetto corrente.

Potresti aver notato che i nostri metodi sono un po' strani. Ecco un esempio:

　　getName: function() {
　　　return this.firstName + " " + this.lastName;
　　}

Il concetto di this si riferisce all'oggetto interno corrente in cui il codice è scritto - quindi in questo caso, this è equivalente auser.

In altre parole, this.firstName rappresentaQuesto oggettoproprietà firstName.

Puoi definireParole chiave JSTutorialJSScopri di più su questo concetto di this.

Aggiungere nuovi metodi

Per aggiungere un nuovo metodo all'oggetto, puoi assegnare una nuova funzione all'attributo utilizzando l'operatore di assegnazione (=).

Questo esempio aggiunge il metodo "greet" all'oggetto utente:

user.greet = function() {
　　　　return "Hello World";
};

Getter e Setter

ECMAScript 5 (2009) ha introdotto getter e setter.

Un getter è un metodo per ottenere il valore di una proprietà specifica.

Un setter è un metodo per impostare il valore di una proprietà specifica.

Puoi definire getter e setter su qualsiasi oggetto predefinito o oggetto definito dall'utente che supporta l'aggiunta di nuove proprietà.

JavaScript Getter (parola chiave get)

Questo esempio utilizza get loc属性作为location属性的值：

// crea un oggetto
var user = {
　　firstName: "Seagull",
　　lastName: "Anna",
　　age: 22,
　　location: "New Delhi",
　　get loc() {
　　　　　return this.location;
　　}
};
//显示来自对象的数据
document.getElementById("para").innerHTML = user.loc;

JavaScript Setter（set关键字）

本示例使用set loc属性作为location属性的值：

// 创建对象
var user = {
　　firstName: "Seagull",
　　lastName: "Anna",
　　age: 22,
　　location: "New Delhi",
　　set loc(x) {
　　　　　this.location = x;
　　}
};
// 使用setter设置对象属性
user.loc = "Goa";
// 显示来自对象的数据
document.getElementById("para").innerHTML = user.location;

Function 函数 和 Getter 之间的区别？

以下两个示例显示了function 和 getter之间的区别：

// 创建对象
var user = {
　　firstName: "Seagull",
　　lastName: "Anna",
　　age: 22,
　　location: "New Delhi",
　　fullName: function() {
　　　　　　return this.firstName + " " + this.lastName;
　　}
};
// 显示来自对象的数据
document.getElementById("para").innerHTML = user.fullName();

// 创建对象
var user = {
　　firstName: "Seagull",
　　lastName: "Anna",
　　age: 22,
　　location: "New Delhi",
　　get fullName() {
　　　　　return this.firstName + " " + this.lastName;
　　}
};
//显示来自对象的数据
document.getElementById("para").innerHTML = user.fullName;

示例1 将fullName作为函数访问：user.fullName()。

示例2 将fullName作为属性访问：user.fullName。

使用Getters 和 Setters：

• 它提供了更简单的语法

• 它允许属性和方法的语法相同

• 它可以确保更好的数据质量

• 对于后端处理非常有用

Object.defineProperty()

Object.defineProperty()方法还可以用于添加Getter和Setter。

Object.defineProperty(object, property, {value: value})

Facciamo un esempio con l'oggetto "contatore":

var　counter　=　{i　:　0};
Object.defineProperty(counter,　"increment",　{　
　　　get:　function()　{this.i++;},
});
Object.defineProperty(counter,　"decrement",　{　
　　　get:　function()　{this.i--;},
});
Object.defineProperty(counter,　"reset",　{　
　　　get:　function()　{this.i　=　0;},
});
Object.defineProperty(counter,　"add",　{
　　　set:　function　(value)　{this.i　+=　value;}
});
Object.defineProperty(counter,　"subtract",　{
　　　set:　function　(value)　{this.i　-=　value;}
});
counter.reset;
counter.add　=　25;
counter.increment;