整理Javascript函数学习笔记

1、什么是函数
如果需要多次使用同一段代码，可以把它们封装成一个函数。函数（function）就是一组允许在你的代码里随时调用的语句。每个函数实际上是一个短小的脚本。
如:要完成多组数和的功能。

var sum;
sum = 3+2;
alear(sum);

sum = 7+8;
alear(sum);
......//不停的重复两行代码

如果要实现8组数的和，就需要16行代码，实现的越多，代码行也就越多。所以我们可以把完成特定功能的代码块放到一个函数里，直接调用这个函数，就省去重复输入大量代码的麻烦。使用函数完成：

function add(a,b){
  sum = a+b;//只需要写一次就可以
 };
 add2(3,2);
 add2(7,8);
 ......//只需要调用函数就可以

2、定义函数
定义函数语法

 function 函数名(参数argument){
　　函数体statements;
 }
 //function定义函数的关键字，“函数名”你为函数取的名字，“函数体”替换为完成特定功能的代码。

function shout(){
   var beatles = Array("John","Paul","George","Ringo");
   for (var count = 0; count < beatles.length; count++){
     alert(beatles[count]);
   }
 }
 //这个函数里面的循环语句将依次弹出对话框来显示beatles里面内容。
 shout();调用函数，执行脚本里的动作

完成对两个数求和并显示结果的功能：

<script type="text/javascript">
  function add2(){
    sum = 3+2;
    alert()sum;
   }
   add2();
 </script>

3、函数调用
函数定义好后，是不能自动执行的，需要调用它,直接在需要的位置写函数名。
第一种情况:在<script>标签内调用。

<script type="text/javascript">
   function add(){
     sum = 1+1;
     alert(sum);
  }
   add();//调用函数，直接写函数名。
</script>

第二种情况:在HTML文件中调用，如通过点击按钮后调用定义好的函数。

<html>
 <head>
 <script type="text/javascript">
   function add2(){
     sum = 5 + 6;
     alert(sum);
   }
 </script>
 </head>
 <body>
 <form>
  <input type="button" value="click it" onclick="add2()"> //按钮,onclick点击事件，直接写函数名
 </form>
 </body>
 </html>

4、有参数的函数
其实，定义函数还可以如下格式：
function 函数名(参数1，参数2){
 　　函数代码
 }
在定义函数时，你可以为它声明任意多个参数，只要用逗号把它们分隔开来就行。在函数内部，你可以像使用普通变量那样使用它的任何一个参数。
按照这个格式，函数实现任意两个数的和应该写成：

function add2(x,y){
   sum = x + y;
   document.write(sum);
 }
 //x和y则是函数的两个参数，调用函数的时候，我们可通过这两个参数把两个实际的加数传递给函数了。

实现如下功能:
定义函数实现三个数的和，函数名为add3。
计算5、8、3/7、1、4两组三个数的和。

 <script type="text/JavaScript">
   function add3(x,y,z) {
   sum = x + y +z;
     document.write(x+"、"+y+"、"+z+"和:"+sum+"<br/>");
   }
   add3(5,8,3);
   add3(7,1,4);
 </script>

5、返回值的函数
函数不仅能够(以参数的形式)接收数据，还能够返回数据。我们完全可以创建一个函数并让它返回一个值、一个字符串、一个数组或是一个布尔值。这是需要用到return语句。

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

之前通过"document.write"把结果输出来，现在使用函数输出
我们只要把"document.write(sum)"这行改成如下代码：

 function add2(x,y){
   sum = x + y;
   return sum; //返回函数值,return后面的值叫做返回值。
 }
 //还可以通过变量存储调用函数的返回值：
 result = add2(3,4);//语句执行后，result变量中的值为7。

例：下面这个函数只有一个参数（一个华氏温度值），它将返回一个数值（同一温度的摄氏温度值）：

 <script type="text/javascript">
   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);
 </script>

在这个例子里，变量temp_celsius的值将是35，这个数值由convertToCelsius函数返回。
在命名变量时，我用下划线来分隔各个单词；在命名函数时，我从第二个单词开始把每个单词的第一个字母写成大写形式（也就是驼峰命名法）。
 1）、变量的作用域
变量既可以是全局的，也可以是局部的。
全局变量（global variable）可以在脚本中的任何位置被引用。一旦你在某个脚本里声明了一个全局变量，就可以从这个脚本中的任何位置------包括函数内部------引用它。全局变量的作用域是整个脚本。
局部变量（local variable）只存在于声明它的那个函数的内部，在那个函数的外部是无法引用它的。局部变量的作用域仅限于某个特定的函数。
可以用var关键字明确地为函数变量设定作用域。
如果在某个函数中使用了var，那个变量就将被视为一个局部变量，它只存在于这个函数的上下文中；反之，如果没有使用var，那个变量就将被视为一个全局变量，如果脚本里已经存在一个与之同名的全局变量，这个函数就会改变那个全局变量值。
例子：

function square(num){
   total = num*num;
   return total;
 }
 var total = 50;
 var number = square(20);
alert(total);

这是错误的，number的值为400，但是这里alert弹出的是total的值，应该是50.

这些代码将不可避免地导致全局变量total的值发生变化。

全局变量total的值变成了400.我的本意是让square()函数只把它计算出来的平方值返回给变量number，但因为未把这个函数内部total变量明确地声明为局部变量，这个函数把名字同样是total的那个全局变量的值也改变了。

把这个函数写成如下的样子才是正确的：

 function square(num){
   var total = num*num;
   return total;
 }
 var total = 50;
 var number = square(20);
 alert(total);
 </script>

正确结果：

以上就是关于Javascript函数的学习笔记，还涉及到了一些变量的知识点，希望对大家的学习有所帮助。

赞 (0)

相关推荐

  • JS中setInterval、setTimeout不能传递带参数的函数的解决方案

    在JS中无论是setTimeout还是setInterval,在使用函数名作为调用句柄时都不能带参数,而在许多场合必须要带参数, 这就需要想方法解决. 一.采用字符串形式:--(缺陷)参数不能被周期性改变 setInterval("foo(id)",1000); 二.匿名函数包装 (推荐) 复制代码 代码如下: window.setInterval(function() { foo (id); }, 1000); 这样就可以周期性执行foo(id)这个函数,而且把变量id传递进去: 三

  • js split函数用法总结(从入门到精通)

    js split函数用法总结(从入门到精通)

    split定义和用法 split() 方法用于把一个字符串分割成字符串数组. 语法 stringObject.split(separator,howmany) 参数 描述 separator 必需.字符串或正则表达式,从该参数指定的地方分割 stringObject. howmany 可选.该参数可指定返回的数组的最大长度.如果设置了该参数,返回的子串不会多于这个参数指定的数组.如果没有设置该参数,整个字符串都会被分割,不考虑它的长度. 返回值 一个字符串数组.该数组是通过在 separator

  • js 正则表达式之test函数讲解

    功能介绍:该方法的返回值是布尔值,通过该值可以匹配字符串中是否存在于正则表达式相匹配的结果,如果有匹配内容,返回ture,如果没有匹配内容返回false,该方法常用于判断用户输入数据的合法性,比如检验Email的合法性 基本语法:objReg.test(objStr) objReg 必选项 RegExp对象名称 objStr 要进行匹配检测的字符串 讲解实例代码: 复制代码 代码如下: <html> <script language="javascript" type

  • js 在定义的时候立即执行的函数表达式(function)写法

    1.前言 函数需要先定义,后使用. 这基本上所有编程语言的一条铁的定律. 一般状况下, 我们需要调用一个JavaScript 函数, 基本的状况都是先定义, 然后再调用. 看一个例子 复制代码 代码如下: <!--by oscar999 2013-1-16--> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dt

  • 详解JavaScript函数

    详解JavaScript函数

    函数是一组可以随时随地运行的语句,函数作为ECMAScript的核心是很重要的.函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块.也就是函数是定义一次但却可以调用或执行任意多次的一段JavaScript代码.函数有时会有参数,即函数被调用时指定了值的局部变量.函数常常使用这些参数来计算一个返回值,这个值也成为函数调用表达式的值. 一.函数声明        函数对于任何语言来说都是一个核心的概念.通过函数可以封装任意多条语句,而且可以在任何地方,任何时候调用执行.JS中的函数使用fun

  • js中递归函数的使用介绍

    下面我们就做一个10以内的阶乘试试看吧: js中递归函数的使用 function f(num){ if(num alert("10!的结果为:"+f(10)); [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行] 递归函数的调用就说这么多了 js递归函数调用自身时的保险方式. 来自js高级程序设计 一个典型阶乘递归函数: 复制代码 代码如下: function fact(num){ if (num<=1){ return 1; }else{ return num*fact

  • JS函数实现动态添加CSS样式表文件

    先给出函数. 复制代码 代码如下: varaddSheet=function(){ vardoc,cssCode; if(arguments.length==1){ doc=document; cssCode=arguments[0] }elseif(arguments.length==2){ doc=arguments[0]; cssCode=arguments[1]; }else{ alert("addSheet函数最多接受两个参数!"); } if(!+"v1"

  • JS删除数组元素的函数介绍

    split将字符串转为数组并输出的代码: 复制代码 代码如下: <script language="javascript">    function spli(){             datastr="2,2,3,5,6,6";         var str= new Array();     str=datastr.split(",");           for (i=0;i<str.length ;i++ )  

  • JavaScript substr() 字符串截取函数使用详解

    substr 定义和用法 substr() 方法可在字符串中抽取从 start 下标开始的指定数目的字符. 语法 stringObject.substr(start,length) 参数 描述 start 必需.要抽取的子串的起始下标.必须是数值.如果是负数,那么该参数声明从字符串的尾部开始算起的位置.也就是说,-1 指字符串中最后一个字符,-2 指倒数第二个字符,以此类推. length 可选.子串中的字符数.必须是数值.如果省略了该参数,那么返回从 stringObject 的开始位置到结尾

  • 整理Javascript函数学习笔记

    整理Javascript函数学习笔记

    1.什么是函数 如果需要多次使用同一段代码,可以把它们封装成一个函数.函数(function)就是一组允许在你的代码里随时调用的语句.每个函数实际上是一个短小的脚本. 如:要完成多组数和的功能. var sum; sum = 3+2; alear(sum); sum = 7+8; alear(sum); ......//不停的重复两行代码 如果要实现8组数的和,就需要16行代码,实现的越多,代码行也就越多.所以我们可以把完成特定功能的代码块放到一个函数里,直接调用这个函数,就省去重复输入大量代码

  • 整理Javascript数组学习笔记

    1.什么是数组 数组是一个值的集合,每个值都有一个索引号,从0开始,每个索引都有一个相应的值,根据需要添加更多数值. <script type="text/javascript"> var myarr=new Array(); //定义数组 myarr[0]=80; myarr[1]=60; myarr[2]=99; document.write("第一个人的成绩是:"+myarr[0]); document.write("第二个人的成绩是:&

  • JavaScript继承学习笔记【新手必看】

    JavaScript继承学习笔记【新手必看】

    JavaScript作为一个面向对象语言(JS是基于对象的),可以实现继承是必不可少的,但是由于本身并没有类的概念,所以不会像真正的面向对象编程语言通过类实现继承,但可以通过其他方法实现继承.实现继承的方法很多,下面就只是其中的几种. 一. 原型链继承 function Person() { //被继承的函数叫做超类型(父类,基类) this.name='mumu'; this.age='18'; } Person.prototype.name='susu';//当属性名相同时需就近原则,先在实

  • Javascript基础学习笔记(菜鸟必看篇)

    什么是变量? 变量是用于存储信息的容器 变量的声明 语法: var 变量名 变量名 = 值; 变量要先声明再赋值 变量可以重复赋值 变量的命名规则 变量必须以字母开头: 变量也能以$和_符号开头(不过我们不推荐这么做): 变量名称对大小写敏感(a和A是不同的变量). 语句 语句以一个分号结尾:如果省略分号,则由解析器确定语句的结尾. 有个好的编码习惯,都要以 ; 结尾 数据类型 在JavaScript中,一段信息就是一个值(value).值有不同的类型,大家最熟悉的类型是数字.字符串(strin

  • javascript高级学习笔记整理

    一.js面向对象的一种实现 复制代码 代码如下: <script type="text/javascript"> function Person() { this.name = "张三"; this.age = 0; var nickName = "小三"; //类似私有变量,函数中的局部变量在函数执行完后自动销毁. this.SayHi = function () { alert("我的名字是" + this.n

  • JavaScript数据类型学习笔记分享

    本文实例为大家讲解JavaScript数据类型的相关资料,供大家参考,具体内容如下 1.引用类型 引用类型的值是引用类型的一个实例,引用类型是一种数据结构,用于将数据和功能组织在一起,也常被叫做类. 对象时某个特定引用类型的实例,新对象是使用new操作符后跟一个构造函数来创建的,构造函数本身就是函数,是出于创建新对象的目的而定义的. var person = new Object(); 2.Object类型 (1)Object类型对于应用程序中存储和传输数据来说,是非常理想的选择. (2)Obj

  • JavaScript数据类型学习笔记

    ECMAscript 中有5种简单的数据类型,也被称为基本数据类型:Undefined.Null.Boolean.Number和String.还有一种复杂的数据类型--Object. Undefined 类型 在使用var 声明变量但未对其进行初始化时,这个变量的值就是undefined.如: var number; document.write(number); //undefined 如果没有声明变量则会出现下面这种错误.如: document.write(str); //错误 但是用typ

  • JavaScript函数学习总结以及相关的编程习惯指南

    null 和 undefined Undefined相当于一个变量并没有明确的被赋值(是否被赋值, 可能无心忽略, 逻辑问题) JS的怪异之处就在于undefined真的是一个可以使用的值. > var foo; > foo undefined 同理,当缺失参数时 JavaScript 会分配一个 undefined: > function id(x) { return x } > id() undefined a = 1; a !== undefined // true a =

  • Python中的自定义函数学习笔记

    Python中的自定义函数学习笔记

    定义一个什么都不做的函数 复制代码 代码如下: >>> def a(): ... pass ... >>> def printHello(): ... print("hello") ... >>> printHello() hello >>> callable(printHello) True 顾名思义,callable函数用于判断函数是否可以调用: 有书上说,callable在Python3.0中已经不再使用,而

  • Python函数学习笔记

    局部名字静态检测 Python探测局部作用域的时候:是在python编译代码时检测,而不是通过他们在运行时的赋值. 正常的情况下,没在函数中复制的名字将在包含它的模块中查找: >>> x=99 >>> def selector(): ... print x ... >>> selector() 99 但是: >>> def selector(): ... print x ... x=100 ... >>> selec

随机推荐