ES6基础知识

特性

• 默认参数
• 模板文本
• 多行字符串
• 解构赋值
• 增强的对象文本
• 箭头函数
• Promises
• 块作用域构成 构造let和const
• Classes
• Modules

默认参数

var a = function(i=0,color='red'){}
//当i、color参数没有被传入值时，此参数有默认值

模板对象

语法： 反引号中${name}

var name = `My name is ${name}`;

多行字符串

使用反引号括起来就行了。

解构赋值

var obj = {
	name:'Rabby',
	age:100,
	id:123
}
let {name,age,id:studentId} = obj
document.write(name+age+studentId);

id:studentId 指对id进行重命名

箭头函数

var a = function(can){
    return can;
}

var a  = (can1,can2)=>{
    return can1+can2;
}
var a = can => return can;//参数只有一个时可以省略（），函数内只有一句话则可以省略{}

注意：
关于this：普通函数中，this指向window，在this函数中指向父级。

arguments参数将会报错

//对:
    var test = function(){
        console.log(arguments);    
    }
    test(1,23,4,5);
//错:
    var test = () = >{
        console.log(arguments);//报错    
    }  

块作用域和构造let和const

*对于var而言，声明的变量会提升至全局

for(var a=0;a<5;a++){
	console.log(a);// 0 1 2 3 4
}
console.log(a);//5

for(let a=0;a<5;a++){
	console.log(a);// 0 1 2 3 4
}
console.log(a);//undefined

Modules 模块

// A.js
function a(){}
function b(){}
function c(){}
export{//在这里面暴露想要暴露的方法函数
    a,
    b
}
//则c()在外部无法使用


//index.html
<script type="module">
	import{a,b}from ' ./module/A.js';
</script>

注意：
如果同时导入两个module js模块中含有重名函数，则会报错。
↑解决方法： import {a,b as bName} from ‘./module/A.js’

关于展开运算符（…)

• 展开数组

var a = [1,2]
var b = [2,3]
var c = [...a,...b]
console.log(c); //[1,2,2,3]

• 复制

var a = [11,2,3]
var b = [...a]
b[0] = "Rabby"
console.log(a,b) // [11,2,3]['Rabby',2,3]

• 参数

var test = (...arr) = >{
	console.log(arr); //1,2,3
}
test(1,2,3)

var test = (a,b,...arr) = >{
	console.log(arr); //3,4,5	
					//且，...arr只能是最后的
}
test(1,2,3,4,5)

var arr = [1,2,3]
var test = (a,b,c) = >{
	console.log(a,b,c); //1,2,3
}
test(...arr)

• 伪数组转换

function test(){
	var arr = [...arguments]
	console.log(arr)
}
test(1,2,3)

var oli = document.querySelectorAll('li')
var oliarr = [...oli]
console.log(oliarr)

• 对象

var obj1 = {
	name:'Rabby',
	age:21
}
var obj2 = {
	id:233,
	name:'QAQ'
}
var obj = {
	...obj1,
	...obj2
}
console.log(obj);//{name:'QAQ',age:21,id:233}

注意：当两个对象都有name的话，后面的name覆盖前面的name的值。
↑应用于页面数据修改时

btn.onclick = function(){
	var name = username.value
	var age = myage.value
	var newobj={
	...obj,
	name,
	age
	}
}