156 对象的理解和使用,什么时候必须 使用['属性名'] 的方式

  • 什么是对象?

    • 多个数据(属性)的集合
    • 用来保存多个数据(属性)的容器
  • 属性组成:

    • 属性名 : 字符串(标识)
    • 属性值 : 任意类型
  • 属性的分类:

    • 一般 : 属性值不是function, 描述对象的状态
    • 方法 : 属性值为function的属性, 描述对象的行为
  • 特别的对象

    • 数组: 属性名是0,1,2,3之类的索引
    • 函数: 可以执行的
  • 如何操作内部属性(方法)

    • .属性名

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>03_对象</title>
</head>

<body>
    <!--
1. 什么是对象?
  * 多个数据的封装体
  * 用来保存多个数据的容器
  * 一个对象代表现实中的一个事物
2. 为什么要用对象?
  * 统一管理多个数据
3. 对象的组成
  * 属性: 属性名(字符串)和属性值(任意)组成
  * 方法: 一种特别的属性(属性值是函数)
4. 如何访问对象内部数据?
  * .属性名: 编码简单, 有时不能用
  * ['属性名']: 编码麻烦, 能通用
-->
    <script type="text/javascript">
        var p = {
            name: 'Tom',
            age: 12,
            setName: function(name) {
                this.name = name
            },
            setAge: function(age) {
                this.age = age
            }
        }

        p.setName('Bob');
        p['setAge'](23);
        console.log(p.name, p['age']);  // Bob  23
    </script>
</body>

</html>

问题: 什么时候必须 使用'属性名' 的方式?

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>03_相关问题</title>
</head>

<body>
    <!--
问题: 什么时候必须使用['属性名']的方式?
  1. 属性名包含特殊字符: - 空格
  2. 属性名不确定
-->
    <script type="text/javascript">
        var p = {};
        //1. 给p对象添加一个属性: content type: text/json
        // p.content-type = 'text/json' //不能用
        p['content-type'] = 'text/json';
        console.log(p['content-type']); // text/json

        //2. 属性名不确定
        var propName = 'myAge';
        var value = 18;
        // p.propName = value //不能用
        p[propName] = value;
        console.log(p[propName]); // 18
    </script>
</body>

</html>

猜你喜欢

转载自www.cnblogs.com/jianjie/p/12235569.html
156
今日推荐