一、对象和属性和方法

JavaScript中对象:

var person={name:"Jack",age:20};

或:

var name = "jack";
var age = 20;
var person = {name:name,age:age};
console.log(person.age); //20

ES6中的简洁表示:

let [name,age]=["jack",20];
let person = {name,age}; //等同person = {name: name,age: age}
console.log(person.age); //20

JavaScript中对象方法:

var person = {
SayHi:function()
{
console.log("hi");
}
}
person.SayHi(); //hi

ES6中简洁表示:

let person = {
SayHi()
{
console.log("hi");
}
}
person.SayHi();

ES6允许用表达式作为属性名,但是一定要将表达式放在方括号内:

var person = {["na"+"me"]:"jack",["a"+"ge"]:20};
console.log(person.age);

let str = "Hi";
let person = {
["Say"+str](){
console.log("hi");
}
}
person.SayHi();

注意点:属性的简洁表示法和属性名表达式不能同时使用,否则会报错:

let [name,age]=["jack",20];
let person = {["na"+"me"],["a"+"ge"]}; //报错

二、对象的扩展运算符...

取出参数对象所有可遍历属性然后拷贝到当前对象:

let stu1 = {name:"Jack",age:20,sex:"男"};
let stu2 = {...stu1};
console.log(stu2); //{name: "Jack", age: 20,sex:"男"}

合并两个对象:

let stu1BasicInfo = {name:"Jack",age:20,sex:"男"};
let stu1DetailInfo = {phone:"13524521457",mail:"ldh@163.com"};
let stu = {...stu1BasicInfo,...stu1DetailInfo};
console.log(stu);
//{name:"Jack",age:20,sex:"男",phone:"13524521457",mail:"ldh@163.com"}

拷贝对象时支持添加属性:

let stu1 = {name:"Jack",age:20,sex:"男"};
let stu2 = {...stu1,phone:"13554785452"};
console.log(stu2); //{name:"Jack",age:20,sex:"男",phone:"13554785452"}

添加的属性在拓展运算符后面,取添加的属性:

let stu1 = {name:"Jack",age:20,sex:"男"};
let stu2 = {...stu1,name:"rose",phone:"13554785452"};
console.log(stu2);
//{name:"rose",age:20,sex:"男",phone:"13554785452"}

添加的属性在拓展运算度前面,取扩展运算符内容:

let stu1 = {name:"Jack",age:20,sex:"男"};
let stu2 = {name:"rose",phone:"13554785452",...stu1};
console.log(stu2);
//{name:"Jack",phone:"13554785452",age:20,sex:"男"}

五、ES6之对象的更多相关文章

  1. ES6常用对象操作

    ES6常用对象操作 一. const 简单类型数据常量 // const实际上保证的,并不是变量的值不得改动,而是变量指向的那个内存地址不得改动.对于简单类型的数据(数值.字符串.布尔值),值就保存在 ...

  2. ES6 - 对象

    ES6为对象带来的新特性. 对象传统的写法: let person={ 'name':'Lily', 'say':function(){ alert('hello!'); } } 1.ES6中写法更简 ...

  3. 第五章 JavaScript对象及初识面向对象

    第五章   JavaScript对象及初识面向对象 一.对象 在JavaScript中,所有事物都是对象,如字符串.数值.数组.函数等. 在JavaScript对象分为内置对象和自定义对象,要处理一些 ...

  4. ES6新增对象方法的访问描述符:get(只读)、set(只写)

    Es6新增对象方法的访问描述符:get(只读).set(只写),可以直接使用,一般用于数据监听,用途类似于vue.$watch. var obj = { a:1, get bar() { return ...

  5. ADO.NET中的五大内置对象

    ADO.NET中的五大内置对象 学习链接:https://blog.csdn.net/wxr15732623310/article/details/51828677

  6. 一、虚拟环境.二、路由配置主页与404.三、2.x路由分发.四、伪静态.五、request对象.六、FBV与CBV.七、文件上传.

    一.虚拟环境 ''' 解决版本共存 1. 用pycharm选择File点击NewProject然后选择virtualenv创建一个纯净环境 2. 打开下载的目录将venv文件夹下的所有文件(纯净的环境 ...

  7. es6 javascript对象方法Object.assign()

    es6 javascript对象方法Object.assign() 2016年12月01日 16:42:34 阅读数:38583 1  基本用法 Object.assign方法用于对象的合并,将源对象 ...

  8. Excel VBA入门(五)Excel对象操作

    本章是本系列教程的重点.但我觉得应该不是难点.从第零章开始到学完本章,应该可以把VBA用于实战中了. Excel对象主要有4个: 工作薄 Workbook 工作表 Worksheet 单元格区域 Ra ...

  9. ES6 Promise对象then方法链式调用

    then()方法的作用是Promise实例添加解决(fulfillment)和拒绝(rejection)状态的回调函数.then()方法会返回一个新的Promise实例,所以then()方法后面可以继 ...

  10. ES6之对象的语法糖

    本文介绍下ES6中对象的一些拓展功能. 这三个语法糖在实际的项目开发中经常会见到.

随机推荐

  1. ubuntu输入正确密码重新跳到登录界面

     原因一:/etc/profile或者/etc/enviroment  配置错误 (很多开发人员在配置完java环境之后容易出现这种情况) 解决办法(已验证): 1,开机后在登录界面按下shift+c ...

  2. Linux 标准输入输出、重定向

    一 相关知识 1)默认地,标准的输入为键盘,但是也可以来自文件或管道(pipe |). 2)默认地,标准的输出为终端(terminal),但是也可以重定向到文件,管道或后引号(backquotes ` ...

  3. ORACLE数据库误操作DELETE并且提交数据库之后如何恢复被删除的数据

    一:根据时间来恢复: 1.查询数据库当前时间() select to_char(sysdate,'yyyy-mm-dd hh24:mi:ss') from dual; 2.查询删除数据时间点之前的数据 ...

  4. python02day

    回顾 1.编译型和解释型 编译型:一次性编译成二进制,再执行 执行效率高,但不能跨平台,开发效率低 代表语言:C 解释型:逐行解释成二进制,再执行 可以跨平台,开发效率高,但执行效率低 代表语言:py ...

  5. ApacheCN 计算机视觉译文集 20211110 更新

    OpenCV3 和 Qt5 计算机视觉 零.前言 一.OpenCV 和 Qt 简介 二.创建我们的第一个 Qt 和 OpenCV 项目 三.创建一个全面的 Qt + OpenCV 项目 四.Mat和Q ...

  6. 微信公众号之微信登录失败,redirect_uri域名与后台配置不一致,错误代码10003

    前几次也遇到过这个问题:没有注意,今天记一下 解决:把你出错页面的url复制出来,看下域名是多少,然后在相应的微信公众号位置加上该域名即可 第一步:登录微信公众号: 第二步:将文件下载后,利用工具传入 ...

  7. git reset HEAD 与 git reset --hard HEAD的区别

    感谢原文作者:天地逍遥 原文链接:https://www.jianshu.com/p/aeb50b94e6c0 git reset HEAD 是将咱暂存区和HEAD的提交保持一致 git reset ...

  8. rabbitMq使用guest登录不上的问题总结

    自己mac电脑上的mq在电脑关机(直接按电源键关机),在开机后,rabbitMq连不上了,报500错误. 1.在使用brew uninstall rabbitmq --force后; 2.我手动安装了 ...

  9. 为 ubuntu 切换更新源

    感谢大佬:https://blog.csdn.net/sudaning/article/details/83445677 目录 备份 修改源文件 更新列表 更新软件 备份 sudo cp /etc/a ...

  10. Firewalld防火墙——基础认知

    Firewalld防火墙 1.Firewalld概述 2.firewalld与iptables 的区别 3.firewalld区域的概念 4.firewalld数据处理流程 5.firewalld检查 ...