JavaScript函数体系
第4章 JavaScript函数
1. 函数基本介绍
① 为什么需要函数
函数最大的好处就是将零散的代码封装到了一起,当我们要再次使用该功能的时候,不需要再重新书写代码,只需要调用封装好的函数就可以了。
函数再有一些地方也被称之为方法。
② 函数的创建
在JavaScript里面,创建函数的关键字为function
语法: function 函数名(形式参数)
{
//函数体
}

除了上面的方法,我们创建函数还有一种方法,通过对象来创建。

③ 函数的调用
方法非常简单,只需要写上函数名,后面加上一对括号(括号里面填写相应的参数)
软性要求:函数名一般是动词,因为函数一般描述的是一个动作

④ 函数的参数
JavaScript里面形参声明的时候不要加上var,加上反而会报错,如下:

1)参数名可以重复,同名的参数取最后一个参数值

2)即使函数声明的时候要求传递参数,但是在调用的时候也可以不传递参数。

3)在调用函数的时候,可以传递多个参数给函数,不用管声明函数时要求传递多少个参数

当一个函数要被执行的时候,我们的系统会做一些准备工作。其中之一就是为函数创建一个arguments的对象属性。arguments有点类似于数组,就是拿来存储所有传递过来的参数的。

和函数体相关的属性
1. arguments.length
表示函数被调用时实际传递的参数的个数

2. caller属性
caller属性并不是arguments对象属性里面的,是函数对象本身的属性。用来显示函数的调用者。如果函数是在全局环境中被调用,那么它的值就是null。如果是另一个函数中被调用,它的值就是那个函数。
全局执行环境中被调用

被一个函数调用

效果:

3. callee属性
callee属性就是arguments里面的一个属性,作用就是打印出正在执行的函数,也就是函数自己本身。

效果:

⑤ 函数的返回值
返回的关键字为return。JavaScript里面即便不写return,也会有返回值,返回一个undefined。

2. 函数的进阶
① 回调函数
所谓回调函数,就回头调用某个函数。例如:函数A有一个参数,这个参数是函数B。当我们函数A执行完之后就会去执行函数B。这就是一个回调的过程。(通俗的讲,就是将一个函数作为参数传递给另一个函数)

示例2:

② 匿名函数
所谓匿名函数,就是没有名字的函数,就是匿名函数。如下:

但是这里有一个问题,没有名字了,我们无法调用这个函数,这个时候,我们可以采用将函数赋值给一个变量,这个时候,这个变量名就是函数名

第2种调用匿名函数的方式:
用一对小括号将函数括起来,后面再跟上一对小括号,代表立即执行该函数。

注意:后面的括号我们是可以传递参数过去的

课堂练习:用户输入两个数a和b,要求a小于b。计算从a累加到b的值。
例如:100 50 提示:数值范围不正确
1 100 输出5050

变量的作用域和生命周期(重要)
① JavaScript里面没有块级作用域
C语言里面存在块级作用域,由一对花括弧来封闭代码,外界无法访问到。

但是,JavaScript没有块级作用域

② 执行环境
所谓执行环境,一般是和函数挂钩。每个函数都有自己的执行环境(换句话说,都有自己的作用域。)

效果:无法找到i,因为i是在test函数里面定义,test函数有自己独立的作用域(或者说是执行环境)

③ 作用域链
如果我们在某一个函数里面要使用某一个变量,但是我们在函数里面又没有声明这个变量,那么系统就会顺着函数的作用域链一层一层往外找。

结果:会输出10,虽然test函数里面没有i这个变量,但是系统会顺着函数的作用域链一层一层往外找。
④ 查询标识符
当我们的函数遇到一个变量的时候,它会顺着作用域链一层一层往外找,直到找到最近的那个变量。

上面的代码会弹出7,但是如果没有var i = 7;会弹出3;如果连var i= 3;也没有,会弹出10,如果连var i= 10也没有,会报错,找不到i。
JavaScript函数体系的更多相关文章
- JavaScript工作体系中不可或缺的函数
一.函数的概念 日常生活中,我们要完成一件事,总是习惯先有一个计划,后期按照计划,一步一步执行,则能够完成,并且达到一定效果实现一定的功能.在编程的世界里,“功能”可称呼为“函数”,因此“函数”即一段 ...
- ABP(现代ASP.NET样板开发框架)系列之21、ABP展现层——Javascript函数库
点这里进入ABP系列文章总目录 基于DDD的现代ASP.NET开发框架--ABP系列之21.ABP展现层——Javascript函数库 ABP是“ASP.NET Boilerplate Project ...
- JavaScript权威设计--JavaScript函数(简要学习笔记十一)
1.函数调用的四种方式 第三种:构造函数调用 如果构造函数调用在圆括号内包含一组实参列表,先计算这些实参表达式,然后传入函数内.这和函数调用和方法调用是一致的.但如果构造函数没有形参,JavaScri ...
- JavaScript 函数
JavaScript 函数 介绍:函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块.嗯,就像Java中封装的方法一样. 将脚本编写为函数,就可以避免页面载入时执行该脚本. 函数包含着一些代码 ...
- javascript 函数初探 (一)--- 神马是函数
神马是函数? 所谓函数,本质上是一种代码的分组形式.我们可以通过这种形式赋予某组代码一个名字,以便与之后的调用.下面,我们来示范以下函数的声明: function sum(a, b){ var c = ...
- JavaScript函数的概念
函数是这样的一段代码,它只定义一次,但可能被执行或调用任意多次. JavaScript函数是参数化的:函数的定义会包含形参,这些参数在函数的整体中像局部变量一样工作.函数调用时会为形参提供实参的值.除 ...
- Javascript函数重载,存在呢—还是存在呢?
1.What's is 函数重载? );//Here is int 10 print("ten");//Here is string ten } 可以发现在C++中会根据参数的类型 ...
- JavaScript 函数声明,函数表达式,匿名函数,立即执行函数之区别
函数声明:function fnName () {-};使用function关键字声明一个函数,再指定一个函数名,叫函数声明. 函数表达式 var fnName = function () {-};使 ...
- javascript 函数重载 overloading
函数重载 https://en.wikipedia.org/wiki/Function_overloading In some programming languages, function over ...
随机推荐
- 二 kafka设计原理
kafka的设计初衷是希望作为一个统一的信息收集平台,能够实时的收集反馈信息,并需要能够支撑较大的数据量,且具备良好的容错能力. 1.持久性 kafka使用文件存储消息,这就直接决定kafka ...
- mybatis 学习四 源码分析 mybatis如何执行的一条sql
总体三部分,创建sessionfactory,创建session,执行sql获取结果 1,创建sessionfactory 这里其实主要做的事情就是将xml的所有配置信息转换成一个Confi ...
- 第三波精品Android源码袭来!免费下载
今天又汇总了一些源码供大家免费下载学习! 1.Android实现NewQuickAction快捷菜单NewQuickAction能根据点击事件发生的坐标来显示一个快捷菜单,比如点击位置在靠近底部,则弹 ...
- SpringMVC 学习笔记(请求方法的返回值和参数)
在用注解对配置 处理器时,一般是一个方法处理一个请求,不同方法的返回类型有着不同的意义. 返回值为 ModelAndView 类型 ModelAndView 是Model 和 View 的一个集合类型 ...
- RN控件之DrawerLayoutAndroid导航栏
/** * Sample React Native App * https://github.com/facebook/react-native */ 'use strict'; import Rea ...
- [poj3250]单调栈 Bad Hair Day
解题关键:将每头牛看到的牛头数总和转化为每头牛被看到的次数,然后用单调栈求解,其实做这道题的目的只是熟悉下单调栈 此题为递减栈 #include<cstdio> #include<c ...
- product of大数据平台搭建------CM 和CDH安装
一.安装说明 CM是由cloudera公司提供的大数据组件自动部署和监控管理工具,相应的和CDH是cloudera公司在开源的hadoop社区版的基础上做了商业化的封装的大数据平台. 采用离线安装模式 ...
- java第一天--Java开发环境的搭建以及使用eclipse从头一步步创建java项目
一.java 开发环境的搭建 这里主要说的是在windows 环境下怎么配置环境. 1.首先安装JDK java的sdk简称JDK ,去其官方网站下载最近的JDK即可..http://www.orac ...
- Bootstrap栅格学习
参考:https://segmentfault.com/a/1190000000743553 节选翻译自The Subtle Magic Behind Why the Bootstrap 3 Grid ...
- MATLAB解决常微分方程
首先得介绍一下,在matlab中解常微分方程有两种方法,一种是符号解法,另一种是数值解法.在本科阶段的微分数学题,基本上可以通过符号解法解决. 用matlab解决常微分问题的符号解法的关键命令是d ...