ES6常用对象操作

一. const

简单类型数据常量

// const实际上保证的,并不是变量的值不得改动,而是变量指向的那个内存地址不得改动。对于简单类型的数据(数值、字符串、布尔值),值就保存在变量指向的那个内存地址,因此等同于常量。
const PI = 3.1415926;
console.log(PI)

对象常量

const foo = Object.freeze({});

// 常规模式时,下面一行不起作用;
// 严格模式时,该行会报错
foo.prop = 123;

除了将对象本身冻结,对象的属性也应该冻结。下面是一个将对象彻底冻结的函数。

var constantize = (obj) => {
Object.freeze(obj);
Object.keys(obj).forEach( (key, i) => {
if ( typeof obj[key] === 'object' ) {
constantize( obj[key] );
}
});
};

二. 属性的简洁表示

对象,函数都可以简写

var birth = '2000/01/01';
var Person = {
name: '张三',
//等同于birth: birth
birth,
// 等同于hello: function ()...
hello() { console.log('我的名字是', this.name); }
};

CommonJS模块输出变量,就非常合适使用简洁写法。

var ms = {};

function getItem(key) {
return key in ms ? ms[key] : null;
} function setItem(key, value) {
ms[key] = value;
} function clear() {
ms = {};
} module.exports = {
getItem,
setItem,
clear
};
// 等同于
module.exports = {
getItem: getItem,
setItem: setItem,
clear: clear
};

三. Object.is()

详解:http://www.cnblogs.com/Michelle20180227/p/8663847.html

+0 === -0 //true
NaN === NaN // false Object.is(+0, -0) // false
Object.is(NaN, NaN) // true

四. Object.assign()

用于对象的合并,如果目标对象与源对象有同名属性,或多个源对象有同名属性,则后面的属性会覆盖前面的属性。

var target = { a: 1 };

var source1 = { b: 2 };
var source2 = { c: 3 }; Object.assign(target, source1, source2);
target // {a:1, b:2, c:3}

注:

Object.assign 方法实行的是浅拷贝

var obj1 = {a: {b: 1}};
var obj2 = Object.assign({}, obj1); obj1.a.b = 2;
obj2.a.b // 2

常见用途:

(1)为对象添加属性

class Point {
constructor(x, y) {
Object.assign(this, {x, y});
}
}

(2)为对象添加方法

Object.assign(SomeClass.prototype, {
someMethod(arg1, arg2) {
···
},
anotherMethod() {
···
}
}); // 等同于下面的写法
SomeClass.prototype.someMethod = function (arg1, arg2) {
···
};
SomeClass.prototype.anotherMethod = function () {
···
};

(3)克隆对象

function clone(origin) {
return Object.assign({}, origin);
}

不过,采用这种方法克隆,只能克隆原始对象自身的值,不能克隆它继承的值。

想要保持继承链,可以采用下面的代码。

function clone(origin) {
let originProto = Object.getPrototypeOf(origin);
return Object.assign(Object.create(originProto), origin);
}

(4)合并多个对象

const merge =
(target, ...sources) => Object.assign(target, ...sources);
const merge =
(...sources) => Object.assign({}, ...sources);

(5)为属性指定默认值

const DEFAULTS = {
logLevel: 0,
outputFormat: 'html'
}; function processContent(options) {
options = Object.assign({}, DEFAULTS, options);
console.log(options);
// ...
}

由于存在深拷贝的问题,DEFAULTS对象和options对象的所有属性的值,最好都是简单类型,不要指向另一个对象。

五. 对象的扩展运算符

(1)解构赋值

let { x, y, ...z } = { x: 1, y: 2, a: 3, b: 4 };
x // 1
y // 2
z // { a: 3, b: 4 }

(2)扩展运算符

let z = { a: 3, b: 4 };
let n = { ...z };
n // { a: 3, b: 4 }

ES6常用对象操作的更多相关文章

  1. ES6常用对象操作整理

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

  2. es6常用数组操作及技巧汇总

    定义数组 const array = [1, 2, 3]; // 或者 const array = new Array(); array[0] = '1'; 检测数组 Array.isArray([] ...

  3. 原生JS中常用的Window和DOM对象操作汇总

    一.常用的Window对象操作 Window对象中又包含了document.history.location.Navigator和screen几个对象,每个对象又有自己的属性方法,这里window可以 ...

  4. SQL Server编程系列(2):SMO常用对象的有关操作

    原文:SQL Server编程系列(2):SMO常用对象的有关操作 在上一篇周公简单讲述了SMO的一些基本概念,实际上SMO体系结构远不止周公在上一篇中讲述的那么简单,下图是MSDN上给出的一个完整的 ...

  5. ES6常用新特性

    https://segmentfault.com/a/1190000011976770?share_user=1030000010776722 该文章为转载文章!仅个人喜好收藏文章! 1.前言 前几天 ...

  6. ES6常用语法总结

    ECMAScript 6(以下简称ES6)是JavaScript语言的下一代标准.因为当前版本的ES6是在2015年发布的,所以又称ECMAScript 2015.也就是说,ES6就是ES2015.虽 ...

  7. ES6常用特性

    以下是ES6排名前十的最佳特性列表(排名不分先后): Default Parameters(默认参数) in ES6 Template Literals (模板文本)in ES6 Multi-line ...

  8. JavaScript常用对象的方法和属性

    ---恢复内容开始--- 本文将简单介绍JavaScript中一些常用对象的属性和方法,以及几个有用的系统函数. 一.串方法 JavaScript有强大的串处理功能,有了这些串方法,才能编写出丰富多彩 ...

  9. Java的常用对象①②

    Java的常用对象① Java的常用对象有很多,这里只对lang包中常用的Object,Date(Calendar,DateFormat,Math),System,Runtime进行介绍.㈠Objec ...

随机推荐

  1. Selenium Web 自动化 - Selenium(Java)环境搭建

    Selenium Web 自动化 - Selenium(Java)环境搭建 2016-07-29 1 下载JDK JDK下载地址:http://www.oracle.com/technetwork/j ...

  2. Could not load file or assembly 'System.Core, Version=2.0.5.0

    项目中用的4.0,本机没问题,服务器上出现问题,查了一下发现  autofac 里面用的这个版本 解决:下载安装这个4.0的补丁 http://support.microsoft.com/kb/246 ...

  3. MXNET:卷积神经网络基础

    卷积神经网络(convolutional neural network).它是近年来深度学习能在计算机视觉中取得巨大成果的基石,它也逐渐在被其他诸如自然语言处理.推荐系统和语音识别等领域广泛使用. 目 ...

  4. [转]在Windows上安装RabbitMQ

    原文链接    翻译:xiezc 下载服务器 描述 下载   Windows系统安装程序(来自Bintray) 的RabbitMQ的服务器-3.7.4.exe (签名) Windows系统安装程序(来 ...

  5. [译]我们为何基于FreeBSD打造解决方案?

    [译注]翻译这篇文章,主要是觉得老外在思考问题时,勇于打破固有的技术栈积累,尝试不同的选择,从而找到最合适自己的技术方案.得到真正的实惠. Synergy SKY提供多种软件解决方案,本文想讨论的是关 ...

  6. Go指南_指针接收者

    源地址 https://tour.go-zh.org/methods/4 一.描述 你可以为指针接收者声明方法. 这意味着对于某类型 T,接收者的类型可以用 *T 的文法.(此外,T 不能是像 *in ...

  7. struts建立工程helloworld

    Java web环境:Tomcat + Jdk +eclipse java EE 创建一个能运行的java web工程,记得勾选上web.xml 下载struts库,目前最新2.5-2.16 all. ...

  8. 《objective-c基础教程》学习笔记(六)—— 复合方法

    今天我们要讲的复合,当然不是小情侣吵着分手,然后又在一起的复合. 复合遵循一个合成复用原则,又称为组合或者聚合复用原则.该原则的内容是:尽量使用对象组合,而不是继承来达到复用的目的.用聚合可以使系统更 ...

  9. HashMap,Hashtable,ConcurrentHashMap 和 synchronized Map 的原理和区别

    HashMap 是否是线程安全的,如何在线程安全的前提下使用 HashMap,其实也就是HashMap,Hashtable,ConcurrentHashMap 和 synchronized Map 的 ...

  10. python 字符串编码解码和格式化问题

    转自:https://www.liaoxuefeng.com/wiki/001374738125095c955c1e6d8bb493182103fac9270762a000/0013868191962 ...