前言:
学习一门编程语言的基本步骤
(01)了解背景知识
(02)搭建开发环境
(03)语法规范
(04)常量和变量
(05)数据类型
(06)数据类型转换
(07)运算符
(08)逻辑结构
(09)函数
9.函数——function
   1.函数
     函数分为系统函数和自定义函数
     JS提供的函数—isNaN/parseInt/parseFloat/Number/prompt...
     function:功能体,函数(方法),可以接收若干个数据,返回处理结果。用于封装反复执行的代码。
     1)创建一个普通函数
         function 函数名称(){  //名字可以自定义
         函数体  //要封装的代码
         }
         //调用
         函数名称();

    //function普通函数
function say(){
console.log("hello");
console.log("javaScript");
console.log("hello is me");
}
say ();//调用函数打印上述文字 //练习:封装计算1-100之间1-100的和
function R(){
for (var i=1,sum=0;i<=100 ;i++ ){
sum+=i;//for循环运算
}
console.log(sum);//最后是打印sum
}
R();//所以调用r之后打印sum,结果为5050

2)创建带有参数的函数 ——function-param
         function 函数名称(参数列表){ //参数列表用于接受传递的数据
         函数体;
         }
         //调用
         函数名称(参数列表)//实际传递的数据
         参数:创建函数时的参数成为形参,调用时参数成为实参,实参会赋值给形参,多个参数之间用逗号隔开。参数可以有0个或者多个,如果参数未被赋值,值为undefined。

    //function有参数函数
//计算任意两个数字相加的和
function add(var1,var2){//参数:形参——参数形式
console.log(var1+var2);
}
//调用
add(2,3);//参数:实参——实际接收的参数 //练习:创建函数,封装计算1-任意数字之间所有整数的和,调用多次
function getsum(b){
for (i=1,sum=0; i<=b;i++ ){
sum+=i;
}
console.log(sum);
}
getsum(100);
getsum(1004);
getsum(10042); //练习:创建函数,封装计算任意两个年份之间闰年的个数,调用多次
function runnian(year,year2){
for (i=year,count=0;i<=year2 ;i++ ){
if (i%4===0 && i%100!==0 || i%400===0 ){
count++;
console.log(i,count);
}
}
}
runnian(1980,2000);
runnian(1880,2100);

3)创建带有 返回值得函数——function-return
         function 函数名称(参数列表){
         函数体;
         return 值;//返回值,函数执行完返回的结果
         }
         //调用
         函数名称(参数列表)
         注意事项: 如果函数中没有return,或是return 中没有加任何值,返回undefined;执行完return后的代码不会再执行。
                         return 函数:供外部使用的数据,return后面的数据不会被执行。

    //function带有返回值的函数
function add(n1,n2){
//返回n1+n2的结果,用于后期保存,可以理解为如果n1,n2如果有参数传进来之后就执行n1+n2,然后保存结果,以便于后续使用
return n1+n2;
}
//把函数的结果保存下来
var a=add(100,140);
console.log("总成绩为:"+a); //练习:创建函数,传递任意年份,返回是否为闰年,如果是返回true,不是返回false;打印该年天数
function year(a){
if (a%4===0 && a%100!==0 || a%400===0){
return true;
}//else { 可以省略
return false;
}
function getdays(a){
if(year(a)){//此处解释为如果year(a)为真就执行以下
return a+"闰年,366天";
}//此处省略else 否则
return a+"不是闰年,365天";
}
console.log(getdays(2019));//2019不是闰年,365天 //练习:计算1-任何数字之间所有整数阶乘的和
//1!+2!+3!+4!+5!
//步骤一:计算任意数字的阶乘n-1之间所有整数的乘积
function R(a){
for (var b=1,num=1;b<=a ; b++){
num*=b;
}
return num;
}
//R(4);
//步骤2:计算1-n之间所有整数的和
function getSum(a){
for(var i=1,sum=0;i<=a;i++){
sum+=R(i);
}
return sum;
}
console.log(getSum(5));//

总结:对比break和return的用法
                  break用于结束switch语句,还可以用于提前结束循环。
                  return用于在函数中的返回值,也可以结束函数后续代码执行。

2.作用域——scope
      变量或者函数的可访问范围,分两种
      全局作用域:在全局使用var声明的变量,可以在任意范围访问到,
      函数作用域:在函数中使用var声明的变量,只能在函数内部访问到。

    //作用域——scope
//全局作用域下的变量
var a=1;//全局变量,在此处除function fn(){}函数以外就是全局。
//函数作用域下使用var声明的变量
function fn(){
var b=2;//局部变量
console.log(a);//全局函数a可以在任意范围访问
console.log(b);//2,局部变量可以在函数作用域内访问
}
console.log(a);//
fn();//1 调用函数,执行函数体代码。
console.log(b);//报错,b is not defined

注意事项:函数中不使用var声明的变量,默认是全局变量,可以在函数的外部访问,不推荐这样写。

    //注意事项
function fn2(){
c=3;//函数中不使用var声明的变量默认是全局变量,不建议这么写,造成全局污染
}
console.log(c);//即使c是包裹在函数内部,但是没有声明的变量默认是全局变量,所以在函数外部是可以访问的
fn2();//而调用fn2()的时候内部是什么都没有写的,相当于没有任何函数体代码

1)变量提升
          JS程序执行前,会将使用var关键字声明的变量提升到所在作用域的最前边,但是赋值还是在原来的位置。

    //变量提升——全局作用域
var a=1;//声明变量并赋值
console.log(a);
/***************** 实际在程序中应为 ****************/
//变量提升——全局作用域
var a;//声明提前
a=1;//var a=1中,声明提前,但是赋值留在原地
console.log(a); //变量提升——函数作用域
function fn(){
console.log(b);
var b=2;
}
fn();
/***************** 实际在程序中应为 ****************/
//变量提升——函数作用域
function fn(){
var b;//变量提升到所在函数作用域前面
console.log(b);//此时只声明,没有赋值,所以打印结果是undefined
b=2;//赋值留在原地,
}
fn();//所以调用后结果是undefined

2)函数的作用域
          函数的可访问范围,在全局作用域下创建的函数可以在任意位置访问;在函数作用域下创建的函数只能在函数内部访问。

    //函数作用域
var n=5,m=7;
function fn2(){
//var n;提升到所在作用域最前面,相当于此处有一个声明变量,但是未赋值,只能在内部访问这个n
console.log(n);//此时打印的n值为undefined,因为在函数作用域中var声明提前到作用域最前面,
var n=8;//此处的相当于正常为 n=8 给前面声明的变量赋值,
console.log(n);//此时打印的n值为8
console.log(m);//函数作用域内没有m,调用全局的m
}
console.log(n);//此处打印的n值是全局作用域下的n,值为5
fn2();//此处调用fn2

3)函数提升
          和变量提升一样,JS程序执行前,会把function关键字创建的函数提升到坐在作用域的最前边,在调用的时候才会执行函数提升的代码。

    //函数提升
fn();//先调用,
function fn(){
console.log(1);
}
/***************** 实际在程序中应为 ****************/
function fn(){//提升到当前作用域最前端,先创建
console.log(1);
}
fn();//调用
  3.匿名函数
     没有名称的函数 function(){ }
      1)创建函数
          function fn1(){ }——函数声明
    //创建函数——函数声明
function fn1(){ }
var a;
          var fn2=function(参数){ 函数体 }——函数表达式,变量名就是函数名称
    //创建函数——函数表达式
//变量名称就是函数名称
var fn2=function(a,b){
console.log(a+b);
}
fn2(1,3); //练习:使用函数表达式创建函数,计算任意两个数字之间所有整数的和
//只能先创建在调用,因为不存在提升,
var add=function(a,b){
for (i=1,sum=0;i<=b ;i++ ){
sum+=i;
}
return sum;
}
console.log(add(3,10));
          总结:对比函数声明与函数表达式的区别
                   函数声明,创建函数存在提升,可以在任意位置创建,后调用。
                   函数表达式,使用变量创建,只存在变量的提升,不存在函数提升,只能先创建,再调用。

2)匿名函数的自调用
          目的:创建函数作用域包裹起来,防止污染全局。
          (function(形参列表){
          //函数体中的变量不能被外部访问
          })(实参列表);

    //匿名函数
//避免全局污染,把变量放到函数作用域下
(function(){//匿名函数可以自己调用自己函数内的数据,匿名函数需要用()()
var num=2;
console.log(num);
})(); (function(a,b){//匿名函数可以自己调用自己函数内的数据,匿名函数需要用()()
var num=4;
console.log(a+b);
})(3,5);

3)回调函数——callback
           把匿名函数以实参的形式传递,意味着形参就是传递的匿名函数的名称
           function fn(a){
           //调用fn的时候,匿名函数赋值给参数a,a就是函数名称
           a() //执行传递的匿名函数体中的代码。
           }

    //回调函数
function fn(a){
//实参赋值给形参
//把匿名函数赋值给a,a就是函数名称
//a=function(){ }
a();
}
fn(function(){
console.log(1);
console.log(2);
}); //调用函数a,执行传递的函数体中的代码 //练习:创建函数,传递两个参数,实参使用匿名函数的形式传递,在匿名函数的函数体中添加若干行代码;在函数中执行匿名函数中的代码。
function fun(a,b){
a();
b();
};
fun(function(){
console.log(3);
},function(){
console.log(4);
});

4.全局函数——global
      parseInt()/parseFloat()/isNaN()/
      encodeURI() 对网址中的汉字进行编码
      decodeURI() 对已经编码网址进行解码
      isFinite()      判断一个值是否为有限值,是—>true 不是-false
      eval()          可以执行字符串中的表达式

    //全局函数
//对一个网址中的中文编码
var str='http://www.jd.com/search?kw=电脑';
var str2=encodeURI(str);
console.log(str2);//http://www.jd.com/search?kw=%E7%94%B5%E8%84%91
//对已经编码的网址进行解码
var str3=decodeURI(str2);
console.log(str3);//http://www.jd.com/search?kw=电脑 //isFinite判断一个值是否为有限值。是—>true 不是-false
//2/0-> Infinity(无穷) 0/2->0
console.log(0/2,2/0);//0 Infinity
console.log(isFinite(1/3));//true //eval可以执行字符串中的表达式
console.log("1+2");//1+2
console.log(eval("1+2"));//

05.JS函数的更多相关文章

  1. api日常总结:前端常用js函数和CSS常用技巧

    我的移动端media html{font-size:10px} @media screen and (min-width:321px) and (max-width:375px){html{font- ...

  2. JS函数大全 莫名其妙找到的

    1 .document.write(""); 输出语句 2 .JS中的注释为// 3 .传统的HTML文档顺序是:document->html->(head,body) ...

  3. 在动态THML语句中调用JS函数传递带空格参数的问题

    刚刚遇到一个问题,调用js函数的参数里带空格,造成调用失败的问题.   部分代码如下: html+="<div><a href=javascript:confirm(&qu ...

  4. 爬虫05 /js加密/js逆向、常用抓包工具、移动端数据爬取

    爬虫05 /js加密/js逆向.常用抓包工具.移动端数据爬取 目录 爬虫05 /js加密/js逆向.常用抓包工具.移动端数据爬取 1. js加密.js逆向:案例1 2. js加密.js逆向:案例2 3 ...

  5. 前端05 /js基础

    前端05 /js基础 昨日内容回顾 css选择器的优先级 行内(1000) > id(100) > 类(10) > 标签(1) > 继承(0) 颜色 rgb(255,255,2 ...

  6. 3.3 js函数

    1.函数语法: 函数声明的方式:function 函数名(参数1,参数2-){//函数体;}函数调用:函数名(参数1,参数2-); 函数内不一定都指定返回值. 如果需要指定返回值,可用 return ...

  7. Js函数function基础理解

    正文:我们知道,在js中,函数实际上是一个对象,每个函数都是Function类型的实例,并且都与其他引用类型一样具有属性和方法.因此,函数名实际上是指向函数对象的指针,不与某个函数绑定.在常见的两种定 ...

  8. js函数表达式和函数声明的区别

    我们已经知道,在任意代码片段外部添加包装函数,可以将内部的变量和函数定义"隐 藏"起来,外部作用域无法访问包装函数内部的任何内容. 例如: var a = 2; function ...

  9. 通用js函数集锦<来源于网络> 【二】

    通用js函数集锦<来源于网络> [二] 1.数组方法集2.cookie方法集3.url方法集4.正则表达式方法集5.字符串方法集6.加密方法集7.日期方法集8.浏览器检测方法集9.json ...

随机推荐

  1. 玩转Django2.0---Django笔记建站基础十一(一)(音乐网站开发)

    第十一章 音乐网站开发 本章以音乐网站项目为例,介绍Django在实际项目开发中的应用,该网站共分为6个功能模块分别是:网站首页.歌曲排行榜.歌曲播放.歌曲点评.歌曲搜索和用户管理. 11.1 网站需 ...

  2. 机器学习-K最近邻算法

    一.介绍 二.编程 练习一(K最近邻算法在单分类任务的应用): import numpy as np #导入科学计算包import matplotlib.pyplot as plt #导入画图工具fr ...

  3. Redhat下如何查看nvidia显卡的工作状况

    安装完毕nvidia显卡驱动后,可以使用命令来查看显卡的工作状况,命令如下: nvidia-smi 输入上述命令后,显示界面如下 安装nvidia显卡驱动的步骤,请参照驱动安装cuda和cudnn.

  4. 团队项目-Beta冲刺2

    博客介绍 这个作业属于哪个课程 https://edu.cnblogs.com/campus/xnsy/GeographicInformationScience 这个作业要求在哪里 https://w ...

  5. c#数字图像处理(二)彩色图像灰度化,灰度图像二值化

    为加快处理速度,在图像处理算法中,往往需要把彩色图像转换为灰度图像,在灰度图像上得到验证的算法,很容易移植到彩色图像上.24位彩色图像每个像素用3个字节表示,每个字节对应着R.G.B分量的亮度(红.绿 ...

  6. Python学习初级python3.6的安装配置

    首先我们来安装python 1.首先进入网站下载:点击打开链接(或自己输入网址https://www.python.org/downloads/),进入之后如下图,选择图中红色圈中区域进行下载. 2. ...

  7. apache和nginx那点事儿--阻塞和异步

    先明白的事儿:当一个程序在执行的时候,一般会创建一个进程,也可以有多个进程.一个进程至少会创建一个线程,多个线程共享一个程序进程的内存.程序的运行最终是靠线程来完成操作的.线程的数量跟CPU核数有关, ...

  8. ReactNative---ref的用法和技巧

    1.获取上下文的组件 2. ref属性不仅接受string类型的参数,而且它还可以接受一个function 作为callback.如:将组件view作为参数赋值给this._view <View ...

  9. Web自动化测试项目(三)用例的组织与运行

    一.Unittest用例组织 在test_case目录下创建test*.py,组织测试用例 ├── test_case │   ├── __init__.py │   └── test_login.p ...

  10. 关于使用详解ASP.NET State Service

    ASP.NET State Service服务如果启动可以解决这个问题,它会生成一个aspnet_state.exe进程,这个就是Session信息的进程.只要这个进程在,就算是重启了IIS,站点的S ...