Vue学习使用心得(二)：ES6基础知识

ES6语法标准

什么是ES6？

ECMAScript第6版标准。

前端发展历程

• 1.0时代
  • 最初的网页以HTML为主，是纯静态的网页。网页是只读的，信息流只能从服务的到客户端单向流通。开发人员也只关心页面的样式和内容即可。
• 2.0时代
  • 1995年，网景工程师Brendan Eich 花了10天时间设计了JavaScript语言。
  • 1996年，微软发布了JScript，其实是JavaScript的逆向工程实现。
  • 1997年，为了统一各种不同script脚本语言，ECMA（欧洲计算机制造商协会）以JavaScript为基础，制定了ECMAscript标准规范。JavaScript和JScript都是ECMAScript的标准实现者，随后各大浏览器厂商纷纷实现了ECMAScript标准。

ES5和ES6的新特性

let 和 const

之前，js定义变量只有一个关键字var，但是var定义的变量存在一些问题，比如，在循环内部定义的变量，在循环外仍能使用，而不会抛出is not defined。

let

let所声明的变量，只在let命令所在的代码块内有效。

const

const声明的变量是常量，不能被修改。

新增API

字符串

• includes()：返回布尔值，表示是否找到了参数字符串。
• startsWith()：返回布尔值，表示参数字符串是否在原字符串的头部。
• endsWith()：返回布尔值，表示参数字符串是否在原字符串的尾部。

Object

• keys(obj)：获取对象的所有key形成的数组
• values(obj)：获取对象的所有value形成的数组
• entries(obj)：获取对象的所有key和value形成的二维数组。格式：[[k1,v1],[k2,v2],…]
• assian(dest, ...src)：将多个src对象的值 拷贝到 dest中（浅拷贝）。

数组

• find(callback)：把数组中的元素逐个传递给函数callback执行，如果返回true，则返回该元素
• findIndex(callback)：与find类似，不过返回的是品牌到的元素的索引
• includes(callback)：与find类似，如果匹配到元素，则返回true，代表找到了。
• map：接收一个函数，将原数组中的所有元素用这个函数处理后放入新数组返回。
• reduce()：接收一个函数（必须）和一个初始值（可选），该函数接收两个参数：
  • 第一个参数是上一次reduce处理的结果
  • 第二个参数是数组中要处理的下一个元素

map方法举例：

 	// 有一个字符串数组，我们希望转为int数组
 	
 	let arr = ['1','20','-5','3'];
	console.log(arr);
	// ["1", "20", "-5", "3"]
	arr = arr.map(s => parseInt(s));
	console.log(arr);
	// [1, 20, -5, 3]

reduce()会从左到右依次把数组中的元素用reduce处理，并把处理的结果作为下次reduce的第一个参数。如果是第一次，会把前两个元素作为计算参数，或者把用户指定的初始值作为起始参数。

 	const arr = [1,20,-