学习总结

109 阅读2分钟

基础学习:

第三课:

箭头函数

使用"箭头"(=>)定义函数
var f = v =>v;
箭头函数特性:
*1.函数体内的this值,绑定的定义时所在的作用域的this
 2.不可当作构造函数
 3.不可以使用arguments对象

用法eg:    
fuction fn(){} //语法: var f=()=> {}
1.var add = () => 2;
2.var add = a => a+2;  add(2);
3.var add = (a,b) => a+b;
4.var add = (a,b) => ({num:a+b}) 返回一个对象需要加()
5.var add = (a,b) => {
    if(a>b){
        a = 1;
    }
    return a+b
} 需要手动返回

this指向eg:
1.document.onclick=function(){
   /* var that = this;
    setTimeout(function(){
        console.log(this);
    },1000);*/
    console.log(this);
    //箭头函数中的this帮定所定义的作用域中的this  document
    setTimentout(()=>{
        cosnole.log(111);
    },1000 
}
2.document.onclick=()=>{
    // this 在window定义
    setTimentout(()=>{
        cosnole.log(111);
    },1000 
}
3.function fn(){}
    fn()// this 指向window
  document.onclick = fn //this指向doucment

函数的扩展

· 函数的参数默认值

给形参直接赋值
注意:在函数体中,不能用let或const再次声明,否则会报错    

· reset参数

reset参数(形式为...变量名),用于获取函数的多余参数,放在数组中可取代arguments

1.function fn(a=10){
    //let a = 100;// 错误用法,不能重复声明
    //a的默认值为10
    //a = a || 10
    console.log(a);
}
fn(1)
2. functon fn(...arr){//rest参数
    console.log(arguments);
    //arguments = [1,2,3]
    //arguments.push() 错误用法
    cosnole.log(arr);
    //arr=[1,2,3];真实数组
    //arr.push() 正确用法
}
 3. functon fn(a,...arr){//rest参数
    console.log(a);//1
     console.log(arr);//[2,3]
}
fn(1,2,3);

对象的扩展

· 简洁表示法

变量名和属性名相同,可直接写入变量名
函数可省略function关键字

· Object.assign(目标对象,[要合并的对象1,要合并的对象2,...])

用户合并对象,待对象的所有可枚举属性,复制到目标对象

省略function

1.var miaov = 10;
var o={
//miaov:miaov
  miaov 
}//{miaov:10}
2.var miaov = (function(){
    function add(){}
    function isFunction(){}
    function isArray(){}
    return {
        add,
        isFunction,
        isArray
    }
})();
3.var o={
    fn(){}//相当于 fun:function(){}
}

Object.assign()

var o  = {a:1};
var o1 = {b:2};
var o2 = {c:3};
Object.assign(o,o1,o2);//o={a:1,b:2,c:3}

function fn(option){
    let defaults ={
        a:'默认1',
        b:'默认2',
        c:'默认3'
    }
}
fn({
    a:1,
    b:2,
    c:3
})
Object.assign(defaults,option);