JS基础——函数的创建和使用
在JS中函数在使用时实质上和我们平时学习的编程语言中的函数类似,它相同也具有函数名,參数,返回值,函数体等这些寻常函数所具有的内容。可是作为一种脚本语言,它确实也有自己不一样的地方。
一、创建
<span style="font-size:18px;">function box(){ //利用functionkeyword进行声明+函数名+(可加入參数)+{详细运行内容,可包含返回值}
return 'hello!';
}</span>
在这里,我们须要知道的是,box后面的()具有运行该函数的功能,同一时候可用来进行传參。
假设我们在JS中直接调用alert(box),那么结果会显演示样例如以下图:由于没有加(),所以它没有运行。仅仅有在加了()后,才会正常显示'hello!' (这里匿名函数中会用到)
二、函数传參
JS函数中用到一个arguments对象,能够实现动态传參,使得函数在传參时,并不介意有多少參数!
1、arguments对象简单使用
function box(){ //这里并没有传递參数
return arguments[0]+arguments[1]+arguments[2]; //这里代表第几个參数
}
alert(box('大家','国庆节','快乐!'));
能够看出来,arguments对象相当于一个对象数组,它将函数中传进来的參数放在了一个数组中,按顺序进行调用。
假设调用它的长度,会发现:长度为3,即參数的个数。
function box(){
return arguments.length;
}
可是出现了一个问题,这里并没有实现动态传參啊,仅仅是參数一一相应而已,没错,事实上,arguments对象仅仅能识别它自己事先定义好的个数的參数,假设外界传进来的參数不足,那么自己主动以undefined取代,假设传进来參数超出本身所定义的个数,那么,他会将多余的自己主动抹去,不会显示!
那么怎样才干实现动态传參呢?让上面的函数能够传进而且识别全部我想传进的參数,比方在实现加法时,并不知道用户相加的数字的个数有多少的时候,该怎么解决呢?这里用到了一个简单循环来实现。
2、利用arguments对象实现动态传參:
function box() { var sum = 0;
if (arguments.length == 0) return sum;
for(var i=0;i<arguments.length;i++)
{
sum += arguments[i];
}
return sum;
}
这样,我们假设调用函数alert(box(3,4,5,6,7,8,9)),不管加多少都能够得到想要的答案了。在这里须要注意的是,假设存在string格式的那么数字也会被当成字符串来处理,这时候‘+’会被当成&连字符来处理。
三、匿名函数
JS中函数还支持无名英雄,在声明函数时,没有函数名称的函数称为匿名函数(跟匿名信一个道理)。
function (){
return 'hello!';
}
但是没有函数名的函数怎样来调用呢?
匿名函数的运行方法:
1、通过赋给变量进行调用
var box=function(){
return 'lee';
} alert(box());
2、自我运行
在创建时,提到了()代表运行,在匿名函数中也是一样。
(function(){
alert( 'lee');
})()
<span style="font-size:18px;">//语法:(匿名函数)()第一个圆括号放匿名函数,第二个圆括号运行</span>
这里的()使得页面在载入时,就能够直接运行JS中的匿名函数。不再须要赋值。
3、匿名函数进行传參
这里也是用到了()这个小知识,第二个()代表运行,同一时候他还能够进行传參,所以,我们还能够为匿名函数进行传參。
比如:
(function(age){
alert(age);
}(100))
事实上,这里跟我们平时的函数原理是一样的。能够把前面整个匿名函数当成一个函数名,后面小括号进行传參和运行。这里的100能够用其它的表达式来取代,如页面中获取了某些表达式的值等。
以上是关于JS学习中函数的一些基础知识,须要把握住原有知识和如今所学内容之间的同样点和不同点,认真总结和重复理解,才干终于得以应用。关于匿名函数的使用还有非常多的应用,将在兴许继续总结!
JS基础——函数的创建和使用的更多相关文章
- JS基础--函数与BOM、DOM操作、JS中的事件以及内置对象
前 言 絮叨絮叨 这里是JS基础知识集中讲解的第三篇,也是最后一篇,三篇JS的基础,大多是知识的罗列,并没有涉及更难得东西,干货满满!看完这一篇后,相信许多正在像我一样正处于初级阶段的同学, ...
- 前端小课堂 js:函数的创建方式及区别
js 函数的创建大体有这几种方式: -1-函数表达式(函数字面量): 说白了就是把一个函数赋值给了一个变量. var fun1 = function(index){ alert(index); } f ...
- js中函数对象创建的总结
在JavaScript的函数对象创建方法中,可以分为三种情况: 1:第一种是使用function语句定义函数 <script type="text/javascript"&g ...
- JavaScript基础一(js基础函数与运算符)
[使用js的三种方式] 1.在HTML标签中,直接内嵌js(并不提倡使用) <button onclick=" alert('点就点')"> 点我啊</butto ...
- js基础 -函数
函数 定义 var a =function (){...}; 匿名函数方式定义function a(){} 直接定义 函数的参数arguments 可以接收任意个参数,是个像数组的内容,可for in ...
- js基础-函数基础
js 先对函数进行解析 然后在执行函数 定义一个函数 实现求两个数的乘 function mult(a,b){ return a*b; } mult(1,3) 计算1 - n 的和 封装成函数 fun ...
- js基础-函数-var和let的区别
javaScript简介 javaScript历史 1995年,Netscape公司是凭借Navigator浏览器成为当时第一代互联网公司. 网景公司希望在HTML界面上加一点动态效果,于是叫Bren ...
- js基础例子动态创建table实例
<style> table{ width:500px; font-weight: bold; border: 1px solid #000; border-collapse:collaps ...
- JS基础函数
函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块 <script> function demo(){ var a = 10; var b = 25; var sum = a + ...
随机推荐
- 浅析ArrayList,LinkedList的执行效率
以前见过很多文章说这两个东西,感觉自己还是没有深入理解,今天看了书明白一些,在此提出来和大家共同探讨: 面试的时候(基础)一般会问你使用过LinkedList或者ArrayList没有,简单的回答有或 ...
- prepareCall()运行存储过程
CallableStatement 对象为全部的 DBMS 提供了一种以标准形式调用已储存过程的方法.已储存过程储存在数据库中.对已储存过程的调用是 CallableStatement对象所含的内容. ...
- C++ STL源代码学习之算法篇
///因为篇幅太长,因此,删去了非常多接口,仅仅分析了内部实现,算法对迭代器的要求也被删去 /// search. template <class _ForwardIter1, class _F ...
- 飘逸的python - 发送带各种类型附件的邮件
上一篇博文演示了如何发送简单的邮件,这一篇将演示如何发送各种类型的附件. 基本思路就是,使用MIMEMultipart来标示这个邮件是多个部分组成的,然后attach各个部分.如果是附件,则add_h ...
- oracle转Mysql中,varchar2(10)和number应该转换为什么类型? (转)
一. varchar2(10)和number应该转换为什么类型? oracle转成mysql时:varchar2(10)可以转成varchar(10)number则要看oracle中存储的具体是什么类 ...
- Sybase Unwired Platform(SUP) 经常使用资源整理(不断更新中)
提示:建议刚開始学习的人看三个东西,详见以下的详细内容.然后再去看论坛,官方技术支持站点等资源. SUP移动开发平台 中文视频讲座 SUP入门讲座(Wang Jun) SUP系列学习笔记 SUP实验 ...
- [Elasticsearch] 控制相关性 (一) - 后面的相关度分值理论计算
从第一章翻译Elasticsearch官方指南Controlling Relevance一章. 控制相关度(Controlling Relevance) 对于仅处理结构化数据(比方日期.数值和字符枚举 ...
- Spring与Hibernate整合中,使用OpenSessionInViewFilter后出现sessionFactory未注入问题
近期在知乎看到一句话,保持学习的有一种是你看到了很多其它的牛人,不甘心,真的不甘心. Spring和hibernate整合的时候,jsp页面做展现,发现展现属性出现: org.apache.jaspe ...
- 【UFLDL】多层神经网络
请参见原始英文教程地址:http://ufldl.stanford.edu/tutorial/supervised/MultiLayerNeuralNetworks 本文是在学习该教程时记得笔记,供參 ...
- NSOperation 的使用(下载相关) 图片和文件都是能够的 断点续传 图片逐渐显示
// // ImageDownloader.h // NSOperationTest // // Created by ydc on 11-10-29. // Copyright 2011年 __My ...