Javascript中的函数声明和函数表达式

开发 前端
JavaScript是一种基于对象和事件驱动并具有相对安全性的客户端脚本语言。本文主要介绍的是javascript中的函数声明和函数表达式,希望对你有帮助,一起来看。

Javascript是一种由Netscape的LiveScript发展而来的原型化继承的面向对象的动态类型的区分大小写的客户端脚本语言,主要目的是为了解决服务器端语言,比如Perl,遗留的速度问题,为客户提供更流畅的浏览效果。

Javascript有很多有趣的用法,在Google Code Search里能找到不少,举一个例子:

  1. <script>  
  2. ~function() {  
  3. alert("hello, world.");  
  4. }();  
  5. </script> 

试一下就知道这段代码的意思就是声明一个函数,然后立刻执行,因为Javascript中的变量作用域是基于函数的,所以这样可以避免变量污染,但这里的位运算符“~”乍一看让人摸不到头脑,如果去掉它再运行则会报错:SyntaxError。

在阐述为什么之前,让我们先来明确Javascript中的两个概念:函数声明和函数表达式:

先来看看什么样的是函数声明:

 

  1. <script>  
  2. function()   
  3. {  
  4. alert("hello, world.");  
  5. };  
  6. function foo()   
  7. {  
  8. alert("hello, world.");  
  9. };  
  10. </script> 

再来看看什么样的是函数表达式:

  1. <script>  
  2. var foo = function()   
  3. {  
  4. alert("hello, world.");  
  5. };  
  6. </script> 

现在回头看看文章开头的问题,为什么去掉位操作符“~”后运行会报错,这是因为从语法解析的角度看,Javascript不允许在函数声明的后面直接使用小括号,而函数表达式则没有这个限制,通过在函数声明前面加上一个“~”操作符,就可以让语法解析器把后面看成是函数表达式,同样的,在函数声明前面加上“!,+,-”等操作符也是可行的。

那我们为什么不使用下面这种函数表达式的方式呢?

  1. <script>  
  2. var foo = function()   
  3. {  
  4. alert("hello, world.");  
  5. }();  
  6. </script> 

虽然从语法解析的角度看没有问题,但是上面的代码存在弊端,它引入了一个变量,可能会污染现有的运行环境,带来潜在的问题。

使用位操作符“~”的方法多少显得有点奇技淫巧,其实把函数声明用小括号套起来更易读:

  1. <script>  
  2. (function()   
  3. {  
  4. alert("hello, world.");  
  5. })();  
  6. </script> 

弄明白了原理,不管遇到什么写法,都不会再丈二和尚摸不着头脑了。

【编辑推荐】

  1. Web移动应用 HTML5 CSS和JavaScript
  2. JavaScript开发规范要求
  3. Javascript中闭包的作用域链
  4. JavaScript实现二级联动下拉框
  5. 让浏览器非阻塞加载javascript的几种方式
责任编辑:于铁 来源: 火丁笔记
相关推荐

2017-08-01 00:19:15

Javascript函数函数声明

2021-06-28 08:01:57

JS 函数表达式函数声明

2010-11-16 14:53:02

Oracle游标表达式

2010-09-10 15:20:11

SQL函数计算表达式

2023-11-02 18:45:00

Rust编程表达式

2011-05-11 17:40:30

PHP正则表达式

2020-10-16 06:40:25

C++匿名函数

2009-08-31 17:11:37

Lambda表达式

2021-08-31 07:19:41

Lambda表达式C#

2012-04-28 15:22:46

PHP

2009-08-10 10:06:10

.NET Lambda

2009-07-21 14:03:00

Scalaif表达式while循环

2022-05-26 08:53:47

Go函数代码

2021-08-07 07:21:26

AndroidKotlinLambda

2009-09-16 10:43:22

PHP正则表达式函数

2009-09-16 09:58:53

PHP正则表达式函数

2009-10-12 10:11:08

Lambda表达式编写

2009-11-30 17:06:35

PHP ereg()函

2024-03-25 13:46:12

C#Lambda编程

2010-10-08 09:17:07

JavaScript表JavaScript运
点赞
收藏

51CTO技术栈公众号