函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块

<script>
    function  demo(){
     var  a = 10;
     var  b = 25;
     var sum = a + b;	
    alert(sum);
   }
    demo()
</script>

如上,一个简单的函数它的格式是function(){ },只是一个函数必须要有默认的格式。

而后面的demo只是一个函数名,与class一样自己取的.但它需要是一个有意义的函数名。

{函数里面被称为代码块},也是函数的核心所在,

代码块中第一行是变量var, 变量名假设是a。赋值a的对象是10。那么这个a就已经有了10的值了。

那么第二行变量名为b它包含着25的值。

第三行是变量名sum总和,它包含着a与b相+加的一个值;这个很好理解。

那么它们还需要将一个值表达出来这个结果,于是alert()就来了它的意思是网页直接弹出一个窗口。

弹出来的窗口里显示什么呢?    也就是(sum)之前变量的总和结果。

这样还不能显示出来,因为它们还是处在函数内,还需要将它调用出来,所有最后一个函数名 ”demo()“就是来实现函数这一切的!


 

下面则是一个包含参数,返回的函数。我们来分析一下它里面有些什么东东.

<script>
    function demo(a,b){
    var sum = a + b;
    return sum;	
    }
    var vl = demo(10,20);
    alert(vl)
</script>

 这个例子比上面多了几个东西,首先函数名demo()中有(a,b)这两位参数,参数是多行代码中偷懒的神技。!它们之间必须用,逗号隔开

当变量sum=a+b时,我们知道了变量的总和,代码块中是一个循环的世界,要引用值的话需要找帮手。

return是返回的意思,结束代码块中的循环,取出代码块所完成的一个值"sum"。

它们之间用空格连接,不需要添加多余的元素。这样sum的值就打包好了

函数外首先建立一个变量,将打包好函数值demo(10,20)进行赋值,然后交到vl手中;

最后在通过alert(vl)测试结果.


 

如需将函数转移到html中,那我们需要设置一个onclick...

<script>
    function demo(){
      var  a  =  10;
      var  b  =  20;
      var  sum  =  a + b;
      alert(sum);
   }
</script>
<button onclick="demo()">
按钮
</button>

  函数样式以及ok了,第一行变量声明赋值a为10;

第二行变量声明赋值b为20;第三行sum得到它们总和;

alert(sum);将它以弹出窗口的模式显示出来;函数就已经打包好了.

我们返回到html中,button是一个按钮。button里面onclick进行了标记。

随后我们带着打包好的函数onclick="demo()"带到了html中,随后刷新页面点击按钮即可.

 

posted on 2015-11-27 17:15  良1  阅读(393)  评论(0编辑  收藏  举报