JS对象简介

crainyday

前端 / JS

发布于：2019年3月30日

字数：1k字

时长：4分钟

JS的Object类型

一.Object对象

Object类型, 我们也称为一个对象. 是JavaScript中的引用数据类型.

它是一种复合值, 它将很多值聚合到一起, 可以通过名字访问这些值.
对象也可以看做是属性的无序集合, 每个属性都是一个名/值对.
对象除了可以创建自有属性, 还可以通过从一个名为原型的对象那里继承属性.
除了字符串、数字、true、false、null和undefined之外, JS中的值都是对象.
对象可以说是对一些名值对的封装

A.对象的分类:

内建对象: 由ES标准制定的对象, 在任何ES的实现中都能使用

比如: Math String Number Boolean Function Object…

宿主对象: 由JS的运行环境提供的对象, 目前主要指浏览器提供的对象

比如: BOM DOM

自定义对象(最难): 由开发人员自己创建的对象

二.创建自定义对象

访问属性的两种方式:

用 . 访问: 对象.属性名
用 [] 访问: 对象[‘属性名’], 这样操作属性更灵活, 常用于操作一些特殊的属性名

属性名的命名方式, 建议按照标识符的规范去做; 属性值可以是任意类型的值, 甚至是一个对象.

//方式一:先创建对象, 再添加属性
var person = new Object();
person.name = "孙悟空";//添加name属性
person.age = 18;//添加age属性
person.name = "牛魔王";//修改属性
delete person.name;//删除属性
console.log(person.name);//读取属性, 如果读取不到对象的属性会返回undefined
//方式二:创建对象的同时添加属性, 这种叫做对象字面量
var sex = "男";
var person1 = {
    name: "孙悟空",
    age: 18,
    "123": 789//最后一个属性后一定不能加逗号
};
person1[sex] = sex;
console.log(person1[sex]);
var index = '123';
console.log(person1['123']);//person1.123是不允许的
console.log(person1[index]);//与person1['123']等价

三.in运算符

通过该运算符检查对象是否有某个属性, 有则返回true, 没有返回false.

格式: “属性名” in object, 例:

var person = {
    name: "孙悟空",
    age: 18,
    "123": 789
};
console.log("obj" in person);

四.数据类型

基本数据类型&引用数据类型

基本数据类型: Number String Boolean Null Undefined

基本数据类型的值是无法修改的, 是不可变的.
基本数据类型的比较是值的比较, 也就是只要两个变量的值相等, 我们就认为这两个变量相等.

引用数据类型: Object

当一个变量是一个对象时, 实际上变量中保存的并不是对象本身, 而是对象的引用(堆内存中对象的地址).
当从一个变量向另一个变量复制引用类型的值时, 会将对象的引用复制到变量中, 并不是创建一个新的对象.
这时, 两个变量指向的是同一个对象. 因此, 改变其中一个变量会影响另一个

对比如下代码即结果, 有什么区别?

var a = 123;
var b = a;
a ++;
console.log("a = " + a + ";b = " + b);
var obj = {
    name:"孙悟空",
    birth:{
        year:1998,
        month:10,
        day:8
    }
};
var obj2 = obj;
obj2.name = "牛魔王";
console.log("obj.name = " + obj.name + "; obj2.name = " + obj2.name);
//obj2 = null;//若执行obj2 = null;那obj2不再指向任何内容, 如下命令会出错
obj2.name = "猪八戒";
console.log(obj == obj2);//引用数据类型比较的是地址

JS运行时, 基本类型的变量直接存在栈空间;
引用类型的实体(即对象)保存在堆空间, 变量中保存的实际上对象在堆内存中的地址.
以上代码在内存中的情况如下:

五.for…in语句

在开发过程中, 我们往往会使用别人给我们提供好的对象
但我们不知道对象里有什么属性
这时就用到了for…in语句来遍历对象的属性

例:

var obj = {
    name:"CRD",
    sex:"男",
    age:20,
    nation:"中国",
    sayHello:function(){
        console.log("你好");
    }
};
for(var index in obj){//这里不能用obj.index来操作属性
    console.log("名:" + index + ";值:" + obj[index]);
}