<万博manbetx平台> 你真的了解对象字面量吗(一) - JavaScript对象与常用设计模式 - 万博manbetx平台中文网
点击切换帐号登陆
帐号密码登陆

你真的了解对象字面量吗(一)

1.对象字面量
===========

**知识点**
1. 基本术语
2. 对象字面量
3. 对象构造函数

-----------------------------------------------------------

1.基本术语
---------
1. 对象是键值对的无序集合
2. 键值对类似于其它语言中的: "关联数组"
3. "键名: 如果是合法标识符,可不用引号,否则必须使用引号包装
4. "值": 原始值(Number/String/Boolean/Undefined/Null)或对象(Object/Array)
5. "值": 可以是函数(function)
6. 属性: 值是原始值或对象/数组
7. 方法: 值是函数
8. 属性和方法,可统称为: "对象成员"
**注意**: 其实可统称为*属性*,方法只是属性值是函数罢了,并无特殊之处
9. 对象的可变性: 与原始类型不可修改相比,对象可随时更新
10. 对象可以由字面量和构造函数二种式方式创建,其实JS数据都可以用这二种方式创建
11. 字面量: 使用关键字和特殊语法创建
12. 构造函数: 使用new 来执行一个特殊函数来创建

-----------------------------------------------------------

2.对象字面量
-----------
1. 将对象包装到大括号中:  "{...}"
2. 对象中的属性和方法用逗号","分隔,最后的成员不要加,防止IE报错
3. 属性名与属性值之间用冒号:":"分隔,推荐添加一个空格
4. 将对象字面量赋值给变量量, 右大括号结尾一定要加上分号: ";"

-----------------------------------------------------------

### 示例源码: code/demo01.万博manbetx平台

```万博manbetx平台
<!DOCTYPE 万博manbetx平台>
<万博manbetx平台>
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<script>
    // 1. 对象字面量
    // 从一个空对象开始,实际上并非真的为空,后面再说为什么?

    // 1.1 给一个空对象上添加属性
    var cat = {};
    // 给它添加一个属性和一个方法
    cat.name = 'Jerry';
    cat.feed = function () {
      return cat.name + '吃老鼠';
    };

    console.log(cat.feed());

    // 1.2 在创建对象字面量时,同步添加属性和方法
    var person = {
        name: 'Peter',
        age: 30,
        isMarried: true,
        salary: undefined,
        position: null,
        getName: function () {
            return this.name;
        }
    };

    console.log(person.getName());
    // 设置属性默认值
    console.log(typeof person.salary === 'undefined' ? '工资没有数据' : person.salary);
    // 简写
    console.log(person.salary || '工资没有数据');

    // 2. 从构造函数创建
    // js中没类,但是有构造函数,可在将构造函数当成创建对象的模板
    // js中最重要的构造函数就是: Object,  它是一切数据类型之源
    // 正所谓: 天下武功出少林, Object就是JavaScript中的少林派
    // 以后,你所看到一切数据,说到底, 都是Object的徒子徒孙

    // 2.1.创建一个空对象
    var obj = new Object();
    console.log(obj.constructor  === Object);  // 对象构造器是否是Object?
    console.log(obj instanceof  Object);    // 是否是Object的实例对象?

    // Object()真的是一切数据之源吗?
    // 创建一个数值类型
    var num = 100;
    console.log(num);

    var num = Number(100);
    console.log(num);

    var num = new Number(100);
    console.log(num);

    console.log(num.constructor === Number); // 是数值类型
    console.log(Number instanceof Object);

    var num = new Object(100);
    console.log(num);


    console.log(num instanceof Object);
    console.log(num instanceof Number);

    // 同理,也可以用Object()来创建其它类型,例如字符串
    var str = new Object('JavaScript');
    var str = new String('JavaScript');
    var str = String('JavaScript');
    console.log(str);
    console.log(str.constructor === String);


    // 甚至可以用Object来创建数组
    var arr = new Object([1,2,3,4]);
    console.log(arr);
    console.log(Array.isArray(arr));

    // 无论如何,使用构造函数来创建对象, 肯定不如字面量直观,方便
    // 对于内置的数据类型,应该首选字面量方式来创建,不要用构造函数

</script>
</body>
</万博manbetx平台>
```


任务

?不会了怎么办
无数据提示暂无评论哟...我要评论
网站导航
标签地图
学习路径
视频教程
开发软件
旗下子站
技术文章
文档工具
关于我们
企业合作
人才招聘
联系我们
讲师招募
QQ交流群
QQ官方交流群
微信公众号
微信公众号