码迷,mamicode.com
首页 > Web开发 > 详细

JS引用类型 --- Object

时间:2017-12-26 23:48:19      阅读:184      评论:0      收藏:0      [点我收藏+]

标签:his   log   引号   asc   div   ie8   兼容   动态类型   ==   

一、对象的基础知识

  • 概念:特指的某一个事物,有特征(属性)和行为(方法),可存储数据。

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

  • 对象的属性和方法:可以通过 . 的方式添加(这一点也证明了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>

JS引用类型 --- Object

标签:his   log   引号   asc   div   ie8   兼容   动态类型   ==   

原文地址:https://www.cnblogs.com/zxvictory/p/8120538.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!