Molerose

Javascript DOM 编程艺术 (笔记No.5 - 函数)
学习一种新的程序设计语言看起来可能很难,但事实却并非如此。DOM脚本看起来似乎比CSS更复杂,可只要领悟了它的语法...
扫描右侧二维码阅读全文
09
2018/09

Javascript DOM 编程艺术 (笔记No.5 - 函数)

学习一种新的程序设计语言看起来可能很难,但事实却并非如此。DOM脚本看起来似乎比CSS更复杂,可只要领悟了它的语法,你就会发现自己又掌握了,一样功能强大的Web开发工具。归根结底,代码都是思想和概念的体现。


函数(function)

如果需要多次使用同一段代码,可以把阀门封装成一个函数。

函数(function)就是一组允许在你的代码里随时调用的语句。

每个函数实际上是一个短小的脚本。

作为一种良好的编程习惯,应该先对函数做出定义再调用她们。

下面是一个简单的示例函数:

function shot() {
    var beatles = Array("John","Paul","George","Ringo");
    for (var count = 0; count < beatles.length; count++) {
        alert(beatles[count]);
    }
}

上述函数调用方式

<script>
    shot();
</script>

函数的真正威力体现在,你可以把不同的数据传递给它们,而它们将使用这些数据去完成预定的操作。

我们把传递给函数的数据成为参数(argument)

函数语法

function name (argument) {
    statements;
}

参数

alert 属于javascript内建函数 1 中的一种。

这个函数需要我们提供一个参数,它将弹出对话框来显示这个参数的值。

定义函数时,可以为它声明任意多个参数,只要用逗号把它们隔开就行。

在函数内部,你可以像使用普通变量那样使用它的任何一个参数。

多参数代码示例

function multiply(num1,num2) {
    var total = num1 * num2;
    alert(total);
}

上述函数调用方式

<script>
    multiply(10,30);
    // 最终浏览器弹出内容为300
</script>

return 语句

如果这个函数能把结果返回给调用这个函数的语句往往会更有用。

这很容易做到:函数不仅能够(以参数形式)接收数据,还能够返回数据。

我们可以创建一个函数让它返回一个数据、一个字符串、一个数组或布尔值,这需要用到return语句

function multipy(num1,num2) {
    var total = num1 * num2;
    return total;
}

return 语句实例

下面这个函数只有一个参数(一个华氏温度值),它将返回一个数值(统一温度的设置温度值)

function convertToCelsius(temp) {
    var result = temp - 32;
    result = result / 1.8;
    return result;
}

函数的真正价值体现在,我们还可以把它们当作一种数据类型来使用,这意味着可以把一个函数的调用结果赋给一个变量

// 接上代码
var temp_fahrenheit = 95;
var temp_celsius = convertToCelsius(temp_fahrenheit);
alert(temp_celsius)
// alert 所弹出的值为 35 

如上例子,变量 temp_celsius 的值为 35,整数值由 convertToCelsius 函数返回。

如何命名变量和函数

  1. 在命名变量时,我们用下划线来风格各个单词
  2. 在命名函数时,我们从第二个单词开始把每个单词的第一个字母写成大写形式(也就是所谓的驼峰命名法)
  3. Javascript 语言不允许函数的名字里包含空格。

  1. Javascript内置函数是浏览器内核自带的,不用任何函数库引入就可以直接使用的函数。
Last modification:September 9th, 2018 at 10:03 pm
If you think my article is useful to you, please feel free to appreciate

12 comments

  1. 江浙日报
    该评论仅登录用户及评论双方可见
  2. wpfs

    免费提供拼多多空包、京东单号网www.uudanhaowang.com

  3. 一朵时光红

    不交换友链接,因为我的网站是很好并且权重很高的网站!

  4. 一朵时光红

    这篇文章主要讲函数的调用和使用!

  5. 一朵好时光红

    PHP函数中的RETURN语句是返回值!

Leave a Comment