JS对象
在本教程中,我们将学习JavaScript对象。
对象
JavaScript对象是一种特殊的变量类型,可以保存多个命名值。
要在JavaScript中创建对象,我们使用" {}"花括号。
对象的属性和值
在开/关括号内,我们有名称/值对。
这些称为对象属性和属性值。
语法propertyName:propertyValue
propertyValue可以是任何类型-空,未定义,数字,字符串,对象,函数,甚至是数组。
在下面的示例中,我们创建了一个具有一些属性和值的对象" student"。
var student = { name : "", studentid : 123 };
因此,在上面的示例中,"学生"是一个对象。
名称和学生身份是学生对象的属性。
" "和" 123"是属性的值。
对象方法
当为对象的属性分配函数时,它就是该对象的方法。
在下面的示例中,我们向学生对象添加了对象方法" displayStream"。
var student = { name : "", studentid : 123, displayStream : function () { console.log("Computer"); } };
因此,在上面的示例中,"学生"是一个对象。
displayStream是学生对象的属性。
并且它被分配了一个函数,因此,它是学生对象的方法。
访问对象属性
为了访问对象的属性,我们使用对象名称,后跟.
运算符,然后使用属性名称。
在以下示例中,我们将访问学生对象的name
属性。
var student = { name : "", studentid : 123, displayStream : function () { console.log("Computer"); } }; //accessing name property console.log(student.name);
访问对象属性的另一种方法是使用方括号,然后将对象属性名称放在引号中。
在以下示例中,我们将访问学生对象的name
属性。
var student = { name : "", studentid : 123, displayStream : function () { console.log("Computer"); } }; //accessing name property console.log(student["name"]);
调用对象方法
要调用或者调用对象方法,我们使用对象名称,后跟。
运算符,然后是方法名称,再由(()运算符。
并且,如果有任何参数需要传递,则将其放在以逗号分隔的()括号内。
在下面的示例中,我们将调用学生对象的" displayStream"方法。
var student = { name : "", studentid : 123, displayStream : function () { console.log("Computer"); } }; //calling displayName method student.displayStream();
向对象添加新属性
要向对象添加新属性,我们使用.
运算符。
在下面的示例中,我们向学生对象添加了一个新的属性"点"。
var student = { name : "", studentid : 123, displayStream : function () { console.log("Computer"); } }; //adding a new property student.points = 10;
向对象添加新属性的另一种方法是使用方括号[]
。
在下面的示例中,我们向学生对象添加了一个新的属性"点"。
var student = { name : "", studentid : 123, displayStream : function () { console.log("Computer"); } }; //adding a new property student["points"] = 10;
向对象添加新方法
我们可以使用.
运算符向对象添加新方法。
在以下示例中,我们向学生对象添加了一个新方法" displayMessage"。
var student = { name : "", studentid : 123, displayStream : function () { console.log("Computer"); } }; //adding a new method student.displayMessage = function () { console.log("Hello World!"); };
this
关键字
当我们想访问对象的属性时,可以在对象内部使用关键字" this"。
在下面的示例中,我们有一个Student对象,并将显示来自displayName方法的name属性的值。
当我们不使用this
关键字时,我们将得到undefined
作为输出,如下所示。
var student = { name : "", studentid : 123, displayName : function () { console.log(name); } }; //calling the method student.displayName(); //this will print undefined
之所以得到"未定义",是因为在displayName方法中,变量名称被视为新变量,而不是学生对象的name属性。
并且新变量始终获取未定义的值,因此输出是未定义的。
要从对象方法displayName访问学生对象的name属性,我们必须使用this关键字。
在学生对象内部,此关键字指向对象。
在以下示例中,我们将获得名称作为输出。
var student = { name : "", studentid : 123, displayName : function () { console.log(this.name); } }; //calling the method student.displayName(); //this will print ""
删除对象属性
要删除对象属性,我们使用delete
关键字。
要删除属性,我们使用对象名称,后跟.
运算符,然后使用对象属性名称。
在下面的示例中,我们删除了Student对象的studentid属性。
var student = { name : "", studentid : 123, displayName : function () { console.log(this.name); } }; //delete object property delete student.studentid;
删除对象属性的另一种方法是在对象后面加上方括号[]
。
在方括号内,我们将属性名称写在引号中。
在下面的示例中,我们删除了Student对象的studentid属性。
var student = { name : "", studentid : 123, displayName : function () { console.log(this.name); } }; //delete object property delete student["studentid"];
删除对象方法
要删除一个对象方法,我们使用delete
关键字。
要删除该方法,我们使用对象名称,后跟.
运算符,然后使用对象方法名称。
在以下示例中,我们将删除学生对象的displayName方法。
var student = { name : "", studentid : 123, displayName : function () { console.log(this.name); } }; //delete object method delete student.displayName;