JavaScript es6中关于对象的扩展详解
一、现在还有很多浏览器不能直接使用es6语法。特别是手机端的一些低版本的浏览器。都需要用bale转换一下。
但是目前流行的框架中(vue,react,angular)。都有自己的脚手架,都能用webpack转换下。或者直接自己配置webpack , fis3,nowa 等转换。
照样不是美滋滋。
二、属性的简洁写法
//1.属性简洁表示语法 var foo = 'bar'; var obj = {foo}; console.log(obj); //创建对象的函数 function createOjb(x = 1,y = 1){ //x = 1, y = 1; 参数的默认值 return { x,y } } var newObj = createOjb(); console.log(newObj); //{x:1,y:1} var birthDate = '2017/8/12' //2 方法的简写 var person = { name:'绿巨人', age:'200岁', birthDate, say(){ console.log(this.name); //等同于 say:function(){ console.log(this.name)}; } } person.say(); // 绿巨人 //in 方法 var msg = { hello:'helloValue', world:'worldValue' } console.log('hello' in msg,'helloValue' in msg); // true,false; => 判断某个键值是在某个对象里面 //commonJS 模块化输出 function Obj(methods){ this.methods = methods || {}; } Obj.prototype.getItem = function(key){ return key in this.methods ? methods[key] : null; } Obj.prototype.setItem = function(key,value){ this.methods[key] = value; } var obj = new Obj(); //module.exports = {obj}; //4.注意点 :简洁写法的属性名总是字符串,这会导致一些看上去比较奇怪的结果。
三、属性表达式
//属性名表达式 // 1. 对象添加属性的两种方式 var newObj = new Object(); newObj.name = 'html'; newObj['age'] = '20岁'; //对象字面量的方式 se5 中字面量方式下 属性名字只能用 字符串形式。不能用 ['name'] var newObj1 = { name:'css', age:'30岁' } //SE6 var newObj2 = { ['name']:'js', ['a' + 'ge']:'40岁', ['hello world']:'say hello world', ['say' + ' hi'](){ console.log(this['hello world']) } } console.log(newObj2.name); // jss console.log(newObj2['hello world']); // say hello world newObj2['say hi'](); // say hello world //!!!注意 属性名表达式是不能喝属性简写一起使用的 var objKey = {a:1}; var newObj3 = { [objKey]:'我是一个对象' } console.log(newObj3); // {[object object]:'我是一对象'} console.log(newObj3[{a:1}]); // 我是一个对象 console.log(newObj3['object object']); // undefined 是不是很奇怪啊
以上是JavaScript es6中关于对象的扩展详解的详细内容。更多信息请关注PHP中文网其他相关文章!

热AI工具

Undresser.AI Undress
人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover
用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool
免费脱衣服图片

Clothoff.io
AI脱衣机

AI Hentai Generator
免费生成ai无尽的。

热门文章

热工具

记事本++7.3.1
好用且免费的代码编辑器

SublimeText3汉化版
中文版,非常好用

禅工作室 13.0.1
功能强大的PHP集成开发环境

Dreamweaver CS6
视觉化网页开发工具

SublimeText3 Mac版
神级代码编辑软件(SublimeText3)

Windows操作系统是全球最流行的操作系统之一,其新版本Win11备受瞩目。在Win11系统中,管理员权限的获取是一个重要的操作,管理员权限可以让用户对系统进行更多的操作和设置。本文将详细介绍在Win11系统中如何获取管理员权限,以及如何有效地管理权限。在Win11系统中,管理员权限分为本地管理员和域管理员两种。本地管理员是指具有对本地计算机的完全管理权限

OracleSQL中的除法运算详解在OracleSQL中,除法运算是一种常见且重要的数学运算操作,用于计算两个数相除的结果。除法在数据库查询中经常用到,因此了解OracleSQL中的除法运算及其用法是数据库开发人员必备的技能之一。本文将详细讨论OracleSQL中除法运算的相关知识,并提供具体的代码示例供读者参考。一、OracleSQL中的除法运算

人脸检测识别技术已经是一个比较成熟且应用广泛的技术。而目前最为广泛的互联网应用语言非JS莫属,在Web前端实现人脸检测识别相比后端的人脸识别有优势也有弱势。优势包括减少网络交互、实时识别,大大缩短了用户等待时间,提高了用户体验;弱势是:受到模型大小限制,其中准确率也有限。如何在web端使用js实现人脸检测呢?为了实现Web端人脸识别,需要熟悉相关的编程语言和技术,如JavaScript、HTML、CSS、WebRTC等。同时还需要掌握相关的计算机视觉和人工智能技术。值得注意的是,由于Web端的计

PHP中的模运算符(%)是用来获取两个数值相除的余数的。在本文中,我们将详细讨论模运算符的作用及用法,并提供具体的代码示例来帮助读者更好地理解。1.模运算符的作用在数学中,当我们将一个整数除以另一个整数时,会得到一个商和一个余数。例如,当我们将10除以3时,商为3,余数为1。模运算符就是用来获取这个余数的。2.模运算符的用法在PHP中,使用%符号来表示模

C语言作为一门广泛应用在软件开发领域的编程语言,是很多程序员初学者的首选。学习C语言不仅可以帮助我们建立编程的基础知识,还可以提升我们解决问题和思考的能力。本文将详细介绍一条C语言学习的路线图,帮助初学者更好地规划自己的学习进程。1.学习基本语法在开始学习C语言之前,我们首先需要了解C语言的基本语法规则。这包括变量和数据类型、运算符、控制语句(如if语句、

Linux系统调用system()函数详解系统调用是Linux操作系统中非常重要的一部分,它提供了一种与系统内核进行交互的方式。其中,system()函数是一个常用的系统调用函数之一。本文将详细介绍system()函数的使用方法,并提供相应的代码示例。系统调用的基本概念系统调用是用户程序与操作系统内核交互的一种方式。用户程序通过调用系统调用函数来请求操作系统

Linux的curl命令详解摘要:curl是一种强大的命令行工具,用于与服务器进行数据通信。本文将介绍curl命令的基本用法,并提供实际的代码示例,帮助读者更好地理解和应用该命令。一、curl是什么?curl是一个命令行工具,用于发送和接收各种网络请求。它支持多种协议,如HTTP、FTP、TELNET等,并提供了丰富的功能,如文件上传、文件下载、数据传输、代

Promise.resolve()详解,需要具体代码示例Promise是JavaScript中一种用于处理异步操作的机制。在实际开发中,经常需要处理一些需要按顺序执行的异步任务,而Promise.resolve()方法就是用来返回一个已经Fulfilled状态的Promise对象。Promise.resolve()是Promise类的一个静态方法,它接受一个
