数(Function)是被设计为执行特定任务的代码块。它在可以实现定制运算功能的同时，还带有一个入口和一个出口。所谓的入口，就是函数所带的各个参数，我们可以通过这个入口，把函数的参数值代入子程序，供计算机处理；所谓出口，就是指函数的函数值，在计算求得结果之后，由此口带回给调用它的程序。

在程序设计中，常将一些常用的功能模块编写成函数，放在函数库中供用户选用。善于利用函数，可以减少重复编写程序段的工作量。

本文介绍Javascript函数的几种常用定义方式。掌握JS函数基本技术后，在统计数据处理过程中，我们将函数理解为某一统计对象（项目）所定制的方法。

导读：

• 普通函数
• 函数arguments对象
• 匿名函数
• 闭包和递归函数
• Promise回调函数

1、普通函数

I、基本语法

function 函数名称(参数1, 参数2, 参数3) {
		//要执行的代码
return 返回值
}

JavaScript函数语法解析如下：

• JavaScript函数通过function关键词进行定义，其后是函数名称和括号()
• 函数名可包含字母、数字、下划线和美元符号
• 圆括号可包括由逗号分隔的参数
• 由函数执行的代码被放置在花括号{}中
• 函数返回值由return关键字指定

II、无参数函数

console.clear();
function test1() {
return "Hello World!";
}
//执行函数返回"Hello World!"，并赋值给变量str
var str=test1();
console.log(str);

注：Console对象用于JavaScript调试，为了显示Console.log输出结果，通过按Control+Shift+i（PC平台）来打开Console窗口

III、有参数函数

//计算任意两个数的和
function oSum(x, y) {
return x+y;
}
var mySum=oSum(15, 85);
console.log(mySum); //100

IV、参数默认值设置

//求和函数中给两个参数设置默认值
console.clear();
function oSum(x=50, y=50) {
return x+y;
}
var mySum=oSum(15, 55);
console.log(mySum); //70
mySum=oSum(15);
console.log(mySum); //65
mySum=oSum();
console.log(mySum); //100

V、参数为函数

console.clear();
function oSum(x, y) {return x+y;}
var mySum=oSum(oSum(45, 75), 100);
console.log(mySum); //220

VI、对象{}为参数 - 解构赋值默认值

console.clear();
function oSum({x=10, y=20}) {
return x+y;
}
console.log(oSum({})); //30，这里直接调用oSum()出错
console.log(oSum({x:100})); //120
console.log(oSum({y:100})); //110
console.log(oSum({x:100,y:200})); //300
console.log(oSum({y:50,x:20})); //70

VII、对象{}为参数 - 双重默认值

//代码容错更好
console.clear();
function oSum({x=10, y=20}={}) {
return x+y;
}
console.log(oSum()); //30
console.log(oSum({})); //30
console.log(oSum({x:100})); //120
console.log(oSum({y:100})); //110
console.log(oSum({x:100,y:200})); //300
console.log(oSum({y:50,x:20})); //70

2、函数arguments对象

在JavaScript中，参数在函数内部是以一个数组表示的，arguments是函数内部的一个专门用来存储实参的数组对象。函数arguments的对象在函数运行时用于检测和重新设置参数。

I、arguments.length - 函数参数数量

console.clear();
function fn(a,b,c){
console.log(arguments.length); //3
return a+b+c;
}
console.log(fn(1,2,3)); //6

II、arguments[] - 函数输出和设置

console.clear();
function fn(a,b,c){
console.log(arguments[0]); //1
console.log(arguments[1]); //2
console.log(arguments[2]); //3
arguments[0]=5; //重新设置参数a=5
return a+b+c;
}
console.log(fn(1,2,3)); //10

III、arguments转数组

arguments对象不是一个真正的数组 ，它类似于数组，但除了length属性和索引元素之外没有任何数组属性。例如，它没有pop方法。但是它可以被转换为一个真正的数组，转换为真实的数组后就可以使用完整的数组方法

console.clear();
function fn(a, b, c) {
var arr=Array.from(arguments); //进行转数组操作
console.log(arr); //输出数组
return a + b + c;
}
console.log(fn(1, 2, 3)); //6

3、匿名函数

匿名函数顾名思义指的是没有名称的函数，在实际开发中使用的频率非常高，是学好JS编程的重点。

I、变量匿名函数

console.clear();
var fn=function fn(a,b,c=9) {
return a+b+c;
}
console.log(fn(1,2)); //12
console.log(fn(1,2,3)); //6

II、无名称匿名函数

即在函数声明时，在后面紧跟参数。JS语法解析此函数时，里面代码立即执行。

console.clear();
console.log(function(a,b){return a+b;}(2,3));
console.clear();
//加括号执行无匿名函数（输出"Hello Word!"）
(function (){
		console.log("Hello Word!");
})()
//加括号执行有匿名函数（输出"Hello Word! lei."）
(function (str){
		console.log("Hello Word!" +" "+ str +".");
})("lei")

注：函数代码function(a,b){return a+b;}没指定函数名称，如果需要执行匿名函数，在匿名函数后面加上一个括号即可立即执行

III、事件绑定匿名函数

通常我们浏览网页时会通过鼠标或键盘输入信息，例如鼠标点击某个按钮称“click点击事件”、文本框内文字信息改变了称“change事件”。总之，用户所有的鼠标、键盘操作都称为事件，都可以通过JS代码来捕获这些事件。

console.clear();
//通过id或取图标对象
var logo=document.querySelector("#myLogo");
//给左上角“银河统计”图标增加点击事件
logo.onclick=function(){
		console.log("欢迎来到银河统计工作室！");
}
logo.onmousemove=function(){
    logo.style.cursor="pointer";
    console.log("鼠标在图像上面！");
}
logo.onmouseout=function(){
    logo.style.cursor="default";
    console.log("鼠标已经离开图像！");
}

注：代码中网页图像标记为<img id="myLogo" src="###"/>

IV、对象绑定匿名函数做为对象的方法

前面我们介绍JS对象时提到，事件是有属性和方法组成的数据结构，事件的方法可以通过绑定匿名函数的方式建立。

console.clear();
    var obj={
    name:"Carolyn",
    age:11,
    fn:function(str){
    		return "My name is "+this.name+" Siyu"+". I'm "+this.age+" years old now.";
    }
};
console.log(obj.fn("Siyu")); //My name is Carolyn Siyu. I'm 11 years old now.

注：这里定匿名函数为属性的返回值

V、匿名函数做为回调函数(callback)

什么是同步，什么是异步?

同步指的是一次只能完成一件任务。如果有多个任务，就必须排队，前面一个任务完成，再执行后面一个任务，以此类推。

异步指的是每一个任务有一个或多个回调函数（callback），前一个任务结束后，不是执行后一个任务，而是执行回调函数，后一个任务则是不等前一个任务结束就执行，所以程序的执行顺序与任务的排列顺序是不一致的、异步的。

JS是单线程的，它本身不可能是异步的，通过回调函数可以实现异步。JS中最基础的异步是setTimeout和setInterval函数。

console.clear();
var interval=setInterval(function(){
		console.log("回调函数，每间隔1秒钟会被执行一次");
},1000);
//点击银河统计图表停止setInterval计算器运行
var logo=document.querySelector("#myLogo");
logo.onclick=function(){
    console.log("Stop!");
    clearInterval(interval)
}
setTimeout(function() {
		console.log("张三")
}, 1000 );
setTimeout(function() {
		console.log("李四")
}, 2000 );
setTimeout(function() {
		console.log("王五")
}, 3000 );
//jS最基础的异步实现
function a() {
    console.log("执行a函数");
    setTimeout(function() {
    		console.log("执行a函数的延迟函数");
    },2000);
}
function b() {
		console.log("执行b函数");
}
a();
b();

VI、匿名函数做为返回值

console.clear();
function fn(){
    return function(){
    		return "Carolin";
    }
}
//调用匿名函数
console.log(fn()()); //Carolin
//或者
var box=fn();
console.log(box()); //Carolin

4、闭包和递归函数

假设，函数A内部声明了个函数B，函数B引用了函数B之外的变量，并且函数A的返回值为函数B的引用，那么函数B就是闭包函数。

递归就是函数自己调用自己，当函数自己时，其自身为闭包函数，参数为域外变量。

console.clear();
function funA(arg1,arg2) {
    var i=0; //funA作用域的变量
    function funB(step) {
        i=i + step; //访问funB作用域外变量i
        console.log(i)
    }
    return funB;
}
var allShowA=funA(2, 3); //调用的是funA arg1=2，arg2=3
allShowA(1);//调用的是funB step=1,输出 1
allShowA(3);//调用的是funB setp=3,输出 4
//累加
console.clear();
function f(num){
    if(num<1) {
   		 return 0;
    } else {
    		return f(num-1)+num;
    }
}
console.log(f(9)); //45
//阶乘
console.clear();
function f(num){
    if(num<1) {
    return 1;
    } else {
    return f(num-1)*num;
    }
}
console.log(f(4)); //24
//在对象中定义递归方法
var obj={
    num : 5,
    fac : function (x) {
        if (x===1) {
        		return 1;
        } else {
        		return x * obj.fac(x - 1);
        }
    }
};
console.log(obj.fac(5)) /120
//使用arguments.callee
function fact(num){
    if (num<=1){
    		return 1;
    }else{
   		 return num*arguments.callee(num-1);
    }
}
console.log(fact(4)); //24

5、Promise回调函数

Promise是ES6语言标准中提供的对象。Promise是异步编程的一种解决方案，比传统的解决方案（回调函数和事件）更合理和更强大。

console.clear();
//基本用法，
var p=new Promise(function(resolve, reject){
    setTimeout(function(){
    		resolve(console.log("done"));
    }, 1000);
});
//做为对象返回
function timeout(ms) {
    return new Promise((resolve, reject)=> {
    		setTimeout(resolve, ms, 'done');
    });
}
timeout(1000).then((value)=> { //参数value='done'
		console.log(value);
});
//完整使用方法
function promiseTest(){
let p=new Promise(function(resolve, reject){
    setTimeout(function(){
        var num=Math.random()*100; //生成1-100的随机数
        console.log('随机数生成的值：',num)
        if(num>=60){
            resolve(num);
        } else {
            reject('数字太于60了即将执行失败回调');
        }
        }, 2000);
    })
    return p
}
promiseTest().then(
    function(data){ //data=num
        console.log('resolved成功回调');
        console.log('成功回调接受的值：',data);
    }
)
.catch(function(reason, data){
    console.log('catch到rejected失败回调');
    console.log('catch失败执行回调抛出失败原因：',reason);
});

注：Promise回调函数在网页数据抓取时常常遇到

JavaScript是一种面向对象的编程语言，因此对象在JavaScript中扮演了很重要的角色。

Javascript函数是能完成某个常用功能的一小段代码，而Javascript方法（method）是通过对象调用的Javascript函数。

JS中所有事物都是对象，对象是拥有属性和方法的数据。但是，JS对象又是由函数创建的，JS函数本身也是对象。“方法是函数、对象是函数”，JS中函数的用途和含义有点绕口，需要大量练习和运用才能掌握。

数的定义方式

1. 函数声明方式 function 关键字 (命名函数)

2. 函数表达式 (匿名函数)

3. new Function()

Function 里面参数都必须是字符串格式

第三种方式执行效率低，也不方便书写，因此较少使用

所有函数都是 Function 的实例(对象)

函数也属于对象

函数的调用方式

1. 普通函数

function fn() {

console.log('人生的巅峰');

}

fn(); fn.call()

2. 对象的方法

var o={

sayHi: function() {

console.log('人生的巅峰');

}

}

o.sayHi();

3. 构造函数

function Star() {};

new Star();(构造函数和普通函数肯定不一样了，他们的主要区别是构造函数首字母大写，还有就是new关键字调用)

4. 绑定事件函数

btn.onclick=function() {}; // 点击了按钮就可以调用这个函数

5. 定时器函数

setInterval(function() {}, 1000); 这个函数是定时器自动1秒钟调用一次

6. 立即执行函数

(function() {

console.log('人生的巅峰');

})();

立即执行函数是自动调用