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 + ...
随机推荐
- c#怎样获取excel单元格的RGB颜色
这段时间一直在做office的工作.前2天获取单元格的颜色的问题一直没搞明确. 開始我想用的就是Npoi.主要前一部分的工作都是用Npoi完毕的 row.GetCell(j).CellStyle.Fi ...
- jQuery cxSelect 多级联动下拉菜单
随着电商热门,这种多层次的互动更充分地体现在下拉菜单,最明显的是多级联动地址下拉选择,因此,这里是一个简单的分享 jQuery cxSelect 多级联动下拉菜单 cxSelect 它是基于 jQue ...
- windows phone (13) 样式继承
原文:windows phone (13) 样式继承 在上一遍文章中已经介绍到可以在Resources集合中定义样式,我们也可以在一个样式上引用其他的样式,这就是继承的概念,使用方法是将引用的样式放置 ...
- JAVA先进-设置(1)
>Arrays 基本阵列 1.常见的数组产生于main() 函数,数组下标的索引不能超过0到int的范围 2.当程序试图訪问数组的第一个或者最后一个数据的时候,会发生ArrayIndexOutO ...
- 使IIS Express支持其他网络客户端访问
今天尝试利用Android客户端Web浏览器访问VS2012 IIS Express调试中的Web应用,发现这个IIS Express仅支持localhost主机名地址访问. 上网搜索找到解决方案,几 ...
- Ubuntu 组态 Tomcat而每天的错误解决
统环境:Ubuntu 14.10 安装版本号:apache-tomcat-7.0.54.tar.gz 安装步骤: 1.下载 Tomcat 下载 apache-tomcat-7.0.54.tar.gz ...
- ZOJ Problem Set - 3829Known Notation(贪心)
ZOJ Problem Set - 3829Known Notation(贪心) 题目链接 题目大意:给你一个后缀表达式(仅仅有数字和符号),可是这个后缀表达式的空格不幸丢失,如今给你一个这种后缀表达 ...
- 新项目架构从零开始(三)------基于简单ESB的服务架构
这几个月一直在修改架构,所以迟迟没有更新博客. 新的架构是一个基于简单esb的服务架构,主要构成是esb服务注册,wcf服务,MVC项目构成. 首先,我门来看一看解决方案, 1.Common 在Com ...
- 取证学习资料DVD
http://www.infiniteskills.com/training/learning-computer-forensics.html https://www.youtube.com/watc ...
- JAVA技术交流群
推荐:组[八方扑灭]:http://jq.qq.com/?_wv=1027&k=RFLXu0. QQ: 292352612 集团专注于技术.软件project.JAVA.c\c++.WEB. ...