JS引用类型 --- Object

Posted 2020-10-19 Mr.隐士

一、对象的基础知识

• 概念：特指的某一个事物，有特征（属性）和行为（方法），可存储数据。

• 通俗理解：对象是一组无序键值对的集合，可存储数据。

• 对象的属性和方法：可以通过 . 的方式添加（这一点也证明了JS是一门动态类型的语言）

• JS中大多数引用类型的值，都是Object类型的实例

二、对象创建的 3种方式

1. {} 字面量创建对象

<script>
    var obj2 = {};
    obj2.name = ‘zhangxin‘;

    console.log(obj2);
</script>

2. new 构造函数创建对象

• 构造函数：第一个字母大写（约定）；普通函数：第一个字母小写

<script>
    var obj1 = new Object();
    obj1.name = ‘zhangxin‘;

    console.log(obj1);
</script>

• new 构造函数，new 做了4件事：

  • 创建一个新对象

  • 把this指向当前创建的新对象

  • 给新对象添加 属性、方法

  • 返回 创建后的新对象

<script>
    function Computer(name, age) {
        this.name = name;
        this.age = age;

        this.say = function () {
            return ‘我是‘ + this.name + ‘;今年‘ + this.age;
        }
    }

    var cp = new Computer(‘电脑‘, 20);
    console.log(cp.say());  // 我是电脑;今年20
</script>

• new 构造函数 创建数组对象

<script>
    var arr = new Array();

    console.log(arr);  // [] 
</script>

3. Object.create({键值对}) 方法创建新对象； ES5方法，IE8及以下不兼容

<script>
    var o1 = {name: ‘zhangxin‘};
    var create = Object.create(o1);

    console.log(create.name);  // ‘zhangxin‘
</script>

三、对象的的属性 、方法（ 赋值、取值 ）

方式1： . 的方式添加 / 读取：属性 、方法

方式2： [] 的方式添加 / 读取：属性 、方法（重要）

• 重要：可添加动态的属性名、动态的方法名

• 使用 [] 添加属性、方法：若属性名是固定的，需加引号；否则被视为 动态的变量

<script>
    var obj = {};
    
    obj.age = 20;
    obj[‘name‘] = ‘zhangxin‘;
    
    console.log(obj.age);       // 20
    console.log(obj[‘name‘]);   // ‘zhangxin‘
</script>

四、对象循环遍历 for-in

<script>
    var obj = {age: 18, name: ‘ss‘};
    
    for (var key in obj) {
        consloe.log(key);
        console.log(obj[key]);
    }
</script>

五、对象深拷贝 Object.create( )

<script>
    var o1 = {name: ‘zhangxin‘};
    var o2 = Object.create(o1);

    console.log(o2 === o1);  // false
</script>