js 声明函数(函数创建)详解-自学php网

js 声明函数(函数创建)详解

来源：自学PHP网时间：2014-09-19 14:47 作者：阅读:次

[导读] 在javascript中函数创建与声明函数有常用的自定义函数与匿名函数下面我来分别介绍这些函数的用法...

一般我们在写JavaScript的时候，都喜欢先命名一个空函数(如代码1)，我感觉这样会消耗一些性能，而且代码写得还多了。其实可以直接声明想要写的函数，不用先声明一个空函数(如代码2)。

javascript定义函数(声明函数)可以有三种方法：正常方法、构造函数、函数直接量。

最简单的声明javascript函数的方法和我们其他编程语言没有区别，function(param){}

代码如下

复制代码

代码1：

function myFunction() {
this.myMethod = function() {}
}
var myObject = new myFunction();

代码2

var myObject = {
myMethod: function() {}
};

如果函数不包含return 语句，只执行函数体内语句，并返回undefined

构造函数方法：new Function();

代码如下	复制代码
//构造函数方式定义javascript函数 var add = new Function('a','b','return a+b;');

上面的代码可能很简单大家会看不明白，下面我们接着看。

首先看一下JavaScript最常见的四种函数定义：

1.用Function构造函数定义的函数，代码如下：

代码如下	复制代码
var multiply = new Function('x', 'y', 'return x * y;');

2.函数声明，这种方式也是最为常见的一种：

代码如下	复制代码
function multiply(x, y) { return x * y; }

3.函数表达式，声明为匿名函数然后赋值给一变量，很常见的方式：

代码如下	复制代码
var multiply = function(x, y) { return x * y; }

4.函数表达式，但是函数声明为命名函数再赋值给一变量，长得跟上一种方式真像：

代码如下	复制代码
var multiply = function multi(x, y) { return x * y; }

首先比较一下函数名，以及将函数赋值给的那个函数变量直接的关系，真绕……直观一点儿，从刚刚的例4说吧，就是multiply这个函数变量与multi这个函数名的关系：

代码如下	复制代码
◦函数名是不能够被修改的，相反的，函数变量是可以重新被赋值的。函数变量可以被重新赋值应该很好理解，我们第4个例子刚刚定义的multiply这个变量，看它不顺眼，重新赋值为： multiply = function(x, y) { return x + y; }

立马摇身一变，从乘法变成加法了。但是multi这个函数变量想变就是不可能的了，函数定义已经在那儿了，只要还保留这它的引用，它就是不会变的，可能这里不大好理解，先这样想着，往下看，慢慢就应该能理解了。

◦函数名同时是无法在函数外部使用的，它只在函数体内部可见，一个很简单的例子：

代码如下	复制代码
var foo = function bar() { alert('hello'); } foo(); // 提示“hello”字符串 bar(); // 执行报错，bar未定义

和明显，这里的bar确实是一个函数名，但是它确实不能在外部调用。这时候肯定会有童鞋问干嘛这个例子还是长得那么乖，和例4一个样，怎么不用例2的方式呢？问得好，且听我慢慢分解。

◦继续说例4，我们可以看见函数名（multi）和函数变量(multiply)，本不相同，其实两者根本就没有任何关系，因此没有保持一致的必要。说到这儿，我想上面4个例子应该可以精简到3个，例2和例4本质应该是一致的。什么，不信？嘻嘻，我还得继续卖关子哈~继续读下去~~
我们发现例2和例4相比，只不过少了var的函数变量，而例3与例4相比，只不过少了那个函数名，这里从现象上看，例2和例4的本质是相同的，铁证如下：

代码如下	复制代码
function foo() {} alert(foo); // 提示包含“foo”的函数名 var bar = foo; alert(bar);

// 提示依然只包含“foo”的函数名，和bar半毛钱关系都没有
的确是铁证吧？上面的类似例2的代码结合起来写是不是就成例4的方式了？正确，这就是我刚刚所说的两者本质应该相同，只是用例2方式定义函数的时候，JS引擎帮我们做了一些事情，比如声明了函数名为multiply的函数，同时还悄悄定义了一个也叫multiply的变量，然后赋值给这个变量，两个完全一样的名字，我们自以为在使用函数名multiply的时候，实际是在用multiply这个函数变量，晕了吧~说实话，我也晕了~~总之我们调用的时候，实在用函数变量调用，而函数名是无法在外部调用函数的，因此有了我上述的推断。

但是这里要提到的一个小小的差别，函数声明方式定义的函数，与构造函数声明的或者函数表达式声明的不同之处在于，函数声明方式的函数可以在函数定义之前就调用……不说了，还是看代码：

代码如下	复制代码
foo(); // 提示Foo function foo() { alert('Foo'); } bar(); // 哥们，和上面确实不一样，就不要逞能，这不报错了？提示bar未定义 var bar = function() { alert('Bar'); }

再说说构造函数声明的函数，这样声明的函数是不会继承当前声明位置的作用域，它默认只会拥有全局作用域，然而这个是其他几种函数声明方式也一样有的，如下：

代码如下	复制代码
function foo() { var hi = 'hello'; //return function() { // alert(hi); /

js运算符“||”和“&&”的总结

几个不错js倒计时程序实例

子栏目

js 声明函数(函数创建)详解

最新评论

添加评论

更多文章推荐

添加评论