javascript中function详解

概念

function理解：

1. 函数是被设计为执行特定任务的代码块。
2. 函数会在某代码调用它时被执行。

注意点：

1. 没有重载，与其他面向对象来说
2. 定义函数的时候，可以不明确传入的参数，函数内部可以使用arguments访问；
3. 参数只能按值传递(即使传入的是引用类型)
4. 可以设置默认参数(es6)

定义

1.function关键词定义

function fn(a,b) {
    return a + b;
}

2.通过Function构造函数来创建一个函数

var fn = new Function("a","b","return a + b;");

3.通过一个表达式定义，通过创建匿名函数，然后把匿名函数赋值给一个变量。

//第一种
var fn = function(a,b){
	return a + b;
};

//第二种
var fn = (a,b) => {
	return a + b;
};

注：这里只是简单的介绍一下函数。

函数内部

this

• this是JavaScript中的一个关键字，当一个函数被调用时，除了传入函数的显式参数以外，名为this的隐式参数也被传入了函数。
• this参数指向了一个自动生成的内部对象，这个内部对象被称为函数上下文。
• JavaScript中的this依赖于函数的调用方式。
• this的指向是在函数执行时确定的，即：调用函数的那个对象。

1.函数直接调用时(全局的时候)

//this 指向 window

var name = "xiaofeifei"
var fn = function(){
	console.log(this.name)
};
fn();

2.函数被一个对象调用

// this 指向这个对象

var obj = {
	name: "xiaofeifei"，
	say: function (){
		console.log(this.name);
	}
}
obj.say(); //xiaofeifei

3.被一个构造函数的实例对象调用时

// this指向这个构造函数的实例

 function Person(name){
 	this.name = name
 	console.log(this.name);
 }
 
 var p = new Person('xiaofeifei')；// xiaofeifei
 

注：此处只是简单介绍，想要详细了解请百度

arguments

arguments是一个类数组对象。包含着传入函数中的所有参数。但这个对象还有一个名叫callee的属性，该属性是一个指针，指向拥有这个arguments对象的函数。

案例一阶乘函数

function fn(num){
  if(num <= 1){
    return 1;
  }else{
    return num * arguments.callee(num-1);
  }
}

案例二求和

function getSum() {
    var sum = 0, i, len;
    len = arguments.length;
    for (i = 0; i < len; i++) {
        sum += arguments[i];
    }
    return sum;
}
var sum = getSum, 2, 3, 4, 5,6);

绑定函数作用域

Function.prototype.bind

bind()方法创建一个新的函数，在bind()被调用时，这个新函数的this被指定为bind()的第一个参数，而其余参数将作为新函数的参数，供调用时使用。

var obj = {
	name: "xiaofeifei"
}
var fn = function(){
	console.log(this.name)
};
var newfn = fn.bind(obj); 
newfn();//xiaofeifei

1.语法

function.bind(thisArg[, arg1[, arg2[, …]]])

2.参数

• thisArg,绑定调用函数时作为this参数传递给目标函数的值。使用如果new运算符构造绑定函数，则忽略该值。使用当bind在setTimeout中创建³³一个函数（作为回调提供）时，作为thisArg传递的任何原始值都将转换为object。如果bind函数的参数列表为空，或者thisArg是null或undefined，执行作用域的this将被视为新函数的thisArg。
• arg1, arg2, …
  当目标函数被调用时，被预先加入绑定函数的参数列表中的参数。

3.返回值

• 返回一个原函数的副本，并拥有指定的this值和初始参数。

Function.prototype.applay

apply() 方法调用一个具有给定this值的函数，以及以一个数组（或类数组对象）的形式提供的参数。

var obj = {
	name: "xiaofeifei"
}
var fn = function(){
	var args = Array.prototype.slice.call(arguments);
	console.log(this.name)
	console.log(args.join(" "));
};
fn.apply(obj,["xiaofeifei","真的","很开心"]); 
// xiaofeifei
//xiaofeifei 真的 很开心

1.语法

func.apply(thisArg, [argsArray])

2.参数

• thisArg,必选的。在 func 函数运行时使用的 this 值。请注意，this可能不是该方法看到的实际值：如果这个函数处于非严格模式下，则指定为 null 或 undefined 时会自动替换为指向全局对象，原始值会被包装。

• [argsArray] 可选的。一个数组或者类数组对象，其中的数组元素将作为单独的参数传给 func 函数。如果该参数的值为 null 或 undefined，则表示不需要传入任何参数。从ECMAScript 5 开始可以使用类数组对象。 浏览器兼容性 请参阅本文底部内容。

3.返回值

• 调用有指定this值和参数的函数的结果。

Function.prototype.call

call() 方法使用一个指定的this值和单独指定的一个或多个参数来调用一个函数。

注意：该方法的语法和作用与apply() 方法类似，只有一个区别，就是call()方法接受的是一个参数列表，而apply()方法接受的是一个包含多个参数的数组。

var obj = {
	name: "xiaofeifei"
}
var fn = function(){
	var args = Array.prototype.slice.call(arguments);
	console.log(this.name)
	console.log(args.join(" "));
};
fn.call(obj,"xiaofeifei","真的","很开心"); 
// xiaofeifei
//xiaofeifei 真的 很开心

name属性

//第一种情况
funtion fn(){}
fn.name  // fn

//第二种情况
var fn = function (){}
fn.name  // fn