JavaScript函数进阶


  • 能够说出函数的多重定义和调用方式
  • 能够说出和改变函数内部this的指向
  • 能够说出严格模式的特点
  • 能够把函数作为参数和返回值传递
  • 能够说出闭包的作用
  • 能够说出递归的两个条件
  • 能够说出深拷贝和浅拷贝的区别

函数的定义和调用

定义

  1. 函数声明方式function 关键字(命名函数)

  2. 函数表达式(匿名函数)

  3. new Function()

    var fn = new Function('参数1','参数2'...,'函数体')

所有函数都是Function的实例(对象)

调用

  1. 普通函数

    function fn(){
    }
    fn();  
    fn.call();
  2. 对象的方法

    var o ={
        f:function(){};
    }
    o.f();
  3. 构造函数

    function Star(){
    }
    new Star();
  4. 绑定事件函数

    btn.onclick() = function fn(){
    }
    点击按钮调用
  5. 定时器函数

    setInterval(function(){},time);
    定时器调用
  6. 立即执行函数

    (function fn(){})
    自动调用

    this

调用方式的不同,决定了this指向不同

JavaScript为我们提供了一些方法来处理内部this指向问题,常用的方法有bind(),call(),apply().

  1. call 方法可以调用函数,也可以改变函数内部的this指向主要。应用场景:继承
  2. apply 方法可以调用函数,也可以改变函数内部的this指向,但是他的参数必须是数组形式。应用场景:借助数学内置对象求最大值
  3. bind 方法不会调用函数,但可以改变函数内部的this指向。返回由指定的this值和初始化参数改造的原函数拷贝。应用场景:有的函数不需要立即调用

案例:点击禁用

var btn = document.querySelector('button');
btn.onclick = function(){
    this.disabled = this;
    setTimeout(function(){
        // this默认指向window
        this.disabled = false;
    }.bind(btn),3000)
}

严格模式

严格模式(兼容IE10)对正常的JavaScript语义做了一些更改:

  1. 消除了JavaScript语法的一些不合理,不严谨之处
  2. 消除了代码运行的一些不安全之处
  3. 提高编译器效率;
  4. 禁用ECMAScript的未来版本中可能会定义的一些语法。比如一些保留字:class,enum,export,extends,import,super

脚本严格模式 or 函数严格模式:

'use strict';  

严格模式下this指向问题

  1. 非严格模式下全局作用域函数中的this指向window对象,严格模式下全局作用域中的this是undefined。
  2. 非严格模式下构造函数不加new 也可以调用,this指向全局对象。严格模式下,构造函数需要加new使用,否则this会报错
  3. 定时器中的this指向还是window
  4. 事件对象还是指向调用者

严格模式下函数的变化

  1. 函数不能由重名的参数
  2. 不允许在非函数的代码块内声明函数

高阶函数

高阶函数是对其他函数进行操作的函数,它接收函数作为参数 或 将函数作为返回值输出。

闭包

闭包的主要作用:延伸了变量的作用范围

案例:循环注册点击

var lis = document.quarySelector('li');
// 动态添加属性
for(var i = 0;i < = lis.length;i++){
    lis[i].index = i;
    lis[i].onclick = function(){
        console.log(this.index);
    }
} 
// 利用闭包的方式
for(var i = 0;i < = lis.length;i++){
    (function(i){
            lis[i].onclick = function(){
        		console.log(i);
    	}
    })(i);
}

递归

如果一个函数在内部调用其本身,那么这个函数就是递归函数。

案例:递归求数学题

function fb(n){
    if(n == 1 || n == 2)
        return 1;
    return fb(n-1)+fb(n-2);
}

文章作者: linxueya
版权声明: 本博客所有文章除特別声明外,均采用 CC BY 4.0 许可协议。转载请注明来源 linxueya !
评论
  目录
喜迎
春节