网站动态维护客服_网页小程序开发_建网站要多少钱_百度seo查询系统

一、带参数默认值的函数

ES6之前，不能直接为函数的参数指定默认值，只能采用变通的方法。

        function log(x,y){y=y||'World';//y如果没有值则赋值Worldconsole.log(x,y);}log('Hello');//hello world

ES6 允许为函数的参数设置默认值，即直接写在参数定义的后面。

        function log(x,y='World'){console.log(x,y);}log('Hello');//hello world

默认的表达式可以是一个函数

        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 参数（形式为…变量名），称为剩余参数或可变参数。它允许函数接收不定数量的参数，这些多余的参数会被收集到一个数组中，使得处理多个参数变得更加简洁和易于维护。‌

        function add(...values) {let sum = 0;for (var val of values) {sum += val;}return sum;}console.log(add(1,2,3,4)) // 10

三、箭头函数

一、箭头函数

ES6允许使用箭头=>定义函数

	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、使表达更加简洁

	const isEven = n => n % 2 == 0;const square = n => n * n;

2.2、简化回调函数

	// 正常函数写法[1,2,3].map(function (x) {return x * x;});// 箭头函数写法[1,2,3].map(x => x * x);

三、箭头函数使用注意点

3.1、没有this绑定

        //点击打印事件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对象

        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关键字来实例化对象

      let Person = ()=>{}let p1 = new Person();// Person is not a constructor