这里写目录标题
一、带参数默认值的函数
ES6之前，不能直接为函数的参数指定默认值，只能采用变通的方法。
js
function log(x,y){
y=y||'World';//y如果没有值则赋值World
console.log(x,y);
}
log('Hello');//hello worldES6 允许为函数的参数设置默认值，即直接写在参数定义的后面。
js
function log(x,y='World'){
console.log(x,y);
}
log('Hello');//hello world默认的表达式可以是一个函数
js
function getVal(val){
return val+5;
}
function add2(a,b=getVal(5)){
return a+b;
}
console.log(add2(5));
//console.log(add2(5,20));二、rest参数
ES6 引入 rest 参数（形式为...变量名），称为剩余参数或可变参数。它允许函数接收不定数量的参数，这些多余的参数会被收集到一个数组中，使得处理多个参数变得更加简洁和易于维护。
js
function add(...values) {
let sum = 0;
for (var val of values) {
sum += val;
}
return sum;
}
console.log(add(1,2,3,4)) // 10三、箭头函数
一、箭头函数
ES6允许使用箭头=>定义函数
js
let f = x=>x;
//等同于
let f = function(x){
return x;
}
// 有一个参数
let add = value => value;
// 有两个参数
let add = (value,value2) => value + value2;
let add = (value1,value2)=>{
return value1 + value2;
}
// 无参数
let fn = () => "hello world";
let doThing = () => {
}
//如果箭头函数直接返回一个对象，必须在对象外面加上括号，否则会报错。
let getId = id => ({id: id,name: 'mjj'}) //注意
let obj = getId(1);二、箭头函数的作用
2.1、使表达更加简洁
js
const isEven = n => n % 2 == 0;
const square = n => n * n;2.2、简化回调函数
js
// 正常函数写法
[1,2,3].map(function (x) {
return x * x;
});
// 箭头函数写法
[1,2,3].map(x => x * x);三、箭头函数使用注意点
3.1、没有this绑定
js
//点击打印事件
let PageHandler = {
id: 123,
init: function () {
// 使用bind来改变内部函数this的指向
document.addEventListener('click', function (event) {
this.doSomeThings(event.type);
}.bind(this), false);
},
doSomeThings: function (type) {
console.log(`事件类型:${type},当前id:${this.id}`);
}
}
PageHandler.init();
let PageHandler = {
id: 123,
init: function () {
// 箭头函数没有this的指向，箭头函数内部的this值只能通过查找作用域链来确定
// 如果箭头函数被一个非箭头函数所包括，那么this的值与该函数的所属对象相等，否则 则是全局的window对象
document.addEventListener('click', (event) => {
console.log(this);
this.doSomeThings(event.type);
}, false);
},
doSomeThings: function (type) {
console.log(`事件类型:${type},当前id:${this.id}`);
}
}
PageHandler.init();3.2、箭头函数中没有arguments对象
js
var getVal = (a, b) => {
console.log(arguments);
return a + b;
}
console.log(getVal(1, 2)); //arguments is not defined
//这些写就不存在问题
function getVal(a,b){
console.log(arguments);
return a + b;
}arguments 内置对象：在 JavaScript 的 每个函数 的 内部都可以访问 内置的 arguments 对象 ,
3.3、箭头函数不能使用new关键字来实例化对象
js
let Person = ()=>{}
let p1 = new Person();// Person is not a constructor