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 + ...
随机推荐
- JVM学习03_new对象的内存图讲解,以及引出static方法(转)
目录 -=-讲解对象创建过程中,-=-堆内存和栈内存的情况 -=-构造函数对类对象的成员变量的初始化过程 -=-构造函数出栈 -=-类的方法在不访问类对象的成员变量时造成的内存资源浪费怎么解决? -= ...
- Hdu 4539 【状态DP】.cpp
题意: 一个炮兵可以攻打和他之间曼哈顿距离为2的士兵,给出你一块n*m的战场,告诉你哪些地方可以站人哪些地方不可以,问你最多可以安放多少个士兵? n <= 100, m <= 10 思路: ...
- MD5加密,解密
using System; using System.Collections.Generic; using System.Text; using System.Globalization; using ...
- WPF 各种基础动画实现
C# using System; using System.Collections.Generic; using System.Linq; using System.Text; using Syste ...
- 杭州电 3711 Binary Number
Binary Number Time Limit: 4000/2000 MS (Java/Others) Memory Limit: 65536/65536 K (Java/Others) To ...
- 【设计优化】-使用缓冲(Buffer)提高程序性能
缓冲区是一块特定的内存区域.开辟缓冲区的目的是通过缓解应用程序上下层之间的性能差异,提高系统性能. 缓冲能够协调上层组件和下层组件的性能差异.当上层组件性能因为下层组件时,能够有效地降低上层组件对下层 ...
- 阅读UML类图和时序图
这里不会将UML的各种元素都提到.我仅仅想讲讲类图中各个类之间的关系. 能看懂类图中各个类之间的线条.箭头代表什么意思后,也就足够应对 日常的工作和交流: 同一时候,我们应该能将类图所表达的含义和终于 ...
- VMware vSphere 服务器虚拟化之十七 桌面虚拟化之安装View链接服务器
VMware vSphere 服务器虚拟化之十七 桌面虚拟化之安装View链接服务器 View链接服务器(View Connection Server)是Vmware Horizon View桌面虚拟 ...
- Windows 8 应用开发 - 磁贴
原文:Windows 8 应用开发 - 磁贴 我们开发的应用在Win8 界面中会以磁贴形式展现,默认情况下磁贴会显示应用图标,即项目工程中的Logo.png图片文件.开发人员可按应用的需要使 ...
- VS2010程序打包操作
摘录:http://www.cnblogs.com/daban/archive/2012/06/27/2565449.html 1. 在vs2010 选择“新建项目”----“其他项目类型”-- ...