函数的扩展
箭头函数
- 只有一个参数 并且函数体只有一句话 那么参数可以省略() 返回值可以省略return
//原型
var fn(a){
return "箭头函数"
}
//箭头函数
var fn = a => "箭头函数"
- 如果箭头函数没有参数 或者有多个参数,那么参数中的()就不能省略
- 如果箭头函数的函数体有多条代码,就不能省略{},也不能省略return
var dm = () => {
var author = "宫崎骏"
return "《千与千寻》"
}
- 如果函数体只有一句话,并且返回值是对象,那么这个返回值必须使用()包起来
var dm = (name, author) =>({
name : name,
author : author
})
console.log(dm("《千与千寻》", "宫崎骏"))
ES6里的this指向
- 普通函数this,谁调用this就指向谁
function dm()= {
console.log("宫崎骏");
console.log(this);
}
f1();//this指向window
- 对象里面的方法 它里面的this指向就是当前这个对象
var object= {
dm:function(){
console.log("《千与千寻》");
console.log(this);
}
console.log("宫崎骏");
console.log(this);
}
object.dm();//this指向object
- 定时器里面的this 如果没有特殊的指向 那么 里面调用函数的this一定指向window
function dm()= {
console.log("宫崎骏");
console.log(this);
}
setTimeout(dm,1000);
- 在ES6里面 箭头函数的this指向 是继承自父级执行上下文中的this
var x = 11;
var obj = {
x: 22,
say: ()=>{
console.log(this.x);
}
}
obj.say(); // 输出的值为11
- 构造函数里面的this
(1)把构造函数当普通函数调用 this指向window
function Dm(name,author){
this.name = name,
this.author = author
}
Dm("《千与千寻》","宫崎骏")
(2)作为构造函数 this指向new关键字创建的实例化对象
var a = new Dm("《哈儿的移动城堡》", "宫崎骏")
(3) 当作为构造函数时 返回值默认是new关键字创建的实例化对象 但是如果手动添加返回值 ,那么如果是基本数据类型就不会影响;如果是复杂数据类型 ,那么就会覆盖掉默认的返回值。
function Student(name, age) {
this.name = name;
this.age = age;
console.log(this);
return [12, 13, 15];
}
var stu = new Student("千寻", 16);
console.log(stu.age);
总结:
- 普通函数 : this是在调用的时候确定,谁调用,this就指向谁
- 箭头函数 : this是在声明的时候就已经确定,而且不会改变,this是继承自父级执行上下文的this
Symbol
symbol是ES6新引入的一种基本数据类型 表示的是独一无二的值
特点
- symbol函数 生成的数据 是独一无二的 即便参数不一样 那么表示的值也是不一样
console.log(Symbol("happy") ==== Symbol("happy")) //false
console.log(Symbol() ==== Symbol());
- symbol没有字面量的写法
var arr= [12,32,43];
var obj = {};
- 他是新增的一种数据类型 使用typeof返回值是symbol
console.log(typeof(symbol));
- symbol不能使用new关键字来创建
var sy = new Symbol(); //Smbol is not a constructor
console.log(sy);
- 一般我们在创建数据的时候 最好加一个参数便于区分
var sy1 = Symbol("name");
var sy2 = Symbol();
console.log(sy1);
console.log(sy2);
var dm = {
a : "《龙猫》",
b : "《悬崖上的金鱼姬》",
[sy1]:"宫崎骏" //符号属性
}
共享符号
- symbol里面的这个for方法,参数是一个字符串,如果有这个值,那么就讲这个值返回;如果没有,就创建一个数值(在全局作用域内添加)
let yellow = Symbol("Yellow");
let yellow1 = Symbol.for("Yellow");
yellow === yellow1; // false
let yellow2 = Symbol.for("Yellow");
yellow1 === yellow2; // true
- Symbol.keyFor 这个方法返回 已经在全局作用域登记了的Symbol值的标记参数 如果没有登记 就返回undefined
let yellow1 = Symbol.for("Yellow");
Symbol.keyFor(yellow1); // "Yellow"
set
set的构造方法
- 增 add(数据) 添加一个数据到集合的末尾。如果这个数字原本就存在,那么就不进行任何操作
var s= new Set();
s.add(1);
s.add(3);
s.add(6);
s.add(3); //集合里面已经有的数据 再添加 就是无效的添加
s.add(7);
s.add(8);
console.log(s); //1,3,6,7,8
set只用Object.is 来判断两个值是否相等,但是专门对-0和+0做了处理,在set里面默认他们相等
s.add(-0);
s.add(+0);
console.log(s); //1,3,6,7,8,0 只加进去了一个零
s.add(NaN);
s.add(NaN);
console.log(s); //1,3,6,7,8,0,NaN 只加进去了一个NaN
- 查 has(数据) 判断set集合中是否存在查询的这个数据
console.log(s.has(1));//true
console.log(s.has(9));//false
- 删 delete(数据) 对集合里面的数据进行匹配,匹配成功就删除
console.log(s.delete(10));//false 表示没有匹配到的数据 删除失败
console.log(s.delete(NaN));//true 表示匹配到的数据 删除成功
- 清空 clear() 清空整个set集合,不需要传任何参数 clear方法是没有返回值的
console.log(clear());
- size属性 是获取set集合里面所有的元素的个数,但是size是只读属性,不能重新赋值
var v= new Set();
v.add(1);
v.add(3);
v.add(6);
colsole.log(v.size);//3
set集合的遍历
- for-of进行遍历 返回的item的每项的值
- forEach方法
forEach方法 是set集合的实例化方法,但是set集合没有下标,所以index和item否表示元素
//将set集合转换成数组
var s = new Set(["a", "b", "w", 12, 15]);
var arr= [];
s.forEach(function(item,index,s){
arr.push(item)
})
console.log(arr)
数组新方法
- filter方法
返回值是一个新数组 是用来检查数组的元素是否符合某一条件 把符合条件元素过滤出来
filter方法不会改变元素组
// 数组去重
var arr = [12, 15, 12, 46, 13, 16, 18, 16, 13];
var newarr = arr.filter(function(item,index,arr){
return arr.indexOf(item) == index;
})
console.log(newarr); //[12, 15,46,13,18]