小知识,大挑战!本文正在参与“程序员必备小知识”创作活动。
函数也是对象
面向对象里面认为:万物皆对象。所以很好理解,函数其实也是对象
// 1.所有的函数都能调用方法
fn.call()
// 2.函数能点属性
fn.prototype
fn.__proto__
// 3. 所有的函数都是 Function 构造的实例对象
var fn = new Function()
Function构造函数
在js里面,所有的函数都是Function构造函数的实例对象
function fn(){}
console.log(fn instanceof Function)
console.dir(fn)
Function原型
函数借用
- 函数封装的目的是复用代码。但是如果方法写在了不同的对象上,这些对象之间又不是继承关系,如果对象具有同样的特征和功能,我们就需要多写一次代码
函数中的this
- 需要了解函数借用,我们使用的是
call/apply/bind三个方法,这个三个方法都在Function的原型上,所以所有的函数都能调用。 - 但是这三个方法都有一个作用,就是修改函数的this指向,但是如果要修改,我们就要先知道这些this原本指向谁,才知道是否需要修改。
- 函数在不同使用场景的this指向如下
// 函数作为一个普通函数 , 里面的this指向window对象
function() fn(){}
// 函数作为事件处理程序 里面this通常指向事件源,但是也有指向window的
btn.onclick = function(){}
btn.addEventListener('click',function(){})
bnt.attachEvent('onclick',function(){})
// 函数作为构造函数 , 里面this指向实例对象
function Person(name,age){}
// 函数作为回调函数 , 里面this通常指向window
setTimeout(function(){},2000);
// 作为对象的方法 , 里面的this指向实例对象
var obj = {sayHi:function(){}}
Person.prototype.sayHi = function(){}
// 箭头函数,里面的this指向上级作用域
()=>{}
call/apply/bind
call的作用
-
1.立刻调用函数
-
2.修改函数this指向
函数.call(新this,参数1,参数2,...)
- 使用场景:
- 借用构造函数
- 伪数组转换成数组
- 判断原生对象类型
apply的作用
- 立刻调用函数
- 修改函数this指向
函数.call(新this,[参数1,参数2,...])
- 使用场景:
- 借用构造函数
- 伪数组借用数组方法 bind的作用
- 修改函数this指向
- 返回一个新的函数
var fn = 函数.bind(新this,参数1,参数2,...)
fn();
使用场景:
- 修改回调函数的this