js对象

对象的创建

对象是以键值对的形式存在的,与数组不同的是对象的键是我们认为赋予的,而数组是自动生成的索引。数组可以通过索引下标调用数据,而对象通过键名去调用数据。

// 1, 字面量方式声明 
        // 对象当中的数据,必须是键值对形式 / 属性 属性值
        // 必须自己定义 数据的键名 和 数据的数值
        // 键名 : 数据  
        // 键名的命名规范 : 推荐使用英文字母,数字形式,不能以数字开头
        //                 键名不用写引号
        // 键名/属性 是name,存储的数据/属性值是张三
        // 如果是多个对象,使用逗号间隔
        
        // 控制台显示时,有时会按照属性的首字母来显示内容
        // 但是不是改变程序中,属性的顺序,不用去管,不影响程序执行
        var obj = { name:'张三' , age:18 , sex:'男'};
        console.log(obj);
        // 数组中,直接定义数据,索引是JavaScript程序自动添加的
        var arr = [1,2,3,4,5];
        console.log(arr);
        // 2,内置构造函数方法
        var obj2 = new Object();

对象赋值和调用

<script>
        // 对象的基本操作
        // 对象的基本操作方法,与数组的基本操作方法,很相似
        // 语法形式也差不多,有一点要特别注意

        // 建立一个空对象
        var obj = {};

        // 给对象新增单元  


        // 方式1   对象变量名称['键名'] = 数值 
        // 键名是不存在的键名,就是新增对象单元操作
        // 使用[]语法,键名必须要添加引号

        obj['name'] = '张三';

        // 方式2   对象变量名称.键名 = 数值
        // 使用 .语法 ,键名不要加引号

        obj.sex = '男';

        // 方式3   键名是变量的形式
        // 对象新增单元的键名,是存储在变量中的
        // 此时只能使用 [] 形式来给对象新增单元
        // 并且此时的 变量名称 不要添加引号

        // 如果使用 [] 语法, str变量会被解析为 age 数据内容
        // 如果使用 . 语法, str变量不会被解析,会被直接操作为 str 键名

        // 就类似 '变量' 不解析变量,变量名称就是字符串
        //       `${变量}` 模板字符串,解析变量的

        var str = 'age' ; 

        // []语法,解析变量,添加单元键名是 age
        obj[str] = 180;


        console.log(obj);

        // 总结
        // 如果是变量,存储键名,必须使用[]语法
        // 如果是正常添加,推荐使用 .点语法


        // 调用操作  对象.键名  或者  对象[键名]
        // 点语法不能解析变量,

        // 数组和对象是相同的,调用不存在的键名和索引,执行结果都是undefined
        console.log(obj.name);
        console.log(obj.sex);
        console.log(obj['sex']);
        console.log(obj.str);   // 不会解析str为age,只会直接执行obj.str,执行结果是
        console.log(obj[str]);  // 变量必须使用[]语法来执行

        // 修改对象存储的数据
        // 对已经存在的键名,进行赋值,是修改之前的数据

        obj.name = '韩梅梅';
        obj['sex'] = '女';
        // 变量,只能使用[]语法,不要加引号
        obj[str] = 18;


    </script>

对象中的函数

<script>
        // 数组中的数据,可以是任意JavaScript支持的数据类型
        // 对象中的数据,也就是对象的属性值,也可以是JavaScript支持的任意数据类型
        var obj = {
            name:'张三',
            age:18,
            marry:true,
            o:{a:100,b:200},
            arr:['北京','上海','广州'],
            // 在对象中定义函数,类似于匿名函数
            // 函数是没有函数名称的
            // 函数的内存地址,存储在对象的属性中
            // 对象.属性()  就类似于 匿名函数 变量名称()
            // 此时是在调用函数,并且执行函数 
            fun:function(){
                console.log('我是对象中的函数')
            }
        }
        console.log(obj);
        // obj.name ---> 张三
        // obj.arr  ---> ['北京','上海','广州']
        // obj.0    ---> {a:100,b:200}
        obj.fun()  // 调用并且执行存储在对象中的函数/方法


        // 对象中的函数,调用对象的属性和属性值
        var obj2 = {
            name : '张三',
            age : 18,
            fun : function(){
                // 在对象内部的函数中,调用对象的属性和属性值
                console.log( obj2.name , obj2.age )
            }
        }
        obj2.fun();



        var woshibeichuangjiandedisangeduixiang3 = {
            name : '李四',
            age : 28,
            fun : function(){
                // 调用对象的属性,理论上应该是 对象名称.属性
                // 函数中有一个专有属性,叫this,可以起到指代的作用
                // 所谓的指代,也就代替,替换
                // 替换的内容,是调用函数之前,也就是 . 点之前的内容
                // 此时 this 指代的 就是这个对象
                console.log( this.name , this.age );

                console.log(this);
            }
        }
        // 此处在调用函数,点之前的内容是对象
        woshibeichuangjiandedisangeduixiang3.fun();
    </script>

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值