ES6常用对象操作
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常用对象操作的更多相关文章
- ES6常用对象操作整理
const 简单类型数据常量 // const实际上保证的,并不是变量的值不得改动,而是变量指向的那个内存地址不得改动.对于简单类型的数据(数值.字符串.布尔值),值就保存在变量指向的那个内存地址,因 ...
- es6常用数组操作及技巧汇总
定义数组 const array = [1, 2, 3]; // 或者 const array = new Array(); array[0] = '1'; 检测数组 Array.isArray([] ...
- 原生JS中常用的Window和DOM对象操作汇总
一.常用的Window对象操作 Window对象中又包含了document.history.location.Navigator和screen几个对象,每个对象又有自己的属性方法,这里window可以 ...
- SQL Server编程系列(2):SMO常用对象的有关操作
原文:SQL Server编程系列(2):SMO常用对象的有关操作 在上一篇周公简单讲述了SMO的一些基本概念,实际上SMO体系结构远不止周公在上一篇中讲述的那么简单,下图是MSDN上给出的一个完整的 ...
- ES6常用新特性
https://segmentfault.com/a/1190000011976770?share_user=1030000010776722 该文章为转载文章!仅个人喜好收藏文章! 1.前言 前几天 ...
- ES6常用语法总结
ECMAScript 6(以下简称ES6)是JavaScript语言的下一代标准.因为当前版本的ES6是在2015年发布的,所以又称ECMAScript 2015.也就是说,ES6就是ES2015.虽 ...
- ES6常用特性
以下是ES6排名前十的最佳特性列表(排名不分先后): Default Parameters(默认参数) in ES6 Template Literals (模板文本)in ES6 Multi-line ...
- JavaScript常用对象的方法和属性
---恢复内容开始--- 本文将简单介绍JavaScript中一些常用对象的属性和方法,以及几个有用的系统函数. 一.串方法 JavaScript有强大的串处理功能,有了这些串方法,才能编写出丰富多彩 ...
- Java的常用对象①②
Java的常用对象① Java的常用对象有很多,这里只对lang包中常用的Object,Date(Calendar,DateFormat,Math),System,Runtime进行介绍.㈠Objec ...
随机推荐
- 【java】解析java网络
目录结构: contents structure [+] 模拟Post与Get请求 设置Authorization头信息 基于TCP的网络编程 TCP协议简介 半关闭的Socket TCP长链接 TC ...
- 11G新特性 -- flashback data archive(1)
虽然可以依赖undo数据来查询row的旧版本数据,甚至可以执行逻辑恢复.但是你不能期待在undo中找到非常旧的数据.undo数据主要是用来提供读一致性. 在11G中,提供了Flashback Data ...
- tensorflow 笔记10:tf.nn.sparse_softmax_cross_entropy_with_logits 函数
函数:tf.nn.sparse_softmax_cross_entropy_with_logits(_sentinel=None,labels=None,logits=None,name=None) ...
- Future 模式简介
简介 Future 模式是多线程开发中的一种常见设计模式,它的核心思想是异步调用. 比如我们在网上购物,付款后就会产生一个订单,之后你该干嘛干嘛,快递小哥会上门送货,而不必像在超市结账那样,付款后要等 ...
- java.lang.NoSuchFieldError: No static field abc_ic_ab_back_mtrl_am_alpha of type I in class Landroid/support/v7/appcompat/R$drawable
出现java.lang.NoSuchFieldError: No static field abc_ic_ab_back_mtrl_am_alpha of type I in class Landro ...
- (原)阅读Android-Camera2Video的demo源码和调试心得
转载请注明出处:http://www.cnblogs.com/lihaiping/p/6142512.html 最近因为项目需要使用到camera的功能,所以针对官方的demo源码进行一番阅读,并 ...
- PHP最全笔记(一)(值得收藏,不时翻看一下)
PHP笔记来啦~绝对干货! 以下为我以前学PHP时做的笔记,时不时的也会添加一些基础知识点进去,有时还翻出来查查. //语法错误(syntax error)在语法分析阶段,源代码并未被执行,故不会有任 ...
- java-信息安全(十三)-数字签名,代码签名【Java证书体系实现】
概述 信息安全基本概念 前置 java-信息安全(十二)-数字签名[Java证书体系实现] 过程 通过工具JarSigner可以完成代码签名. 这里我们对tools.jar做代码签名,命令如下: 进 ...
- mysql+redis
微博的系统架构,想用mysql+redis配合使用,具体操作步骤: 写入数据到Redis,,然后在写个运行cron的脚本,美妙读内存,并写入数据库即可. 使用注意: 1.MySQL使用需要注意的地方: ...
- [React] 12 - Redux: async & middleware
Ref: Redux 入门教程(二):中间件与异步操作 这里只是简单地了解中间件的概念,对于异步,貌似之后要讲的saga更胜一筹. reducer计算新状态的策略: Action 发出以后,Reduc ...