绵阳梓潼网站制作公司

JavaScript中你不知道的函数有哪些

本篇文章给大家分享的是有关JavaScript中你不知道的函数有哪些，小编觉得挺实用的，因此分享给大家学习，希望大家阅读完这篇文章后可以有所收获，话不多说，跟着小编一起来看看吧。

创新互联建站-专业网站定制、快速模板网站建设、高性价比罗城网站开发、企业建站全套包干低至880元,成熟完善的模板库,直接使用。一站式罗城网站制作公司更省心,省钱,快速模板网站建设找我们，业务覆盖罗城地区。费用合理售后完善，十余年实体公司更值得信赖。

函数声明

在JavaScript中，对于函数的声明有两种表达形式， 声明式 和 表达式  ，至于其他函数(如立即执行函数，箭头函数等)都是基于这两种形式衍生的。

// 声明式 function foo () {   console.log('我是声明式') }  // 表达式 var foo = function () {   console.log('我是表达式') }

具名函数

故名思意，具名函数就是有名称的函数，这是我们最常见的一种函数，我们先来看看它的写法。

// 具名函数 function foo () {   console.log('我是具名函数') }

上边说了，函数声明的表达形式有两种，具名函数是经典的声明式，具名函数表达式的另外一种表现形式引出了另外一种函数类型- 具名函数表达式(NFE) 。

具名函数表达式

具名函数表达式就是具名函数的表达式写法，严格来说，它并不是一种函数类型，只是一种写法而已。

// 具名函数表达式 var fn = function foo () {   console.log('我是具名函数表达式'); } fn() // 输出：我是具名函数表达式

它有几个特点：

  • 函数名标识符私有化

  • 函数名标识符常量化

函数名标识符私有化：即具名函数表达式的函数名不能从外部调用，仅供函数体内部使用，当外部调用时就会报错。

// 函数名称私有化 var fn = function foo () {   console.log(typeof foo); } fn() // function foo() // Uncaught ReferenceError: foo is not defined

函数名标识符常量化：即具名函数表达式标识符的值不能修改，我们可以将其当作常量来使用。

var fn = function foo(){     foo = 12;     console.log(foo); }  fn() /* 输出： ƒ foo(){     foo = 12;     console.log(foo); } */

我们来看一道经典的面试题

// 改写以下代码，使其分别输出10、12 var foo = 10; (function foo   (){     foo = 12;     console.log(foo); })()  // 改写结果 var foo = 10; (function foo   (){     var foo = 12;   console.log(window.foo); // 10   console.log(foo); // 12 })()

匿名函数

匿名函数：即没有名称的函数，匿名函数不能像具名函数一样直接声明定义，在JavaScript中常见的用法就是将匿名函数当作回调参数使用或作为高阶函数的返回值。

// 作为回调参数 setTimeout(function () {   console.log('我是匿名函数'); }, 1000);  // 作为高阶函数的返回值 function foo () {   var num = 10;   return function (i) {     return num + i;   } }  foo()(5) // 输出：15

匿名函数有几个缺点我们需要注意一下：

  • 没有函数名，调试困难

  • 如需引用自身(如递归函数)，需要用 arguments.callee ，但是 arguments.callee 在严格模式下禁用

  • 可读性差

立即执行函数

立即执行函数(IIFE)：即当程序解析到该函数时就立即执行。

// 写法一 (function () {   console.log('我是立即执行函数'); })()  // 写法二 (function () {   console.log('我是立即执行函数'); }())

匿名函数的优点在于内部参数不会泄露，即变量私有化。

(function () {   var x = 10   console.log('我是立即执行函数'); }())  console.log(x); // Uncaught ReferenceError: x is not defined

有一道很经典的面试题，我们可以看一下。

// 改写以下代码，让其依次输出. for (var i = 0; i < 5; i++) {     setTimeout(function () {         console.log(`值为${i}`)     }, 0) } // 此时会输出5次 "值为5"

我们会立马想到用 let ，但是还有没有其他写法呢?当然有，立即执行函数就是了。

// 改写方法一 for (var i = 0; i < 5; i++) {   (function(num){     console.log(`值为${num}`)   })(i) }  // 改写方法二 for (var i = 0; i < 5; i++) {   var num = (function(){     return i;   })()   console.log(`值为${num}`) }

以上就是JavaScript中你不知道的函数有哪些，小编相信有部分知识点可能是我们日常工作会见到或用到的。希望你能通过这篇文章学到更多知识。更多详情敬请关注创新互联行业资讯频道。


当前名称：JavaScript中你不知道的函数有哪些
标题来源：http://myzitong.com/article/jhssih.html

其他资讯