对未定义的参数的解决办法（默认参数值）
// ES5的解决办法
let sum = function sum(a,b){
b = (b || 0); //处理未定义的b
return a + b;
};
sum(1);//此时b是未定义的
//ES6的解决办法
let sum = (a=0,b=0) => {
//当未传入参数的时候，默认a=0,b=0
return a + b;
};
sum(1,);//此时b是未定义的
在调用时解析
在函数被调用时，参数默认值会被解析，所以不像Python中的例子，JS每次调用时都会创建一个新的参数对象。
function push(item,array=[]){
array.push(item)
return array
}
console.log(push(1)) //[1]
console.log(push(2)) //[2]
//以上两个数组是不同的数组，JS每次都会新声明一个数组
剩余参数 (...numbers 就是剩余参数，这个变量numbers是一个数组)
不知道传入的参数的个数
//ES5的解决办法
function sum(){
let result = 0;
for(let i = 0; i < arguments.length; i++){
result += arguments[i]
}
return result;
console.log(arguments); //伪数组
}
sum(1,2,3);
//将arguments分成两部分,
function sum(message){
let result = 0;
for(let i = 1; i < arguments.length; i++){
result += arguments[i]
}
return message + result
}
sum('结果是',1,2,3,4,4)
//分割方法
function sum(message,...numbers){
let result = 0;
for(let i = 0; i < numbers.length; i++){
result += numbers[i]
}
return message + result
}
sum('结果是',1,2,3,4,4)
//ES6的解决办法
function sum(message,...numbers){
let result = 0;
result = numbers.reduce((p,v) => p+v,0)
return result;
}
sum('结果是',1,2,3);
//多种方法的结合
function sum(message){
let args = [...arguments]
console.log(args)
let numbers = args.slice(1)
let result = 0
for(let i = 0; i < numbers.length; i++){
result += numbers[i]
}
return message + result
}
sum('结果是',2,4,6)
将伪数组变成数组的方法
//ES5的方法
let args = Array.prototype.slice.call(arguments)
//ES6的方法一：
let args = Array.from(arguments)
//ES6的方法二：（ES6的语法糖）
let args = [...arguments]
...xxx,这个参数必须是最后一位。
var [a,b,...rest,c] = [10,20,30,40,50] //会报错，...rest必须是最后一位
var [a,b,...rest] = [10,20,30,40,50] //正确
展开操作
- 使array2等于array1三项之后的全部内容
//使array2等于array1三项之后的全部内容
let array1 = [1,2,3,4,5,6]
let [a,b,c,...array2] = array1
console.log(array2)
//第二种方法
let array1 = [1,2,3,4,5,6]
let [,,,...array2] = array1
console.log(array2)
- 复制一个array1，在array1前面添加一个0，在array1后面添加一个7
let array1 = [1,2,3,4,5,6]
let array2 = [0,...array1,7]
console.log(array2)
//ES5的写法
let array1 = [1,2,3,4,5,6]
let array2 = [0].concat(array1).concat(7)
结构赋值
- 交换a和b的值
//ES5
a = 1
b = 2
temp = a
a = b
b = temp
//ES6
var a = 1;
var b = 2;
[a,b] = [b,a];
- 获取对象的全部属性
var frank = {name: 'frank',age: 18,gender: 'Mela'}
//ES5
var name = frank.name
var age = frank.age
var gender = frank.gender
//ES6的语法糖
var {name,age,gender} = frank
- 默认参数和结构赋值的结合
var [a = 1,b = 2] = [3,4]
//当a和b被赋值3和4，那么a=3,b=4，否则没有赋值，a=1,b=2
- 看函数的返回值（return）
var f = function(){
return [1,2]
}
var [a,b] = f //a = 1,b = 2,看f的return
var f =function(){
return [1,2,3]
}
var [a, ,b] = f //a=1,b=3
- 取对象中嵌套对象的函数值
//取child的name值
var frank = {name: 'frank',age: 18,gender: 'Mela',child{
name: 'tom',age: 12
}}
var {child:{name}} = frank //tom
//改变frank的name 的参数名
var {name:xingming} = frank //xingming:'frank' name这个参数名字被改了
//所有额语法结合起来
var{child:{name:xingming='aa',age}} = frank
**其中frank是被结构的对象，不是默认值**
- 拷贝一个对象（浅拷贝:大家共用对象）
//ES5，浅拷贝
let objA = {name: 'a'}
let objB = Object.assign({},objA)
objB.name = "b"
console.log(objA.name) //a
//改变objB的值不会影响objA，因为a是一个字符串，完整的被拷贝过来
let objA = {
name: {
x: 'a'
}
}
let objB = Object.assign({},objA)
objB.name.x = "b"
console.log(objA.name.x) //b
//改变objB的值改变了objA,因为浅拷贝，拷贝的只是一个地址，不是一个对象
//ES6的语法糖
let objA = {
name: {
x: 'a'
}
}
let objB = {...objA} //把objA的所有内容浅拷贝过来
- 模式合并
let objA = {
p1: 1,
p2: 2
}
let objC = {
p1: 111,
p3: 3
}
//ES5
let objB = Object.assign({},{objA},{objB}) //{p1:111,p2:2,p3:3}
//ES6的语法糖
let objB = {...objA,...objc} //在后面的胡覆盖在前面的。
对象属性加强
- 合并成对象
var x = 1
var y = 2
//ES5
var obj = {
'x': x,
'y': y
}
//ES6
var obj = {x,y}
- 函数的合并
var obj = {
sayHi: function(name){},
sayHello: function(name){}
}
//ES6
var obj = {
sayHi(name){},
sayHello(name){}
}
- 示例
//一个对象的所有的语法
var x = 1
var y = 2
var obj1 = {name:1,age:2}
var obj2 = {
z:1,
x,
y,
...obj1,
sayHi(name = 'jack'){},
sayHello(name){},
sayBye:function(){}
}
- 声明一个对象，对象中包含所给的变量Key
var key = 'x'
var value = 'y'
//ES5
var obj = {}
obj[key] = value
console.log(obj) //{'x':'y'}
//ES6
var obj = {
[key]:value
}
//动态的key值就用[]括起来
网友评论