6.函数

6.1.函数是什么?

函数就是具有名称和一定功能点代码块,这段代码块被封装起来,由一组语句组成,它们是JavaScript的基础模块单元,用于代码复用、信息隐藏和组合调用。一般来说,所谓编程,就是将一族需求分解成一组函数与数据结构的技能。

因为函数可以封装一个功能,该功能可以被多次使用而达到代码复用的目的,也可以达到模块化开发的目的,所以,必须学好函数

6.2 函数的语法结构

函数的定义语法:(必须这样写,规定死了的) function 函数名字(){ 这里写功能代码 }

实例:

<script type="text/javascript">
//>>1.定义一个函数(功能)
function showInfo(){
document.write("世界小姐冠军-凤姐 <br />");
}
//>>2.通过函数名称后面加()的方式调用(执行)函数,也可以多次调用
showInfo();
showInfo();
//运行完成后会在页面输出两句话 “世界小姐冠军-凤姐”
</script>

总结:函数定义前面必须加关键字function,函数调用必须用函数名称加括号的形式,()表示执行(调用)函数,()前加名称代表执行的是哪个函数**

6.3.函数的参数

函数的参数到底是什么鬼?参数本质上就是函数内部需要用到的变量,函数的结果会根据外部传入的变量值的不同而发生改变。函数可以有参数也可以不用参数,参数多少也由函数功能决定。

实例:

 //定义一个函数,输出1到10之间到数字
function showNum(){
for(var i = 1;i<=10;i++){
console.log(i);
}
}
showNum();

以上函数实现了输出1到10的功能,但是这个功能不太灵活,如果需求瞬间改变,例如需要输出1到100之间到数或者1-50之间到数,那么又要重新把代码写一遍,而输出1-100之间的数和输出1-50之间的数的函数实现代码都是差不多的,只是变化了函数内部for循环的条件表达式,让i<=n,这个n就是一个可变的数,如果n=50,那么就输出1-50之间的数,如果n=100,那么就是输出1-100之间的数,所以我们把这个可变的数作为一个参数传到函数内部,此时函数就变得灵活多了

改进后的函数:

/**
*输出1-n之间的数
*/
function showNum(n){
for(var i = 1;i<=n;i++){
console.log(i);
}
}
showNum(10);//输出1-10之间的数
showNum(100);//输出1-100之间的数
showNum(50);//输出1-50之间的数

函数的参数分为形参和实参,函数定义的时候,写在()中的变量,叫作函数的形参,可以理解为形式上的参数,本质上就是在函数内部使用到到变量。

函数在调用的时候传入到参数叫作函数的实参,也就是说传入的是一个具体的值,可以理解为实际的参数。函数调用的时候,传入一个具体的值,在函数内部用对应的形参接收,拿去参与具体的运算

总结:函数在调用传参的时候一定要注意一个原则,那就是必须要根据函数形参的要求来进行实际参数的传值。位置顺序也必须一一对应**

例如以下错误写法

/**
*输出1-n之间的数
*/
function showNum(n){
for(var i = 1;i<=n;i++){
console.log(i);
}
}
showNum(1,100);//错误传参 实参个数比形参个数多
showNum("sdfsf");//n 在函数中必须是数字类型才能进行运算,如果传递字符串,也是不符合要求的。

总之,传实参的时候一定要根据形参的要求传

6.4.函数的返回值

函数的返回值就是函数被调用后返回的结果,当一个函数被调用时,它从第一句开始执行,并在遇到关闭函数体的}时结束。然后函数把控制权交给调用该函数的程序。函数的返回值用return关键字加上返回的结果,也就是说,用return关键字,指定一个函数的返回结果,例如:

/**
*需求:1、定义一个函数实现加法计算器的功能,计算两个数相加*并且需要得到结果。2、输出两个数的结果
*
*/
//>>1.定义函数两个数相加的功能函数
function add(num1,num2){
var result = num1+num2;
return result;
}
//>>2.调用函数,将返回结果赋值给一个变量
var result = add(1,2);
//>>3.输出结果
console.log(result);
/**
*以上代码在第11行的时候调用了函数add,并传入了参数1,2,此时执行函数add,计算出结果3并且赋值给result,通过return语句将result返回,这是函数的执行结果就是3 ,将函数返回结果又赋值给变量result 在13行输出
*/

总结:有时候函数有return语句,有时候函数又没有写return语句,那到底什么时候该写,什么时候不写呢?当函数的执行结果被别的地方的语句使用的时候,就需要用return返回一个执行结果,以便别的语句使用,例如以下代码:

//需求:定义一个函数,输出一段文字
function showText(){
console.log("床前明月光,地上鞋两双");
}
showText();//此时调用函数的话,只是执行了一个函数,输出一段文字,而函数的结果并没有被别的程序使用到,所以不用return结果

上例中,求两个数相加,并且输出,函数add的功能只是求出两个数的和,还需要把这个结果赋值给一个变量,并且将结果输出,所以在add函数内部需要return一个结果 return语句用来提前返回。当return被执行时,函数立即返回而不再执行余下的语句。例如:

function showNum(num){
if(num==1){
return ;
}
num++;
console.log(num);
}
showNum(1);//什么结果都没有,里面做了判断,当传的值num==1的时候,执行了return语句,程序提前返回,不会执行后面的代码;
showNum(2);//在控制台输出3 因为前面if里面return语句没有执行,所以num由2加到3并且输出3
一个函数总是会返回一个值,如果没有指定返回值,则返回undefined。从这句话可以看出,return的功能就是指定一个返回值,如果没有指定那么函数就返回undefined

实例:

function add(num1,num2){
var result = num1+num2;
}
var result = add(1,2);
console.log(result);//这里输出结果为undefined,函数add内部没有指定函数的返回结果,默认返回undefined,因此打印出的结果就是undefined 而不是3

6.5.定义函数三部曲

从上面函数的定义我们可以看出,函数主要包含3部分内容,函数的名称,函数体,以及函数的返回值。那么在实际运用中到底应该怎样去合理的定义一个函数呢?从上面的例子中可以总结出,函数定义大体上可以分成3部分来完成

第一步:从大局入手,根据需求分析语义,确定函数的名称;确定函数名称的时候要注意,函数名称和变量的命名规则一样,尽可能的要有意义,驼峰式命名,让人一看就大体知道这个函数是用来干嘛的,在定义一个函数之前,在脑袋里要有具体实现这个功能的具体思路

第二步:从函数功能内部入手,确定需要有哪些未知的数据参与运算,这时就要确定函数参数的个数以及参数的类型。

第三步:从函数功能外部入手,看看函数会不会被别的程序使用到,如果有别到程序使用到这个函数的结果,那么就return指定函数的返回结果,如果函数的结果没有被用到,那么就不需要写return语句了。

还是以求两个数的和为例子,说明函数定义的步骤:

/**
*需求:1、定义一个函数实现加法计算器的功能,计算两个数相加*并且需要得到结果。2、输出两个数的结果
*
*第一步:从需求中可以看出,函数的功能只是求和,那么很简单的就可以确定函数名称 add(相加的意思)
第二步:函数体中只需要将两个数相加即可,但是到底是哪两个数呢?所以需要两个未知的参数参与运算,所以确定参数个数和类型,类型为数字类型
第三步:从整个外部环境中可以看出,函数执行完成求出和以后还要被输出出来才能满足需求,函数的执行结果需要被外部的代码用到,因此,需要用return语句把函数执行结果返回,最终定义出了函数
*/
function add(num1,num2){
var result = num1+num2;
return result;
}
var result = add(1,2);
console.log(result);

练习: 1、设计比较两个数的最大值功能 直接输出 2、任意两个数中最大值和 50比较, 输出最大值 3、设计一个ATM取钱的功能,输入帐号 和 密码 还有取多少钱 直接输出 4、设计制作表格的功能 5、封装函数 (循环)输出1-n之间能被3整除的数 6、封装函数 求解1-n能被3和5同时整除的数字的和

6.6.变量的作用域

第一,在讨论什么是变量到作用域之前,我们先来看看什么是域,域从字面上理解到话,可以看作是一个空间、地域、或者说范围,作用又是什么呢?在程序中,作用通常可以理解为读和写;那么变量的作用域就不难理解了,变量的作用域就是变量的作用范围,也就是说在什么样的空间或者范围内,可以对变量进行读写操作。

第二个问题,为什么要用变量的作用域?理解了变量的作用域,就可以在不同的范围内随意的使用变量,用相同的名字,引用不同的值。避免相互干扰相互影响,很方便的调试程序,因此,不仅要理解变量的作用域还要灵活的应用

第三个问题,怎样划分作用域,变量的作用域有哪几种?在JavaScript中,变量的作用域有两种,一种叫作全局变量,一种叫作局部变量。而这两种作用域是以函数作为划分的依据的,在函数内定义的变量叫作局部变量,只能在函数内部使用,函数外面定义的变量叫作全局变量,在整改程序中都可以被使用到,例如:

var a = 12;
function fn1(){
var a = 11; //这里在函数到内部定义了一个变量a,这个变量为局部变量;
alert(a);//这里弹出到变量就是局部变量a 结果为11
}
function fn2(){
alert(a);//这里使用到是全局变量a,值为12
}
fn1();//弹出11
fn2();//弹出12

总结:函数内部可以直接使用函数外定义的全集变量,在函数内部使用全局变量的时候不要加var关键字,否则就变成了重新定义一个局部变量了。如何在实际应用中灵活定义变量呢?如果变量的数据只在函数内部使用,请使用局部变量。如果变量的数据函数内部和外部都要使用,请使用全局变量。

作业

1、封装函数输出n行“*”

*
***
*****
*******
......

2、封装函数,实现返回三个数的和

3、封装函数,实现返回三个数的最大值 4、写出下面程序的执行顺序

    function showNum(n){
document.write(n+"<br />);
n++;
if(n<=3){
showNum(n)
}
document.write(n-1+"<br />);
}

5、封装函数,实现返回三个数的最小值

螺钉课堂视频课程地址:http://edu.nodeing.com

js语法基础入门(6)的更多相关文章

  1. js语法基础入门(1)

    1.基础入门 1.1.hello world 1.1.1.JavaScript是什么? JavaScript是一门跨平台.面向对象的轻量级脚本语言,在web开发中被广泛应用 1.1.2.JavaScr ...

  2. js语法基础入门(7)

    7.数组 7.1.什么是数组以及相关概念? 什么是数组?是一组数据有序排列的集合.将一组数据按一定顺序组织为一个组合,并对这个组合命名,这样便构成了数组. 什么是数组元素?组成数组的每一个数据称为数组 ...

  3. js语法基础入门(1.2)

    1.4.查找元素的方法 1.4.1.查找元素的方法 JavaScript可以去操作html元素,要实现对html元素的操作,首选应该找到这个元素,有点类似于css中的选择器 html代码: <d ...

  4. js语法基础入门(5.2)

    5.2.循环结构 当一段代码被重复调用多次的时候,可以用循环结构来实现,就像第一个实例中出现的场景一样,需要重复询问对方是否有空,这样就可以使用循环结构来搞定 5.2.1.for循环语句 //语法结构 ...

  5. js语法基础入门(5.1)

    5.流程控制 5.1.选择结构 程序流程图 图例: 椭圆: 开始/结束 矩形: 操作 菱形: 判断 连接线: 走向 可以根据程序流程图,理清楚程序执行的流程 5.2.1.if语句 //if语句语法结构 ...

  6. js语法基础入门(4)

    4.运算符 4.1.什么是运算符? 运算符就是用来表示具体运算规则的符号,例如数学计算中的加减乘除就是具体的运算规则,我们分别用"+ - * /"等符号来表示 4.2.运算符的分类 ...

  7. js语法基础入门(3)

    3.数据类型 3.1.数据类型学习重点 前面我们通俗的讲了,数据类型其实就是对数据进行了分类,那么,在js中到底把数据分成了几类?这些类的名称叫什么?每个分类下面有那些值?这些问题是需要记清楚的,例如 ...

  8. js语法基础入门(2)

    2.变量 2.1.变量的声明 声明变量的时候没有赋值,默认输出undefined //通过var 声明一个变量 var user: //默认输出undefined 可以同时声明多个变量 var use ...

  9. Swift语法基础入门三(函数, 闭包)

    Swift语法基础入门三(函数, 闭包) 函数: 函数是用来完成特定任务的独立的代码块.你给一个函数起一个合适的名字,用来标识函数做什么,并且当函数需要执行的时候,这个名字会被用于“调用”函数 格式: ...

随机推荐

  1. 【HBase】表的version

    建表.添加数据 Examples: hbase> create 'ns1:t1', 'f1', SPLITS => ['10', '20', '30', '40'] hbase> c ...

  2. 团体天梯赛L1-041.寻找250

    对方不想和你说话,并向你扔了一串数…… 而你必须从这一串数字中找到“250”这个高大上的感人数字. 输入格式: 输入在一行中给出不知道多少个绝对值不超过1000的整数,其中保证至少存在一个“250”. ...

  3. Shell中傻傻分不清楚的TOP3

    Shell中傻傻分不清楚的TOP3 发布文章 近来小姐姐又犯憨憨错误,问组内小伙伴export命令不会持久化环境变量吗?反正我是问出口了..然后小伙伴就甩给了我一个<The Linux Comm ...

  4. 彻底搞懂 etcd 系列文章(三):etcd 集群运维部署

    0 专辑概述 etcd 是云原生架构中重要的基础组件,由 CNCF 孵化托管.etcd 在微服务和 Kubernates 集群中不仅可以作为服务注册与发现,还可以作为 key-value 存储的中间件 ...

  5. 简谈Java语言的继承

    Java语言的继承 这里简谈Java语言的三大特性之二——继承. Java语言的三大特性是循序渐进的.是有顺序性的,应该按照封装-->继承-->多态这样的顺序依次学习 继承的定义 百度百科 ...

  6. iOS-字典转双模型的实现过程中需要关注的细节

    如果有以上结构的plist文件,那么应该怎么将其中的字典转换成模型? 显然一个模型已经无法搞定了,此时需要用到双数据模型(字典转模型). 我写了两种方式来实现模型的转换: 方法一 第一个模型:CarM ...

  7. Spring杂谈 | 从桥接方法到JVM方法调用

    前言 之所以写这么一篇文章是因为在Spring中,经常会出现下面这种代码 // 判断是否是桥接方法,如果是的话就返回这个方法 BridgeMethodResolver.findBridgedMetho ...

  8. Accord.NET重启4.0 开发

    Accord.NET Framework是在AForge.NET基础上封装和进一步开发来的.功能也很强大,因为AForge.NET更注重与一些底层和广度,而Accord.NET Framework更注 ...

  9. 写了个全局变量的bug,被同事们打脸!!!

    话说栈长前阵子写了一个功能,测试 0 bug 就上线了,上线后也运行好好的,好多天都没有人反馈bug,超爽.. 不出问题还好,出问题就是大问题.. 最近有个客户反馈某些数据混乱问题,看代码死活看不出什 ...

  10. Nice Jquery Validator 方法

    .validator() .validator( options ) 描述:根据参数初始化验证,验证 jQuery 选中的表单 参数:{Object} options - 可选,参考配置选项 示例: ...