JS入门(四)
接之前一篇的函数。写之前的函数的时候讲的比较笼统,在这重新写一下函数的内容。
函数:
之前提过,函数就是代码复用的一种机制或是将代码封装成功能的代码段。函数的声明在这边就不多提了,因为相对来说比较简单。除了正常的函数声明之外,还有一种函数的声明方式,就是函数表达式。它的格式如下:
var fun=function(){
console.log("啦啦啦");
}
fun();
先是用var关键字来定义一个变量,在等号的右边写一个匿名函数,匿名函数,顾名思义也就是没有名字的函数,匿名函数在调用的时候,是用变量名来加一个小括号的形式调用它。值得注意的是,在用函数表达式声明函数的时候记得要再花括号后加一个分号,不然程序有可能出现一些不可预知的错误。比如后面如果跟了个自执行函数的话,就有可能报错或者出现一些跟我们想的不一样的结果。
这里提到了个自执行函数,那么什么是自执行函数呢?自执行函数是没有名字的,定义了之后马上调用的函数。这种函数多用于一次性使用的时候。它得格式如下:
(function () {
console.log("啦啦啦");
})();
//------------------------------分割线---------------------------
(function () {
console.log("哈哈哈");
}());
第一眼看感觉有点复杂,那要怎么理解记忆呢?我们都知道,函数的调用是用函数名+括号的形式来调用的。那么单独使用函数名会输出什么结果呢?比如下面这段代码:
function fun(){
console.log("啦啦啦");
}
console.log(fun);
在控制台打印的结果为:

由此我们可以知道,使用函数表达式定义函数之后,变量跟函数体是等价的。因此,自执行函数就很好记了,就是把以前写函数名的地方改成了函数体的形式,并且在外面加了一层括号来指定自执行函数的区域。自执行函数的好处就是不需要定义变量名,而且定义了之后马上调用。
除此之外,函数还有很多其他的作用,比如函数还可以作为一个参数传入另一个函数之中。根据前面自执行函数演示的代码可以知道,当单独打印函数名的时候,会打印出整个函数体。函数是一种数据类型,如果用typeof来打印一下函数名的时候,会打印出一个function的值。
比如下面这段代码,他在控制台输出的结果就是function。由此我们可以知道,函数是有数据类型的,并且它的类型是function。
function fun(){
console.log("啦啦啦");
}
console.log(typeof fun);
因此,函数可以作为一个参数来传入另一个函数之中。那具体是怎么使用的呢?可以看下面的代码。
function getResult(a, b, fn) {
return fn(a, b);
}
我们在getResult这个函数中定义了三个参数,a,b,fn。这三个参数都只是形参,因此可以是任意值。首先我们先分析一下这段代码,这段代码定义了一个函数名为getResult的函数。这个函数有三个参数a,b,fn。它的返回值是一个函数名为fn,参数为a,b的函数。
在这里,我们把fn看成了一个函数来使用,并且把getResult函数中的形参a和b来当做fn函数中的实参。这样,我们就实现了把函数当做变量传入另一个函数中。在函数调用的时候,我们就可以用这种形式来表示:
var f1 = function(a,b){
return a*b;
};
console.log(getResult(15, 60, f1));
在这里,我们先用函数表达式的方法定义了一个名叫fn的函数,并且把他当成参数传进了getResult函数中。函数执行的结果为900;这样,我们就已经完成了把函数作为一个参数传入另一个函数中。不过,这段代码还简化一下。
因为在定义了函数之后,函数名跟函数体是等价的,所以,上面代码还可以简写成这样。
Console.log(getResult(15,60,function(a,b){
return a*b;
}));
说完了这些,然后在说说JS中一些跟其他语言不同的地方,比如函数的重载,在JS中是没有函数重载的。既然说JS没有重载的话,就不得不提一下什么是重载了。所谓的重载就是函数名相同,但是函数的形参个数不同,或者形参的数据类型不同,这样就构成了函数的重载。
function getSum(a, b) {
return a - b;
}
function getSum(a, b, c) {
c = c || 0;
return a + b + c;
}
console.log(getSum(1, 2));
比如说上面这段代码,程序运行的结果是3,为什么是3呢?在JS中,如果有重名的函数,那么后面的函数会将前面的函数覆盖掉。所以这段代码只会执行后面那个函数,而前面的函数则被后面的函数给覆盖掉了。
还有一个就是作用域的问题,跟其他语言不同的是,JS中是没有块级作用域的,所谓的块级作用域,就是一个{}之间包裹的区间。但是,JS中有全局作用域和局部作用域。全局作用域就是同一个页面中的script标签之间的区域。在全局作用域中的变量是可以在任何地方都能访问到的。而局部作用域则是函数内部的作用域,在函数内部定义的变量则是局部变量。在这里,不得不提一点就是变量的赋值前都会有一个var关键字,如果在函数内部没有用var定义的变量,这个变量就会变成全局变量,会造成变量的污染。
JS入门(四)的更多相关文章
- 转:arcgis api for js入门开发系列四地图查询
原文地址:arcgis api for js入门开发系列四地图查询 arcgis for js的地图查询方式,一般来说,总共有三种查询方式:FindTask.IdentifyTask.QueryTas ...
- React.js入门笔记
# React.js入门笔记 核心提示 这是本人学习react.js的第一篇入门笔记,估计也会是该系列涵盖内容最多的笔记,主要内容来自英文官方文档的快速上手部分和阮一峰博客教程.当然,还有我自己尝试的 ...
- Ember.js入门教程、博文汇总
第一章 对象模型 Ember.js 入门指南——类的定义.初始化.继承 Ember.js 入门指南——类的扩展(reopen) Ember.js 入门指南——计算属性(compute properti ...
- 让我们一起学习《Node.js入门》一书吧!
Node.js入门 读完本书之后,你将完成一个完整的web应用,该应用允许用户浏览页面以及上传文件. 里面对一些知识的讲解,让你略窥Node.js的门径.最好一段代码一段代码的写下来,我的习惯是手里拿 ...
- Python爬虫入门四之Urllib库的高级用法
1.设置Headers 有些网站不会同意程序直接用上面的方式进行访问,如果识别有问题,那么站点根本不会响应,所以为了完全模拟浏览器的工作,我们需要设置一些Headers 的属性. 首先,打开我们的浏览 ...
- 转 Python爬虫入门四之Urllib库的高级用法
静觅 » Python爬虫入门四之Urllib库的高级用法 1.设置Headers 有些网站不会同意程序直接用上面的方式进行访问,如果识别有问题,那么站点根本不会响应,所以为了完全模拟浏览器的工作,我 ...
- d3.js 入门指南
说到数据可视化,我们会行到很多优秀的框架,像echarts.highcharts,这些框架很优雅,健壮,能满足我们对可视化的大部分需求,但是缺点也很明显,就是这些框架几乎是不可定制化的,当遇到特殊的需 ...
- 极简 Node.js 入门 - 2.4 定时器
极简 Node.js 入门系列教程:https://www.yuque.com/sunluyong/node 本文更佳阅读体验:https://www.yuque.com/sunluyong/node ...
- 1. web前端开发分享-css,js入门篇
关注前端这么多年,没有大的成就,就入门期间积累了不少技巧与心得,跟大家分享一下,不一定都适合每个人,毕竟人与人的教育背景与成长环境心理活动都有差别,但就别人的心得再结合自己的特点,然后探索适合自己的学 ...
- JS入门之ActiveXObject对象(转载)
JS入门之ActiveXObject对象 此对象提供自动化对象的接口. function ActiveXObject(ProgID : String [, location : String] ...
随机推荐
- HDU-1395-2^x mod n = 1(数学题(二次出错))
题目链接: http://acm.hdu.edu.cn/showproblem.php?pid=1395 这题一定要滴水不漏的把所有代码全部看完. 这个题目是一个数学类型的题,我也没思路,只知道n== ...
- MySQL删除单列重复或多列同时重复值并保留一条
在生产环境中,我们有的列是不允许出现重复值的,亦或是某两列不允许同时重复,但由于前端未做限制,或者没限制住,出现了单列重复值,或者两列本应组成唯一组合却也出现重复,这两种情况都是不允许的.现在由于前端 ...
- hyperLink的定制
在iReport中增加hyperLink,点击之后没有反应:需要重新写一遍net.sf.jasperreports.view.JRViewer; 修改其中的gotoHyperlink方法: case ...
- 前端自动化构建工具-yoman浅谈
如今随着前端技术的飞速发展,前端项目也变得越来越复杂. 快速的搭建一个集成多种工具和框架的复杂前端项目也越来越成为一种需求. 当然如果你要自己从0开始完全自己diy,绝对可以,只不过需要耗费一些不少的 ...
- Linux 用键盘操作窗口
以下是我从各处搜集来的关于用键盘操作窗口信息,操作可能不是最简或者最好的,当然也可能不是最全的,以后遇到新的操作,我会即使添加,如果你有我没有列出的操作,希望你能提出,我可以加上! 我实验的操作系统是 ...
- 开源OSS.Social项目进阶介绍和使用展示
在开源OSS.Social微信项目解析的随笔中,我简单给大家分享了进行中微信项目的概要设计,没有全局介绍,没有详细讲解,也没有如何使用,很多朋友估计匆匆一瞥就忙着抢开工红包去了.本着不能马虎的态度,这 ...
- ArcGIS API for JavaScript 4.2学习笔记[1] 显示地图
ArcGIS API for JavaScript 4.2直接从官网的Sample中学习,API Reference也是从官网翻译理解过来,鉴于网上截稿前还没有人发布过4.2的学习笔记,我就试试吧. ...
- 学习window系统下的注册表
一直不明白注册表是一个什么鬼,查了资料后大概明白了注册表到底有什么用,其实简单来说注册表就是一个存放系统.硬件.应用配置信息的数据ku.##### 一.注册表的来历在最早的视窗操作系统win3.x中, ...
- FMDB的简单用法
使用cocoaPods将FMDB下载到工程 第一步:引入框架,引入支持类库(libsqlite3.0.tbd) #import <FMDB.h> 声明属性 @interface ViewC ...
- js-tab选项卡
说道tab选项卡,顾名思义,就是切换不同内容分类,想必学过前端的都知道,tab有很多方法可以实现,最近刚跟师傅学了一种,感觉很简便,很实用哦. 一.先看一下结果 二.可以根据图来布局,首先上面标 ...