JavaScript 使用关键字 function 定义函数。

函数可以通过声明定义,也可以是一个表达式。


函数声明分号是用来分隔可执行JavaScript语句。 
由于函数声明不是一个可执行语句,所以不以分号结束。

在之前的教程中,已经了解了函数声明的语法 :

function functionName(parameters) {
执行的代码
}

函数声明后不会立即执行,会在我们需要的时候调用到。

<body>

<p>本例调用的函数会执行一个计算,然后返回结果:</p>
<p id="demo"></p>
<script>
function myFunction(a,b){
return a*b;
}
document.getElementById("demo").innerHTML=myFunction(4,3);
</script> </body>

函数表达式下述函数以分号结尾,因为它是一个执行语句。

JavaScript 函数可以通过一个表达式定义。

函数表达式可以存储在变量中:

 <p>函数可以存储在变量中:</p>
<p id="demo"></p>
<script>
var x = function (a, b) {return a * b};
document.getElementById("demo").innerHTML = x;
</script>

在函数表达式存储在变量后,变量也可作为一个函数使用:

 <p>函数存储在变量后,变量可作为函数使用:</p>
<p id="demo"></p>
<script>
var x = function (a, b) {return a * b};
document.getElementById("demo").innerHTML = x(4, 3);
</script>

以上函数实际上是一个 匿名函数 (函数没有名称)。

函数存储在变量中,不需要函数名称,通常通过变量名来调用。


Function() 构造函数

在以上实例中,我们了解到函数通过关键字 function 定义。

函数同样可以通过内置的 JavaScript 函数构造器(Function())定义。

 <p>JavaScrip 内置构造函数。</p>
<p id="demo"></p>
<script>
var myFunction = new Function("a", "b", "return a * b");
document.getElementById("demo").innerHTML = myFunction(4, 3);
</script>

实际上,你不必使用构造函数。上面实例可以写成:

 <p id="demo"></p>
<script>
var myFunction = function (a, b) {return a * b}
document.getElementById("demo").innerHTML = myFunction(4, 3);
</script>

注:在 JavaScript 中,很多时候,你需要避免使用 new 关键字。


函数提升(Hoisting)

在之前的教程中我们已经了解了 "hoisting(提升)"。

提升(Hoisting)是 JavaScript 默认将当前作用域提升到前面去的的行为。

提升(Hoisting)应用在变量的声明与函数的声明。

因此,函数可以在声明之前调用:

 myFunction(5);

 function myFunction(y) {
return y * y;
}

使用表达式定义函数时无法提升。


自调用函数

函数表达式可以 "自调用"。

自调用表达式会自动调用。

如果表达式后面紧跟 () ,则会自动调用。

不能自调用声明的函数。

通过添加括号,来说明它是一个函数表达式:

(function () {
var x = "Hello!!"; // 我将调用自己
})();

以上函数实际上是一个 匿名自我调用的函数 (没有函数名)。


函数可作为一个值使用

JavaScript 函数作为一个值使用:

 <p>函数可作为一个值:</p>
<p>x = myFunction(4,3) 或 x = 12</p>
<p>两种情况下,x 的值都为 12。</p>
<p id="demo"></p>
<script>
function myFunction(a, b) {
return a * b;
}
var x = myFunction(4, 3);
document.getElementById("demo").innerHTML = x;
</script>

JavaScript 函数可作为表达式使用:

 function myFunction(a, b) {
return a * b;
} var x = myFunction(4, 3) * 2;

函数是对象

在 JavaScript 中使用 typeof 操作符判断函数类型将返回 "function" 。

但是JavaScript 函数描述为一个对象更加准确。

JavaScript 函数有 属性 和 方法

arguments.length 属性返回函数调用过程接收到的参数个数:

 <p> arguments.length 属性返回函数接收到参数的个数:</p>
<p id="demo"></p>
<script>
function myFunction(a, b) {
return arguments.length;
}
document.getElementById("demo").innerHTML = myFunction(4, 3);
</script>

toString() 方法将函数作为一个字符串返回:

 <p> toString() 将函数作为一个字符串返回:</p>
<p id="demo"></p>
<script>
function myFunction(a, b) {
return a * b;
}
document.getElementById("demo").innerHTML = myFunction.toString();
</script>

函数定义作为对象的属性,称之为对象方法。
函数如果用于创建新的对象,称之为对象的构造函数。

JavaScript要点 (五) 函数定义的更多相关文章

  1. javascript基础(五)函数

    原文http://pij.robinqu.me/ 通过call和apply间接调用函数(改变this) call 和 apply带有多个参数,call和apply把当前函数的this指向第一个参数给定 ...

  2. Javascript和JQuery函数定义方式

    Javascript 函数定义方式 1.function show() {     } 2.var cal = function() {     },必须先声明才能调用 示例: <html> ...

  3. JavaScript 基础(五) 函数 变量和作用域

    函数定义和调用 定义函数,在JavaScript中,定义函数的方式如下: function abs(x){ if(x >=0){ return x; }else{ return -x; } } ...

  4. javascript、jQuery函数定义和调用方法

    一.javascript 1.var aaa=function(){...} var 方式定义的函数,不能先调用函数,后声明,只能先声明函数,然后调用. 2.function aaa(){...} f ...

  5. javascript基础知识--函数定义

    函数声明式 function funname( 参数 ){ ...执行的代码 } 声明式的函数并不会马上执行,需要我们调用才会执行:funname(); * 分号是用来分隔可执行JavaScript语 ...

  6. JavaScript 带参数函数定义

    函数的参数parameters在函数中充当占位符(也叫形参)的作用,参数可以为一个或多个.调用一个函数时所传入的参数为实参,实参决定着形参真正的值. 这是带有两个参数的函数, param1 和 par ...

  7. java基础62 JavaScript中的函数(网页知识)

    1.JavaScript中,函数的格式 function 函数名(形参列表){ 函数体; } 2.JavaScript中,函数需要注意的细节 1.在javaScript中,函数定义形参时,是不能使用v ...

  8. JavaScript权威指南 - 函数

    函数本身就是一段JavaScript代码,定义一次但可能被调用任意次.如果函数挂载在一个对象上,作为对象的一个属性,通常这种函数被称作对象的方法.用于初始化一个新创建的对象的函数被称作构造函数. 相对 ...

  9. 深入理解 JavaScript 中的函数

    JavaScript函数也具有这些特性,但它们不仅仅是常规函数.JavaScript函数是对象.你可以查看我曾经写的关于JavaScript对象的文章,里面我提到几乎JavaScript中的所有一切都 ...

随机推荐

  1. c++ const 关键字 学习笔记

    const简单介绍: 1不再使用c中的#define,c++默认不给const定义的变量分配内存,所以它默认的是仅本文件可以看到该变量(即internal linkage), const int bu ...

  2. 非常实用的15款开源PHP类库

    PHP库给开发者提供了一个标准接口,它帮助开发者在PHP里充分利用面向对象编程.这些库为特定类型的内置功能提供了一个标准的API,允许类可以与PHP引擎进行无缝的交互.此外,开发者使用这些类库还可以简 ...

  3. [译]Atomic VS. Non-Atomic 操作

    原文链接:atomic-vs-non-atomic-operations 在网上已经写了很多关于原子操作的文章,但是通常都集中在原子的读-修改-写(RMW. read-modify-write)操作. ...

  4. HTTPConnection与HTTPClient的区别

    HttpClient是个很不错的开源框架,封装了访问http的请求头,参数,内容体,响应等等.HttpURLConnection是java的标准类,什么都没封装,用起来太原始,不方便.比如重访问的自定 ...

  5. 【ZOJ】3609 Modular Inverse

    1. 题目描述求乘法逆元. 2. 基本思路利用扩展gcd求逆元,模板题目. 3. 代码 /* 3609 */ #include <iostream> #include <sstrea ...

  6. Python图

    从一位前辈的博客看到了一张图,先转过来,稍后再细看

  7. bzoj2243:[SDOI2011]染色

    链剖就可以了.一开始的想法错了.但也非常接近了.妈呀调的要死...然后把字体再缩小一号查错起来比较容易QAQ. #include<cstdio> #include<cstring&g ...

  8. 【转】cocos2d-x游戏开发(十四)用shader使图片背景透明

    转自:http://blog.csdn.net/dawn_moon/article/details/8631783 好吧,终于抽时间写这篇文章了. 手头上有很多人物行走图,技能特效图等,但这些图都有个 ...

  9. SharePoint 2010 出错! HTTP Error 503. The service is unavailable

    转:http://544729.blog.51cto.com/534729/464087 昨天,公司的sharepoint 2010 无法打开,提示HTTP Error 503. The servic ...

  10. java中的快捷键

    Ctrl+1 快速修复(最经典的快捷键,就不用多说了)Ctrl+D: 删除当前行 Ctrl+Alt+↓ 复制当前行到下一行(复制增加)Ctrl+Alt+↑ 复制当前行到上一行(复制增加)Alt+↓ 当 ...