箭头函数
箭头函数:将原来函数的function关键字和函数名都删掉,并应用”=>”连贯参数列表和函数体。
箭头函数语法:
(参数1,参数2)=>{
函数体
}
留神点:
- 当参数有且只有一个,括号能够省略。没有参数或多个参数时,括号不能省略。
- 如果函数体有且只有一个表达式时,能够省略花括号。
箭头函数应用实例:
window.onload = ()=>{ console.log('网页加载实现')}
参数只有一个时,省略掉括号。函数体只有一个表达式,花括号也省略。如:
let arr=[1,2,3,4]arr.forEach((item)=> console.log('item',item))
This指向问题
1、在全局环境下,this始终指向全局对象,无论是否严格模式。
2、一般函数外部的this分严格模式和非严格模式。
- 严格模式下this为undefined。
- 非严格模式下,this指向全局对象window。
3、箭头函数的 this 是上下文的this。
箭头函数相当于匿名函数,并且简化了函数定义,但箭头函数和匿名函数有个显著的差别,箭头函数外部的this是词法作用域,上下文的this值作为本人的this值。
- Call()、apply()、bind()办法对于箭头函数只是传入参数,对它的this毫无影响。
- 思考到this是词法层面上的,严格模式中与this相干的规定都将被疏忽。
放在setTimeout中的两个箭头函数返回的this举例。
function Person(name,age){ this.name = name; this.age = age; setTimeout(()=>{ console.log('this',this) //Person {name: "倩倩", age: 18} },100)}let p = new Person('倩倩',18)setTimeout(()=>{ console.log("this",this)//Window {window: Window, self: Window, document: document, name: "", location: Location, …}},1000)
函数参数的默认值
在ES6之前,不能间接为函数的参数指定默认值,只能采取变通措施。
实例:一般函数给参数设置默认值
function sum(a,b){ a = a | 12; b = b | 5; return a+b}console.log('相加等于',sum())// 17
ES6容许函数参数设置默认值,即间接写在参数定义的前面。如
function sum(a=12,b=5){ return a+b}console.log('相加等于',sum())
ES6默认参数长处:
- 简洁,实用于参数多的时候,不便设置默认值。
- 浏览代码的人能够看出哪些参数是能够省略的,不必查看函数体或文档。
- 有利于代码的优化,即便将来版本拿掉这个参数,以前代码也能够运行,还有参数变量是默认申明的,不能在函数体外部再进行申明。
与构造赋值联合应用
function add({x=1,y=2}={}){ return x+y}console.log('相加等于',add({x:2})) // 相加等于 4
ES6函数不定参数和开展运算符
不定参数:
语法:...
类型:数组
作用:指定多个各自独立的参数,通过整合后的数组来拜访。
限度:
- 最多只能申明一个
- 只能放在参数开端
实例:简略利用
function show( a, ...args){ console.log('a',a) console.log('args',...args)}show(1,2,3)
开展运算符:
语法:...
作用:指定数组或对象,将他们打散后作为各自独立的参数。
实例:应用开展运算符开展数组。
let arr = ['a','b','c']let arr2 = []arr2.push(...arr)console.log('arr2',arr2)
实例:应用开展运算符开展对象。
let person = { name :'倩倩', age:18}let worker = { ...person, job:"打杂"}console.log('worker',worker)//{name:'倩倩',age:18,job:'打杂'}