js 函数的创建大体有这几种方式:

-1-函数表达式(函数字面量):

说白了就是把一个函数赋值给了一个变量。

var fun1 = function(index){
alert(index);
} fun1(1);

函数表达式其中还包括匿名自执行函数,这种方式函数不用调用就会自己执行:

比如:

(function(i){

  alert(i);

})(index)

也许你会问我什么时候会用匿名自执行函数呢?给你看个面试题:

for(var i = 0;i < 5;i ++){
setTimeout(function(){
alert(i);
},i*1000)
}

这个函数会输出什么呢?

其实大家应该都知道因为用 var声明的i会每次循环都会被重新赋值所以应该是 5 ,这个用 es6let 声明可以解决这个问题,但是我们想探讨的是setTimeout 没有按照我们想要的事件 alert 这里有很多解决方案,匿名自执行函数就是其一:

for(var i = 0;i < 5;i ++){

  (function(time){
setTimeout(function(){
console.log(time);
},time*4000)
})(i) }

这样就可以解决我们的问题。深究其原理的话,它主要创建一个新的函数作用域,在这个新的函数作用域里面将外面的参数变成了一个局部变量进行的一系列操作吧,个人见解。

-2-函数声明:

会经常用到的一种声明函数的方式。

function fun1(index){
alert(index);
}
fun1(2);

区别

函数表达式和函数声明的区别在于函数声明在调用前后都没问题,因为js解析代码的时候会将 函数声明的函数前置,函数表达式的话要注意必须提前声明,因为函数表达式最终是通过var将函数赋值给了一个变量,初始值肯定为underfind,在函数表达式前调用的话肯定返回underfind,因为js还没有赋值呢。

** -3- new 函数 (不推荐)**

var fun1 = new Function("参数")

这里的new Function() new Array()、new Object()等相似。

© 著作权归作者所有

文/wbg(简书作者)

原文链接:http://www.jianshu.com/p/a32425f422c5

著作权归作者所有,转载请联系作者获得授权,并标注“简书作者”。

前端小课堂 js:函数的创建方式及区别的更多相关文章

  1. 前端小课堂 js:what is the function?

    js 函数: 概念:函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块. 说白了就是响应用户操作所执行的代码,通过js事件触发,然后调用执行函数里代码的操作. 比如常见的用户点击事件,用户点击 ...

  2. js函数的创建

    1.js 函数的创建有几种方式: 1.1  直接声明 1.2 创建匿名函数,然后赋值 1.3 声明函数,然后赋值给变量 1.4 使用1.3 得到的变量再赋值给变量 1.5 使用函数对象创建函数 < ...

  3. js两种定义函数、继承方式及区别

    一:js两种定义函数的方式及区别 1:函数声明: function sayA() { alert("i am A"); } 2:函数表达式: var sayB = function ...

  4. js 函数定义的方式

    js 函数定义的方式 一.总结 一句话总结: 最常见就下面三种 最常见:function func1([参数]){/*函数体*/} 将匿名函数赋值给变量:var func2=function([参数] ...

  5. 第163天:js面向对象-对象创建方式总结

    面向对象-对象创建方式总结 1. 创建对象的方式,json方式 推荐使用的场合: 作为函数的参数,临时只用一次的场景.比如设置函数原型对象. var obj = {}; //对象有自己的 属性 和 行 ...

  6. js 对象的创建方式和对象的区别

    js一个有三种方法创建对象,这里做一个总结. 1.对象直接量 所谓对象直接量,可以看做是一副映射表,这个方法也是最直接的一个方法,个人比较建议, 1 2 3 4 5 6 7 8 9 10 11 12 ...

  7. Java中String两种不同创建方式的区别及intern的用法

    一, Java有两种创建字符串的方式, String str1 = "abc"; String str2 = new String("abc"); 用双引号创建 ...

  8. 前端小知识-js

    一.对象冒充 function student(name,age){ this.name = name; this.age = age; this.show = function(){ console ...

  9. 自定义博客cnblogs样式的必备前端小知识——js、jq

    JQ.JS相关小知识 任意元素自动点击 $(".editicon").trigger('click') 添加子元素 append() - 在被选元素的结尾插入内容 prepend( ...

随机推荐

  1. java 基础知识八 正则表达式

    java  基础知识八  正则表达式 正则表达式是一种可以用于模式匹配和替换的规范,一个正则表达式就是由普通的字符(例如字符a到z)以及特殊字符(元字符)组成的文字模式,它 用以描述在查找文字主体时待 ...

  2. Python with

    简介 在编程中会经常碰到这种情况:有一个特殊的语句块,在执行这个语句块之前需要先执行一些准备动作:当语句块执行完成后,需要继续执行一些收尾动作.例如,文件读写后需要关闭,数据库读写完毕需要关闭连接,资 ...

  3. 浅谈访问控制列表(ACL)

    1.ACL简介2.前期准备3.ACL的基本操作:添加和修改4.ACL的其他功能:删除和覆盖5.目录的默认ACL6.备份和恢复ACL7.结束语 1.ACL简介 用户权限管理始终是Linux系统管理中最重 ...

  4. RPC框架原理与实现

    了解一个框架最好的思路就是寻找一个该类型麻雀虽小五脏俱全的开源项目,不负所期,轻量级分布式 RPC 框架 RPC,全称 Remote Procedure Call(远程过程调用),即调用远程计算机上的 ...

  5. STM32学习笔记(一)——点亮一个LED

    引言 最近报名了2017全国大学生电子设计竞赛,我们学校是第一次参加这个比赛,由于8/9月份就要比赛了,所以现在准备是比较晚的了,指导老师说只能做控制类的题目了,让我们学习一下STM32单片机,51到 ...

  6. 求解释一个蛋疼的bug

     大婶儿们出来解决个问题,看看有碰见过的没 截图中的 if (order.EShopOrder_PayStatus == 0 && order.EShopOrder_Status == ...

  7. ZJOI2008树的统计Count

    知识点-树链剖分 "在一棵树上进行路径的修改.求极值.求和":乍一看只要线段树就能轻松解决,实际上,仅凭线段树是不能搞定它的.我们需要用到一种貌似高级的复杂算法--树链剖分.   ...

  8. 读书笔记 effective c++ Item 54 让你自己熟悉包括TR1在内的标准库

    1. C++0x的历史渊源 C++标准——也就是定义语言的文档和程序库——在1998被批准.在2003年,一个小的“修复bug”版本被发布.然而标准委员会仍然在继续他们的工作,一个“2.0版本”的C+ ...

  9. Python re 正则表达式简介

    1. 正则表达式基础 1.1. 简单介绍 正则表达式并不是Python的一部分.正则表达式是用于处理字符串的强大工具,拥有自己独特的语法以及一个独立的处理引擎,效率上可能不如str自带的方法,但功能十 ...

  10. Github--账号重新申请与配置

    2017-04-24 最近洗心革面痛下决心要好好再深入学习一番前端,正好加入了一个外包团队接了份单子,外包项目正在如火如荼地进行着,自己也打算趁这个机会来好好学习总结一番. 但是俗话说得好," ...