JS对象创建可以通过哪些几种方式实现,具体是怎样的
Admin 2022-06-18 群英技术资讯 797 次浏览
这篇文章主要介绍“JS对象创建可以通过哪些几种方式实现,具体是怎样的”的相关知识,下面会通过实际案例向大家展示操作过程,操作方法简单快捷,实用性强,希望这篇“JS对象创建可以通过哪些几种方式实现,具体是怎样的”文章能帮助大家解决问题。前言:
在 JavaScript中,对象是一组有属性名和属性值组成的无序集合,对象的创建可以通过对象字面量、new 关键字 和Object.create()函数来创建。
let obj = {} // 空对象
let obj2 = {a:1, b:2}
let obj3 = {" hel": "wold"} // 属性名如果有空格,可以用字符串字面量作为属性名
使用 new 关键字后面调用构造函数,创建一个新的对象
let o = new Object(); // 内置的构造函数
let m = new Math();
let a = new Array();
let d = new Date();
function Person(){ //自定义构造函数
}
let person = new Person()
let o = Object.create({x:1, y:2});
console.log(o.x+o.y) //3
新对象o 将继承 {x:1, y:2} ,属性x和y称为继承属性, 如果传入的参数是null,则这个对象不会继承任何对象。被继承的对象又称之为“原型”。
Object.create(null)
ES2018新增了扩展操作符...,将已有的对象属性复制到新的对象中
let foo = {x:1, y:2}
let bar = {z:3}
let zoo = {...foo, ...bar}
console.log(zoo) // {x:1, y:2, z:3}
需要注意的几点:
assign 可以把一个对象的属性复制到另一个对象, assign 接收两个或多个参数,第一个参数为目标对象,第二个及后续参数为来源对象,函数将把来源对象的属性复制到目标对象,并返回目标对象。
let foo = {x:1, y:2}
let bar = {z:3}
let zoo = {}
let obj = Object.assign(zoo, foo, bar)
console.log(zoo) // {x:1, y:2, z:3}
console.log(obj===zoo) // true
另外补充两个ES6中新增的对象特性
如果想创建多个变量名和对应值组合成的对象,原来需要像传统对象字面量语法构建对象
let x=1, y =2;
let o = {x:x, y:y}
console.log(o) // {x:1, y:2}
ES6之后可直接简写属性,省去分号和属性名
let o2 = {x, y}
console.log(o2) // {x:1, y:2}
在对象中定义方法时,ES6以前需要,定义方法时需要像定义普通属性一样,通过函数表达式定义方法
let point={
x:1,
y:2,
area: function(){
return this.x*this.y
}
}
console.log(point.area()) //2
而ES6之后可以省略冒号和function关键字,以一种简单的方式来定义对象的方法。
let point2={
x:1,
y:2,
area(){
return this.x*this.y
}
}
console.log(point2.area()) //2
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:mmqy2019@163.com进行举报,并提供相关证据,查实之后,将立刻删除涉嫌侵权内容。
猜你喜欢
对于验证码详细大家都不陌生,我们在登录或者注册页面,常能看到验证码。而我们在做验证码的时候要考虑到,获取验证码的时间间隔,因为如果不设置这个,那么就会出现短时间或者大量验证码的情况,对此这篇文章就给大家介绍用JS实现间隔10秒载获取验证码的功能,感兴趣的朋友就继续往下看吧
这篇文章主要为大家详细介绍了vue实现移动端拖拽悬浮按钮,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
这篇文章主要为大家详细介绍了原生JavaScript实现简单五子棋游戏,文中示例代码注释的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
目录如何实现在当前表格直接更改数据需求效果如下具体做法useState修改对象的字段如何实现在当前表格直接更改数据需求用户点击修改按钮时直接在弹出框的当前页面内直接再次修改点击行相关信息:效果如下点击修改当事人信息时,直接将当前改为输入框,并将信息展示,同时操作栏内的内容变为保存和取消;具体做法我这里是使用的antd组
这篇文章主要为大家详细介绍了vue项目中canvas实现截图功能,截取图片的一部分,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
成为群英会员,开启智能安全云计算之旅
立即注册关注或联系群英网络
7x24小时售前:400-678-4567
7x24小时售后:0668-2555666
24小时QQ客服
群英微信公众号
CNNIC域名投诉举报处理平台
服务电话:010-58813000
服务邮箱:service@cnnic.cn
投诉与建议:0668-2555555
Copyright © QY Network Company Ltd. All Rights Reserved. 2003-2020 群英 版权所有
增值电信经营许可证 : B1.B2-20140078 粤ICP备09006778号 域名注册商资质 粤 D3.1-20240008