第一:字面量对象的方法,支持缩写形式

         //es6之前,这么写
var User = {
name : 'ghostwu',
showName : function(){
return this.name;
}
};
console.log( User.showName() );
         //有了es6之后,这么写
let User = {
name : 'ghostwu',
showName (){
return this.name;
}
};
console.log( User.showName() );

方法缩写规则: 在原来的基础上去掉 冒号 和 function关键字

第二:对象中的属性与变量名或者参数 同名的时候, 可以省略赋值的操作

         //参数与属性同名
let User = function( name, age ){
return {
name : name,
age : age
}
};
let oUser = User( 'ghostwu', 22 );
console.log( oUser.name, oUser.age );

上面例子中的写法,可以简写为:

         let User = function( name, age ){
return {
name, //省略name的赋值, 会在作用域中查找同名的name变量或者参数
age //省略age的赋值,会在作用域中查找同名的age变量或者参数
}
};
let oUser = User( 'ghostwu', 22 );
console.log( oUser.name, oUser.age );
         let User = function(){
let name = 'ghostwu', age = 26;
return {
name, //查找到同名变量name,赋值给name属性
age //查找到同名变量age,赋值给age属性
}
};
let oUser = User();
console.log( oUser.name, oUser.age );
         let User = function(){
let name = 'ghostwu', age2 = 26;
return {
name,
age //当没有同名变量或者参数时,省略写法会报错
}
};
let oUser = User();
console.log( oUser.name, oUser.age );
             let User = function( name, age ){//形参相当于var name, var age
let name = 'ghostwu', age = 26;//let不能重定义, 报错
return {
name,
age
}
};
let oUser = User( 'zhangsan', 20 );
console.log( oUser.name, oUser.age );

如果同时出现同名参数和let定义的同名变量时候,会报语法错误,如果不知道为什么,请看下我之前写的博客文章:

[js高手之路] es6系列教程 - var, let, const详解

第三:可计算属性名, 即: 属性名支持表达式参与运算

          let User = {};
let lastName = "last Name"; User['first Name'] = 'ghost';
User[lastName] = 'wu'; //lastName被解释为last name, 从而等价于User['last Name'] = 'wu'
console.log( User['first Name'] , User['last Name'] );
         let User = {
"full Name" : "ghostwu",
// first Name : "ghostwu" //属性名包含空格或者特殊符号要用引号或者转义处理,否则报错
};
console.log( User['full Name'] );
         let firstName = 'first name';
let lastName = 'last name';
//属性名如果用中括号括起来,属性名就被解释成了变量
let User = {
[firstName] : 'ghost',
[lastName] : 'wu',
}; console.log( User['firstName']); //undefined
console.log( User['lastName']); //undefined
console.log( User['first name']); //ghost
console.log( User['last name']); //wu

用中括号把属性括起来,属性就变成了变量,变量就可以用操作符组合成表达式,参与运算,所以叫计算表达式

         let suffix = ' Name';
let User = {
['first' + suffix] : 'ghost',
['last' + suffix] : 'wu',
};
console.log( User['first Name'], User['last Name']);

[js高手之路] es6系列教程 - 对象功能扩展详解的更多相关文章

  1. [js高手之路] es6系列教程 - 迭代器与生成器详解

    什么是迭代器? 迭代器是一种特殊对象,这种对象具有以下特点: 1,所有对象都有一个next方法 2,每次调用next方法,都会返回一个对象,该对象包含两个属性,一个是value, 表示下一个将要返回的 ...

  2. [js高手之路] es6系列教程 - promise常见用法详解(resolve,reject,catch,then,all,race)

    关于promise我在之前的文章已经应用过好几次,如[js高手之路]Node.js+jade+express+mongodb+mongoose+promise实现todolist,本文就来讲解下pro ...

  3. [js高手之路] es6系列教程 - var, let, const详解

    function show( flag ){ console.log( a ); if( flag ){ var a = 'ghostwu'; return a; } else { console.l ...

  4. [js高手之路] es6系列教程 - 迭代器,生成器,for...of,entries,values,keys等详解

    接着上文[js高手之路] es6系列教程 - 迭代器与生成器详解继续. 在es6中引入了一个新的循环结构for ....of, 主要是用来循环可迭代的对象,那么什么是可迭代的对象呢? 可迭代的对象一般 ...

  5. [js高手之路] es6系列教程 - 函数的默认参数详解

    在ES6之前,我们一般用短路表达式处理默认参数 function show( a, b ){ var a = a || 10; var b = b || 20; console.log( a, b ) ...

  6. [js高手之路] es6系列教程 - 箭头函数详解

    箭头函数是es6新增的非常有意思的特性,初次写起来,可能会觉得别扭,习惯之后,会发现很精简. 什么是箭头函数? 箭头函数是一种使用箭头( => )定义函数的新语法, 主要有以下特性: 不能通过n ...

  7. [js高手之路] es6系列教程 - 不定参数与展开运算符(...)

    三个点(...)在es6中,有两个含义: 用在形参中, 表示传递给他的参数集合, 类似于arguments, 叫不定参数. 语法格式:  在形参面前加三个点( ... ) 用在数组前面,可以把数组的值 ...

  8. [js高手之路]es6系列教程 - 解构详解

    解构通俗点说,就是通过一种特定格式,快捷的读取对象/数组中的数据的方法, es6之前,我们通过对象名称[键] 读取数据 var User = { 'name' : 'ghostwu', 'age' : ...

  9. [js高手之路] es6系列教程 - Set详解与抽奖程序应用实战

    我们还是从一些现有的需求和问题出发,为什么会有set,他的存在是为了解决什么问题? 我们看一个这样的例子,为一个对象添加键值对 var obj = Object.create( null ); obj ...

随机推荐

  1. SpringMVC中使用Swagger2整合

    Swagger2是什么 Swagger 是一款RESTFUL接口的文档在线自动生成+功能测试功能软件. Swagger 是一个规范和完整的框架,用于生成.描述.调用和可视化 RESTful 风格的 W ...

  2. Codeforces Round #419 (Div. 2)

    1.题目A:Karen and Morning 题意: 给出hh:mm格式的时间,问至少经过多少分钟后,该时刻为回文字符串? 思路: 简单模拟,从当前时刻开始,如果hh的回文rh等于mm则停止累计.否 ...

  3. 这是您一直期待的所有iOS 11功能的屏幕截图

    Tips 原文作者:Chris Mills 原文地址:Here's all the iOS 11 screenshots you've been waiting for 除非你已经深陷VR其中,否则现 ...

  4. Android 音乐播放

    android简单音乐播放控制代码 这个几个月业余时间一直在做一个android项目,里面涉及到了音乐播放功能.很简单那种,播放.暂停.上一曲.下一曲.音量调节等. 音乐播放主要使用的对象是Media ...

  5. Ext TabPanel tabbar添加按钮

    tabPanel tabbar添加按钮 this.tabPanel = Ext.create('Ext.tab.Panel', { tabBar:{ items:[{ //组件靠右 xtype: 't ...

  6. const vector<int> 和 vector<const int>问题讨论

    1.const vector <int> vec(10) —— 与const int a[10]是一回事,意思是vec只有10个元素,不能增加了,里面的元素也是不能变化的 vector&l ...

  7. accp8.0转换教材第1章多线程理解与练习

    一.单词部分: ①process进程 ②current当前的③thread线程④runnable可获取的 ⑤interrupt中断⑥join加入⑦yield产生⑧synchronize同时发生 二.预 ...

  8. 多个Tomcat 配置多个JDK

  9. Linux程序设计之shell程序设计

    看了<linux程序设计(第4版)>(作者:Neil Matthew ,Richard Stones ,陈建 ,宋健建译).做个笔记,以备后面查看. 首先,清楚几个概念. shell编程属 ...

  10. 二、redis集群搭建

    redis集群搭建 redis3.0后支持集群.集群中应该至少有三个节点,每个节点有一备份节点.需要6台服务器.搭建伪分布式,需要6个redis实例.搭建集群的步骤: 一.安装单机版redis 第一步 ...