目录
概念
function理解:
- 函数是被设计为执行特定任务的代码块。
- 函数会在某代码调用它时被执行。
注意点:
- 没有重载,与其他面向对象来说
- 定义函数的时候,可以不明确传入的参数,函数内部可以使用arguments访问;
- 参数只能按值传递(即使传入的是引用类型)
- 可以设置默认参数(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