JS开发中函数知识点梳理(三）

williamwen1986 发布于2019-08-26 11:51 / 1817人阅读

摘要：函数表达式的分类匿名函数表达式具名函数表达式自调用函数表达式函数表达式的用法使用来接偶函数名和函数体的耦合状态。修改函数表达式代码如下闭包我们知道，函数表达式是将匿名函数赋值给一个变量，作为变量的值，所以，匿名函数也可以作为的返回值。

这篇文章要介绍的内容是函数表达，因为我个人比较喜欢使用函数表达式定义函数，所以就对它做了一些研究和整理。其实，说到函数表达式，就不得不说到定义函数的另一种方式——函数声明，它们虽然相似，但是又有一些区别，那么它们的区别是什么呢，这个问题会在本文中多带带说明，下面进入正文。

函数声明

常见结构如下：

function functionName(arg0, arg1,[...]) {
    // 函数体
}

由一个关键字 function 开头，后面紧跟函数名，然后是函数的参数（如：(arg0, arg1,[...])），最后是函数体（如：‘{ // 函数体}’）

在JavaScript中，函数声明有一个特性是函数声明的提升，也就是说在代码执行前会先读取函数声明，因此，我们把函数声明放在调用它的语句的前后皆可。

函数表达式

常见结构如下：

var functionName = function(arg0, arg1,[...]) {
    // 函数体
}

这种创建一个匿名函数，然后将它赋值给变量functionName的表达式形式，就叫做函数表达式。

函数表达式的分类

1.匿名函数表达式

var func = function() {
    console.log("I am an anonymous function expression.")
}

2.具名函数表达式

var func = function functionname() {
    console.log("I am a named function expression.")
}

3.自调用函数表达式

(function() {
    console.log("I am a self-call function expression.")
})()

函数表达式的用法

1.使用 arguments.callee 来接偶函数名和函数体的耦合状态。

function fic(n) {
    return n <=1 ? 1 : n * arguments.callee(n-1)
}

function fic2(n) {
    return n <= 1 ? 1 : n * fic(n-1)
}

function fic3() {
    return 0
}

fic(5)  // 120
fic2(5) // 120

var fic4 = fic
var fic5 = fic2
fic = fic3
fic2 = fic3

fic(5)  // 0
fic2(5) // 0
fic4(5) // 120
fic5(5) // 0

但是使用 arguments.callee 在严格模式下存在着问题。因此，我们会使用命名函数表达式来解决这个问题。

修改fic函数表达式代码如下：

fic = (function f(n) {
    return n <= 1 ? 1 : n * f(n-1)
})

闭包

我们知道，函数表达式是将匿名函数赋值给一个变量，作为变量的值，所以，匿名函数也可以作为return的返回值。

这和闭包的使用是不是很相似。关于闭包的知识点可以参考这篇文章https://github.com/lvzhenbang/article/blob/master/js/closure.md

函数表达式 VS 函数声明

建议先看一下Function Declarations vs. Function Expressions这一篇文章。

这篇文章开始先引用了几个示例来说明，使用函数表达式和函数声明的区别。

函数声明有一个规则我们应该比较清楚就是函数声明的提升。声明的函数不管在我们调用函数语句之前，还是之后，只要函数声明存在，调用函数就可以执行成功。

变量的赋值语句，在执行的过程中也存在着变量声明的提升。但是要牢记变量的提升是变量定义的提升，而不是变量赋值的提升，变量赋值还在原来的位置，另外还要记住的是变量定义的提升的同时还会给变量赋值一个初始值为undefined。

函数表达式和变量的赋值表达式基本类似，只不过函数表达式所赋的值为一个函数。

另外，需要弄明白的一点是JavaScript这门面向对象语言没有重载（拥有相同函数名，但函数的参数不同）这个概念，但是如果后写的代码和前面写的代码定义重复，后面的代码将会覆盖前面代码。

后续可能还会继续修改，也欢迎各位批评指正。有问题或者有其他想法的可以在我的GitHub上pr。

专线服务超融合服务器 js中init函数 js中函数的调用、 js中函数和类 js中回调函数问题

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/107701.html

JS开发中函数知识点梳理(二）

摘要：英文原文中本来是，而翻译成第一类公民其实就是一种比喻。所以，通过上述的结果，我们发现在中不管我们是用构造函数创建的对象还是用本身提供的数据类型创建的对象都源自于。使用可以解除函数体内代码和函数名的耦合状态。作为一个Jser，不光要会用js，还要明白它的运行原理，不然就会一直停留在表面。函数在JavaScript中被称作第一等公民，这个第一等公民是什么鬼？看看知乎上是怎么回答的。就像...

appetizerio 2019-08-22 16:44 评论0 收藏0
前端开发收集 - 收藏集 - 掘金

摘要：责编现代化的方式开发一个图片上传工具前端掘金对于图片上传，大家一定不陌生。之深入事件机制前端掘金事件绑定的方式原生的事件绑定方式有几种想必有很多朋友说种目前，在本人目前的研究中，只有两种半两种半还有半种的且听我道来。 Ajax 与数据传输 - 前端 - 掘金背景在没有ajax之前，前端与后台传数据都是靠表单传输，使用表单的方法传输数据有一个比较大的问题就是每次提交数据都会刷新页面，用...

ygyooo 2019-08-20 17:15 评论0 收藏0
Deep in JS - 收藏集 - 掘金

摘要：今天同学去面试，做了两道面试题全部做错了，发过来给道典型的面试题前端掘金在界中，开发人员的需求量一直居高不下。排序算法 -- JavaScript 标准参考教程（alpha） - 前端 - 掘金来自《JavaScript 标准参考教程（alpha）》，by 阮一峰目录冒泡排序简介算法实现选择排序简介算法实现 ... 图例详解那道 setTimeout 与循环闭包的经典面...

enali 2019-08-20 16:36 评论0 收藏0
那些年，前端学习之路的疑难杂症（三）：数组和Date的一些梳理

摘要：将指定的数字索引值转换成字符串索引值变成，然后将其作为属性名来用。返回一个由删除元素组成的数组。该方法返回的数组元素是调用的数组的一个子集。使用的函数有四个参数初始值积累值数组元素元素索引数组本身。前言很多人在学习原生JS的过程中会遇到一些疑惑，比如在学习array时，就很容易搞不清哪些方法会改变原来数组，哪些方法不会改变原来数组？再比如很多人会使用new Date()获取时间，却...

xeblog 2019-08-21 11:33 评论0 收藏0
JavaScript - 收藏集 - 掘金

摘要：插件开发前端掘金作者原文地址译者插件是为应用添加全局功能的一种强大而且简单的方式。提供了与使用掌控异步前端掘金教你使用在行代码内优雅的实现文件分片断点续传。 Vue.js 插件开发 - 前端 - 掘金作者：Joshua Bemenderfer原文地址: creating-custom-plugins译者：jeneser Vue.js插件是为应用添加全局功能的一种强大而且简单的方式。插....

izhuhaodev 2019-08-21 11:44 评论0 收藏0