0145 JavaScript创建对象的三种方式 之 字面量:创建,访问对象的属性&方法,变量属性函数方法总结

Posted jianjie

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了0145 JavaScript创建对象的三种方式 之 字面量:创建,访问对象的属性&方法,变量属性函数方法总结相关的知识,希望对你有一定的参考价值。

javascript 中,现阶段我们可以采用三种方式创建对象(object):

  • 利用字面量创建对象

  • 利用 new Object 创建对象

  • 利用构造函数创建对象


5.2.1 利用字面量创建对象

5.2.1.1 创建

使用对象字面量创建对象:{ }。

    就是花括号 { } 里面包含了表达这个具体事物(对象)的属性和方法;
    { } 里面采取键值对的形式表示 
  • 键:相当于属性名

  • 值:相当于属性值,可以是任意类型的值(数字类型、字符串类型、布尔类型,函数类型等)

    代码如下:

    var star = {
        name : '哈哈',
        age : 18,
        sex : '男',
        sayHi : function(){
            alert('大家好啊~');
        }
    };

    上述代码中 star即是创建的对象。


5.2.1.2 对象的使用

1、对象的属性

  • 对象中存储具体数据的 "键值对"中的 "键"称为对象的属性,即对象中存储具体数据的项

  • 对象的方法

    • 对象中存储函数的 "键值对"中的 "键"称为对象的方法,即对象中存储函数的项

2、访问对象的属性

  • 对象里面的属性调用 : 对象.属性名 ,这个小点 . 就理解为“ 的 ”

  • 对象里面属性的另一种调用方式 : 对象[‘属性名’],注意方括号里面的属性必须加引号

    示例代码如下:

    console.log(star.name)     // 调用名字属性
    console.log(star['name'])  // 调用名字属性

3、调用对象的方法

  • 对象里面的方法调用:对象.方法名() ,注意这个方法名字后面一定加括号

    示例代码如下:

    star.sayHi();              // 调用 sayHi 方法,注意,一定不要忘记带后面的括号
        // 1.利用对象字面量创建对象 {}
        // var obj = {};  // 创建了一个空的对象 
        var obj = {
                uname: '张三疯',
                age: 18,
                sex: '男',
                // 经测试,方法名也可以加 引号
                sayHi: function() {
                    console.log('hi~');
                }
            }
            // (1) 里面的属性或者方法我们采取键值对的形式  键 属性名 : 值  属性值 
            // (2) 多个属性或者方法中间用逗号隔开的
            // (3) 方法冒号后面跟的是一个匿名函数
            // 2. 使用对象
            // (1). 调用对象的属性 我们采取 对象名.属性名 . 我们理解为 的
        console.log(obj.uname);
        // (2). 调用属性还有一种方法 对象名['属性名']
        console.log(obj['age']);
        // (3) 调用对象的方法 sayHi   对象名.方法名() 千万别忘记添加小括号
        obj.sayHi();


        // 我的写法
        var obj = {
            'name': '哈哈',
            'age': 11,
            'gender': '男',
            'sayHi': function() {
                console.log('Hi');
            }
        }

        console.log(obj.name); // 哈哈
        console.log(obj['age']); //  11
        obj.sayHi(); // Hi

4、变量、属性、函数、方法总结

属性是对象的一部分,而变量不是对象的一部分,变量是单独存储数据的容器

  • 变量:单独声明赋值,单独存在
  • 属性:对象里面的变量称为属性,不需要声明,用来描述该对象的特征
    方法是对象的一部分,函数不是对象的一部分,函数是单独封装操作的容器
    - 函数:单独存在的,通过“函数名()”的方式就可以调用
    - 方法:对象里面的函数称为方法,方法不需要声明,使用“对象.方法名()”的方式就可以调用,方法用来描述该对象的行为和功能。 

以上是关于0145 JavaScript创建对象的三种方式 之 字面量:创建,访问对象的属性&方法,变量属性函数方法总结的主要内容,如果未能解决你的问题,请参考以下文章

JavaScript创建函数的三种方式

0146 JavaScript创建对象的三种方式 之 new Object

0147 JavaScript创建对象的三种方式 之 构造函数

js创建对象的三种方式

javascript实现继承的三种方式

JavaScript实现接口的三种经典方式