ES6 Object属性新的写法实例小结

本文实例讲述了ES6 Object属性新的写法。分享给大家供大家参考，具体如下：

之前我们定义一个对象特别麻烦，现在ES6简化了这些麻烦，在对象属性的新定义方法中存在以下的优化

我们之前定义对象属性的方法

var obj = {
 getName:function(firstName,lastName){
  return {firstName: firstName, lastName: lastName}
 }
}

比较的麻烦

ES6中属性新的定义方法，极简主义

var obj = {
 getName(firstName,lastName){
  return {firstName,lastName};
 }
}

简化了getter和setter方法，即：get和set关键字

var obj = {
 set _name(name) {
  this.name = name;
 },
 get _name() {
  return this.name;
 }
}
obj._name = 'Joh';
console.log(obj._name); // Joh

之前动态添加新属性的写法

var obj = {
 name:1
};
obj['x'] = 2;
obj.y = 3;

ES6 中动态添加新属性的写法

var obj = {
 name:1,
 ['x']:2,
 ['y']:3
}

代码更少更方便

在nodejs中导出对象的方法改进

var obj1 = {};
var obj2 = {};
module.exports = {obj1, obj2}; // 新的方式
/*
旧的方式：
module.exports.obj1 = obj1;
module.exports.obj2 = obj2;
甚至:
module.exports = {
 obj1:obj1,
 obj2:obj2
}
*/

更多关于JavaScript相关内容可查看本站专题：《javascript面向对象入门教程》、《JavaScript查找算法技巧总结》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结》

希望本文所述对大家JavaScript程序设计有所帮助。

赞 (0)

相关推荐

  • ES6 javascript中class静态方法、属性与实例属性用法示例

    本文实例讲述了ES6 javascript中class静态方法.属性与实例属性用法.分享给大家供大家参考,具体如下: 类相当于实例的原型, 所有在类中定义的方法, 都会被实例继承. 如果在一个方法前, 加上static关键字, 就表示该方法不会被实例继承, 而是直接通过类来调用, 这就称为" 静态方法". class Foo { static classMethod() { return 'hello'; } } Foo.classMethod() // 'hello' var foo

  • ES6知识点整理之函数对象参数默认值及其解构应用示例

    本文实例讲述了ES6知识点整理之函数对象参数默认值及其解构应用.分享给大家供大家参考,具体如下: 同函数数组参数一样,函数的对象参数的默认值和解构过程整理 函数对象参数的默认值与解构的形式 此处使用箭头函数来处理 : (({x,y})=>{ console.log(x, y); // // undefined undefined })({}); (({x=1,y=2})=>{ console.log(x,y); // 1 2 })({}); (({x=3, y=4}={})=>{ con

  • ES6数组与对象的解构赋值详解

    本文实例讲述了ES6数组与对象的解构赋值.分享给大家供大家参考,具体如下: 数组的解构赋值 基本用法 ES6允许按照一定的模式,从数组和对象中提取值,对变量进行赋值,这被称之为解构(Destructuring) // 以前为变量赋值,只能直接指定值 var a = 1; var b = 2; var c = 3; // ES6允许写成这样 var [a,b,c] = [1,2,3]; 本质上,这种写法属于"模式匹配",只要等号两边的模式相同,左边的变量就会被赋予对应的值. 下面是一些使

  • js es6系列教程 - 基于new.target属性与es5改造es6的类语法

    es5的构造函数前面如果不用new调用,this指向window,对象的属性就得不到值了,所以以前我们都要在构造函数中通过判断this是否使用了new关键字来确保普通的函数调用方式都能让对象复制到属性 function Person( uName ){ if ( this instanceof Person ) { this.userName = uName; }else { return new Person( uName ); } } Person.prototype.showUserNam

  • ES6新特性之Object的变化分析

    本文实例讲述了ES6新特性之Object的变化.分享给大家供大家参考,具体如下: Object的变化 1. ES6允许在对象中只写属性名,不写属性值,属性值为属性名对应的变量值. var a = 'hi'; var obj = {a}; console.log(obj); //Object {a: "hi"} 2.对象内方法的简写. var a = 'hi'; var obj = { name: 'ES6', a, sayHi(){ console.log(this.a+' '+thi

  • ES6 对象的新功能与解构赋值介绍

    ES6 通过字面量语法扩展.新增方法.改进原型等多种方式加强对象的使用,并通过解构简化对象的数据提取过程. 一.字面量语法扩展 在 ES6 模式下使用字面量创建对象更加简洁,对于对象属性来说,属性初始值可以简写,并可以使用可计算的属性名称.对象方法的定义消除了冒号和 function 关键字,示例如下: // Demo1 var value = "name", age = 18 var person = { age, // age: age ['my' + value]: 'Jenny

  • ES6中新增的Object.assign()方法详解

    前言 将A对象的属性复制给B对象,这是JavaScript编程中很常见的操作.下面这篇文章将介绍ES6的Object.assign()属性,可以用于对象复制. 在JavaScript生态系统中,对象复制有另外一个术语: extend.下面是两个JS库提供的extend接口: Prototype: Object.extend(destination, source) Underscore.js: _.extend(destination, *sources) Object.assign()介绍 E

  • ES6学习教程之对象字面量详解

    前言 本文主要给大家介绍了关于ES6对象字面量的相关内容,分享出来供大家参考学习,下面话不多说了,来一起看看详细的介绍吧. ECMAScript6使得声明对象字面量更加简单,提供了属性简写和方法简写功能,属性名计算的新特性. function getInfo(name, age, weight) { return { // 如果属性名和属性值同名可以利用.es6的属性简写 name, // 等同于 make: make age, // 等同于 model: model weight, // 等同

  • ES6学习教程之对象的扩展详解

    一. 属性的简洁表示法 ES6允许直接写入变量和函数作为对象的属性和方法.意思就是说允许在对象中只写属性名,不用写属性值.这时,属性值等于属性名称所代表的变量.下面分别举一个例子来说明: 属性: function getPoint(){ var x = 1 ; var y = 2; return {x,y} } 等同于 fucntion getPoint(x,y){ var x = 1 ; var y = 2; return {x:x,y:y} } 测试: getPoint();//{x:1,y

  • ES6知识点整理之对象解构赋值应用示例

    本文实例讲述了ES6知识点整理之对象解构赋值应用.分享给大家供大家参考,具体如下: ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构(Destructuring), 在对象的解构赋值中有一些需要注意的事项 初识对象的解构 var {name} = { name:'Joh', age:10 }; console.log(name); // Joh 通过解构的形式取出对象中的属性值 对解构出的属性进行重命名 var {name} = { name:'Joh', age:1

  • 浅析Javascript ES6新增值比较函数Object.is

    浅析Javascript ES6新增值比较函数Object.is

    在Object.is出现之前我们比较值使用两等号 "==" 或 三等号"===", 三等号更加严格,只要比较两方类型不同立即返回false. 另外,有且只有一个值不和自己相等,它是NaN 现在ES6又加了一个Object.is,让比较运算的江湖更加混乱. 多数情况下Object.is等价于"===",如下 1 === 1 // true Object.is(1, 1) // true 'a' === 'a' // true Object.is('

随机推荐