• 技术文章 >web前端 >js教程

    什么是字面量?JS中怎么利用字面量创建对象?

    青灯夜游青灯夜游2022-08-04 18:03:52转载152
    JavaScript中怎么利用字面量创建对象?下面本篇文章带大家了解一下字面量,介绍一下JavaScript中如何利用对象字面量来创建对象,希望对大家有所帮助!

    什么是字面量

    字面量(literal)是表达一个固定值的表示法,又叫常量,用来为变量赋值时的常数量

    通俗的理解,字面就是所见即所得,js 程序执行到代码中的字面量,会立即知道它是什么类型的数据,值是多少

    可以用于表示固定值,比如:数字、字符串、undefined、布尔类型、对象的字面值等

    对象字面量创建对象

    对象字面量的方式是最常用的创建对象的方式之一,它用内含属性的花括号{...}快速创建对象。

    var 对象名={ 
        .....
    };

    对象字面值是封闭在花括号对({})中的一个对象的零个或多个“属性名:值”列表。

    示例:

    var person={ 
        name:"Jack", 
        age:10,
        5:true  
    };

    对象字面量的值的类型

    对象字面量的值可以是任何数据类型包括数组字面量,函数,嵌套的对象字面量

    var Swapper = {    
            // 数组字面量(用逗号分隔,所有都要加引号)
        images: ["smile.gif", "grim.gif", "frown.gif", "bomb.gif"],
        pos: { 
                //嵌套对象字面量
            x: 40,
            y: 300
        },
        onSwap: function() { 
                //函数
        }
    };

    在使用对象字面量时,属性名也可以用字符串

    var person={
        "name":"Jack",
        "age":29,
        5:true
    };

    属性名和变量名相同时可简写

    var obj = { name: name, age: age };
    
    // ES2015中,属性名和变量名相同时可简写为:
    var obj = { name, age };

    扩展属性

    // 扩展属性,ES2018新特性,可用于克隆或合并对象,浅拷贝,不包括原型
    var obj2 = { ...obj3 };

    以字面量方式创建的对象属性默认是可写,可枚举和可配置的

    对象的调用

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

    对象里面属性的另一种调用方式 : 对象['属性名'],注意方括号里面的属性必须加引号,我们后面会用  对象里面的方法调用:对象.方法名() ,注意这个方法名字后面一定加括号

    var obj1 = {
        dogName: '可可',
        type: '阿拉斯加犬',
        age: 5 + '岁',
        color: 'red',
        skill: function () {
            console.log('技能' + ':' + 'bark' + ',' + 'showFilm');
        }
    }
    console.log(obj1.dogName);
    obj1.skill();

    说明:

    对象的原型默认为Object.prototype。通过定义属性__proto__(只能使用冒号标记的属性定义)的值来变更原型。只有给出的值是对象或null,对象的原型才会被设置为给出的值,否则原型不会改变。

    var obj1 = {};
    Object.getPrototypeOf(obj1) === Object.prototype;	// true
    
    var obj2 = { __proto__: null };
    Object.getPrototypeOf(obj2) === null;				// true
    
    var __proto__= {};
    var obj3 = { "__proto__": __proto__ };
    Object.getPrototypeOf(obj3) === __proto__;			// true
    // 不使用冒号标记的属性定义,不会变更对象的原型,只是名字为__proto__的普通属性
    var obj4 = { __proto__ };
    Object.getPrototypeOf(obj4) === __proto__;			// false
    obj4.hasOwnProperty("__proto__");					// true
    Object.getPrototypeOf(obj4) === Object.prototype;	// true
    
    var obj5 = { __proto__: "not an object or null" };
    obj5.hasOwnProperty("__proto__");					// false
    Object.getPrototypeOf(obj5) === Object.prototype;	// true

    【相关推荐:javascript学习教程

    以上就是什么是字面量?JS中怎么利用字面量创建对象?的详细内容,更多请关注php中文网其它相关文章!

    声明:本文转载于:csdn,如有侵犯,请联系admin@php.cn删除
    上一篇:深入浅析JavaScript中的定时器 下一篇:JavaScript实例解析清除定时器
    VIP课程(WEB全栈开发)

    相关文章推荐

    • 【活动】充值PHP中文网VIP即送云服务器• JavaScript中数组常用的7种迭代处理方法总结• JavaScript数值的方法和属性详解• 简单聊聊JavaScript的Math对象方法• 什么是构造函数?详解JavaScript中的构造函数• 深入浅析JavaScript中的定时器
    1/1

    PHP中文网