ES6学习笔记-扩展的对象功能、解构

以下内容整理自 阮一峰 的《ECMAScript 6 入门》 第三章、一些其他网络资源及帅气博主的自我理解。

扩展的对象功能

在ES5中,我们对于对象都是以键值对的形式书写,是有可能出现键值对重名的情况

function people(name,age){
	return {
		name:name,
		age:age
	}
}

键值对重名,ES6可以简写成以下:

function people(name,age){
 	return{
 		name,
 		age
 	}
}

ES6同样改进了为对象字面量方法赋值的语法。

ES5为对象添加方法:

const people = {
	name:'lux',
	getName:function(){
		console.log(this.name);
	}
}

ES6通过省略冒号与funciton关键字,让其变得更整洁。
不过话说回来,我真心觉得es6对function这个关键字有着杀父之仇,能弄掉的地方全拿掉了。

const people = {
	name:'will',
	getName(){
		console.log(this.name);
	}
}

ES6浅拷贝 Object.assign()
Object.assign()可以把任意多个源对象自身可枚举的属性拷贝给目标对象,然后返回目标对象。第一参数即为目标对象。在实际项目中,我们为了不改变源对象,一般会把目标对象传为{}

const objA = { name:'cc',age:18 }
const objB = { address:'beijing' }
const objC = {} // 这个为目标对象
const obj = Object.assign(objC,objA,objB)

//我们来把 这几个变量输出来看看
 console.log(objA)   // { name: 'cc', age: 18 }
console.log(objB) // { address: 'beijing' }
console.log(objC) // { name: 'cc', age: 18, address: 'beijing' }
console.log(obj) // { name: 'cc', age: 18, address: 'beijing' }


//我们发现,目标对象objC的值也被改变了。
//so,如果objC也是你的一个源对象的话。请在objC前面填在一个目标对象{}
const obj = Object.assign({},objC,objB,objA)

解构

数组和对象是JS中最常用的表示形式。为了简化提取信息,ES6新增了解构,它能够按照一定的模式,从数组和对象中提取值,对变量进行赋值。

在ES5中我们提取对象中的信息形式如下:

const people = {
	name:'will',
	age:23
}
const name = people.name
const age = people.age
console.log(name + ' --- ' + age)

也就是说在es5中,我们只能一个一个获取。
但是有了解构,就能让我们从对象或者数组中取出数据存为变量。

//对象
const people = {
	name:'will',
	age:23
}
const { name,age } = people
console.log(`${name} --- ${age}`)

//数组
const color = ['red','blue']
const [first, second] = color
console.log(first)
console.log(second)

老铁,整两道测试题吧

    // 请使用 ES6 重构一下代码

    // 第一题
    var jsonParse = require('body-parser').jsonParse

    // 第二题
    var body = request.body
    var username = body.username
    var password = body.password
1.import { jsonParse } from 'body-parser'

2.	const { body , body:{ usename , password } } = request																				

你可能感兴趣的:(ES6)