美文网首页
javaScript 对象

javaScript 对象

作者: 关注阿无_跟孩子沟通更顺利 | 来源:发表于2018-04-28 10:55 被阅读0次

对象是一组无序的键值对集合

var obj = {
   'key1': 'Hello',
   'key2': 'Wold',
}

上面代码中,大括号{}定义一个对象,赋值给变量obj,obj就指向一个对象。键名key1,对应键值Hello。
键名都会自动转化为字符串,数字键的引用只能用方括号运算符,例如obj[1]

对象的属性可以动态创建,不必在对象声明时就指定

var obj = {};
obj.foo = 123;
obj.foo // 123

上面代码中,直接对obj对象的foo属性赋值,会在运行时创建foo属性

对象的引用,不同的变量名指向同一个对象,是对这个对象的引用,指向同一个内存地址,修改其中变量,会影响到其他变量

var o1 = {};"hello world"
var o2 = o1;

o1.a = 1;
o2.a // 1

o2.b = 2;
o1.b // 2

上面代码中,o1和o2指向同一个对象,因此为其中任何一个变量添加属性,另一个变量都可以读写该属性。

此时,如果取消某一个变量对于原对象的引用,不会影响到另一个变量。

var o1 = {};
var o2 = o1;

o1 = 1;
o2 // {}

上面代码中,o1和o2指向同一个对象,然后o1的值变为1,这时不会对o2产生影响,o2还是指向原来的那个对象。
但是这种引用只局限于对象。如果两个变量指向同一个原始类型的值,那么,变量这时都是对值的拷贝。

var x = 1;
var y = x;

x = 2;
y // 1

上面代码中,当x的值发生变化后, y的值并没有改变,这就表示y和x并不是指向同一个内存地址。

查看所有属性,可以适用Object.keys方法

var obj = {
  key1: 1,
  key2: 2
};

Object.keys(obj);
// ['key1', 'key2']

删除属性, delete命令, 删除成功后返回true

var obj = { p: 1 };
Object.keys(obj) // ["p"]

delete obj.p // true
obj.p // undefined
Object.keys(obj) // []

上面代码中,delete命令删除对象obj的p属性。删除后,再读取p属性就会返回undefined,而且Object.keys方法的返回值也不再包括该属性。

注意,删除一个不存在的属性,delete不报错,而且返回true。

in 运算符,检查对象是否包含某个属性(注意:检查的是键名,不是键值),如果包含就返回true

var obj = { p: 1 };
'p' in obj // true

in运算符的一个问题是,它不能识别哪些属性是对象自身的,哪些属性是继承的。

var obj = {};
'toString' in obj // true

上面代码中,toString方法不是对象obj自身的属性,而是继承的属性。但是,in运算符不能识别,对继承的属性也返回true。

for…in 循环, 用来遍历对象的全部属性。
注意:(它遍历的是对象所有可遍历(enumerable)的属性,会跳过不可遍历的属性。它不仅遍历对象自身的属性,还遍历继承的属性。)

var obj = {a:1, b:2, c:3};
for (var i in obj) {
  console.log(obj[i]);
}
// 1
// 2
// 3

下面是一个使用for...in循环,提取对象属性名的例子。

var obj = {
  x: 1,
  y: 2
};
var props = [];
var i = 0;

for (var p in obj) {
  props[i++] = p
}

props // ['x', 'y']

使用for...in的时候,应该结合使用hasOwnProperty方法,在循环内部判断一下,某个属性是否为对象自身的属性。

var person = { name: '老张' };

for (var key in person) {
  if (person.hasOwnProperty(key)) {
    console.log(key);
  }
}
// name

参考教程JavaScript 标准参考教程(alpha)

相关文章

网友评论

      本文标题:javaScript 对象

      本文链接:https://www.haomeiwen.com/subject/wxowlftx.html