zoukankan      html  css  js  c++  java
  • 函数的自执行,变量提升和函数提升

    其实之前虽然刚开始学习JavaScript的时候经常看到function  add(){}、var add=function(){}、function(){}之类的这种写法,但是具体是什么叫什么却没有去考虑过这个问题……

    function add(){}这种写法叫做函数声明

    var add=function(){}这种写法叫做函数表达式

    function(){}这种是匿名函数

    一、函数的自执行

    那么有没有办法让它们不用通过我们的调用比如

    function add(){};
    add();

    就可以自我执行呢?

    我们来试试看这三种方法

    //函数表达式自执行尝试
    var add=function(x,y){
        console.log(x+y);
    }(5,6);     //结果:11(正确)
    //函数声明自执行尝试
    function add(x,y){
        console.log(x+y);
    }(5,6);    //结果:无法执行,也没有抛出错误
    //匿名函数自执行尝试
    function(){
        console.log(arguments[0]+arguments[1]);
    }(5,6);     //结果:这个的问题就大了,抛出语法错误Uncaught SyntaxError: Unexpected token (

    函数表达式后面加括号可以立即执行函数,然而函数声明却不可以!!

    很奇怪地,匿名函数也是函数表达式,但是它为什么会抛出语法错误呢?这是因为匿名函数虽然属于函数表达式,但是很明显它没有赋值操作,JavaScript解析引擎会把它当做函数声明,会跟你要一个函数名,但是它是匿名函数,肯定没有名字,JavaScript混了,直接给你个错误让你反省一下。

    那要怎么解决匿名函数自执行这个问题?其实很简单,只要告诉JavaScript解析器匿名函数不是函数声明就好了。

    //加号
    +function(){
        console.log(arguments[0]+arguments[1]);
    }(5,6);
    //减号
    -function(){
        console.log(arguments[0]+arguments[1]);
    }(5,6);
    //感叹号
    !function(){
        console.log(arguments[0]+arguments[1]);
    }(5,6);
    //括号
    (function(){
        console.log(arguments[0]+arguments[1]);
    })(5,6);
    (function(){
        console.log(arguments[0]+arguments[1]);
    }(5,6));

    接下来就是解决函数声明自执行的问题了,其实方法跟匿名函数自执行的方法是一样的,加号,减号,感叹号,括号,都可以解决

    !function add(x,y){
        console.log(x+y);
    }(5,6);
    +function add(x,y){
        console.log(x+y);
    }(5,6);
    -function add(x,y){
        console.log(x+y);
    }(5,6);
    (function add(x,y){
        console.log(x+y);
    })(5,6);
    (function add(x,y){
        console.log(x+y);
    }(5,6));

    二、变量提升、函数提升

    函数声明才会提升,函数表达式是属于变量提升

    我们先来看一下下面这段代码的结果是什么

    console.log(a);
    console.log(b);
    console.log(c);
    var a=1;
    function b(){
        return 2;
    }
    var c=function(){
        return 3;
    }

    结果

    console.log(c)的结果跟console.log(a)是一样的,说明函数表达式是属于变量提升的。这样证明还是有点草率,我们再来看看下面的代码

    console.log(b());
    console.log(c());
    function b(){
        return 2;
    }
    var c=function(){
        return 3;
    }

    结果

    结果很明显了,函数c只是提升了变量名c而已,函数声明才会提升!

    那么变量的提升和函数声明的提升哪个提升的优先级比较高呢?

    console.log(b);
    console.log(b());
    var b=1;
    function b(){
        return 2;
    }

    结果

    结果显示函数声明提升的优先级比变量提升还要高。

  • 相关阅读:
    Linux 笔记 —— SVN和FTP的安装
    在.NET中使用Javascript作为脚本语言(v8最新版)
    回调的经典应用
    Javascript.NET(V8Wrapper) 更新,自定义映射别名
    SQLServer 的视图自带缓存特效?!
    关于 Twing Hot Link 的一些事
    Twing Hot Link For PSP 开发笔记(1)
    新闻发布系统
    Spring MVC入门讲解
    f(f(x))=x, 纯数学理解
  • 原文地址:https://www.cnblogs.com/nangxi/p/8583992.html
Copyright © 2011-2022 走看看