[油猴脚本开发指南]简易感受this的例子
# 前言由于之前的比较理论化，所以比较担心大家不怎么懂，这里给大家一个小栗子直观感受一下this的意义
# 概念讲解
假如我们不使用this会出现什么情况呢？
现在假如我们不使用对象以及this，创建了一个小猫的名字，和吃的函数，这个时候是符合我们的想法的
```
var xiaomaoname='xiaomao'
function eat(name){
console.log(name+'在吃饭')
}
eat(xiaomaoname)
```
我们现在如果再引入一个名字呢？
```
var xiaomaoname='xiaomao'
var xiaomaoage=17
function eat(name,age){
console.log(age+'的'+name+'在吃饭')
}
eat(xiaomaoname,xiaomaoage)
```
就需要再声明一个变量并且传入，如果有很多很多变量这样就太麻烦了，所以我们引入了对象这个概念！
```
var xiaomao={
name:'xiaomao',
age:17,
}
function eat(name,age){
console.log(age+'的'+name+'在吃饭')
}
eat(xiaomao.name,xiaomao.age)
```
如果我们这时候再引入一个小狗吃饭呢？
```
var xiaomao={
name:'xiaomao',
age:17,
}
var xiaogou={
name:'xiaogou',
age:16,
}
function eat(name,age){
console.log(age+'的'+name+'在吃饭')
}
eat(xiaomao.name,xiaomao.age)
eat(xiaogou.name,xiaogou.age)
```
这时候还是一切安好的，但是问题来了，如果小猫是正经的吃饭，但是小狗不正经吃饭，他一边吃一边拆家，那这个函数就不满足我们的需求了，需要再声明一个函数。
```
var xiaomao={
name:'xiaomao',
age:17,
}
var xiaogou={
name:'xiaogou',
age:16,
}
function eat(name,age){
console.log(age+'的'+name+'在吃饭')
}
function dogeat(name,age){
console.log(age+'的'+name+'一边拆家一边吃饭')
}
eat(xiaomao.name,xiaomao.age)
dogeat(xiaogou.name,xiaogou.age)
```
这样是不是很别扭，既然每个动物都有一种自己的吃饭方式，那为什么不把函数也整合到变量之中？
```
var xiaomao={
name:'xiaomao',
age:17,
eat:function (name,age){
console.log(age+'的'+name+'在吃饭')
}
}
var xiaogou={
name:'xiaogou',
age:16,
eat:function (name,age){
console.log(age+'的'+name+'一边拆家一边吃饭')
}
}
xiaomao.eat(xiaomao.name,xiaomao.age)
xiaogou.eat(xiaogou.name,xiaogou.age)
```
既然我们都把函数整合到对象的内部了，那为什么还需要传参，一般情况下获取对象下的变量就是符合直觉的了！
```
name='全局变量'
age=8888
var xiaomao={
name:'xiaomao',
age:17,
eat:function (){
console.log(age+'的'+name+'在吃饭')
}
}
xiaomao.eat()
```
现在虽然调用了xiaomao.eat()，但是获取的name和age并不是xiaomao的对象里的name和age，而是全局变量的name和age，那怎么才能获取到对象的name和age呢，这时候就引入了this
```
var xiaomao={
name:'xiaomao',
age:17,
eat:function (){
console.log(this.age+'的'+this.name+'在吃饭')
}
}
xiaomao.eat()
```
我们把函数放入了内部，并且成功的让eat获取了name和age
那如果小狗也想学习小猫吃饭，我们是不是需要把小猫的eat也复制一遍给小狗？并不需要的，其实用call就可以实现
```
var xiaomao={
name:'xiaomao',
age:17,
eat:function (){
console.log(this.age+'的'+this.name+'在吃饭')
}
}
var xiaogou={
name:'xiaogou',
age:18,
eat:function (){xiaomao.eat.call(this)}
}
xiaogou.eat()
```
到这里大概就完成了this，call和对象的大概概念的理解，大家可以消化一下
道总牛逼 来背八股文了 可以简单理解为谁调用this就指向谁 rubinTime 发表于 2021-11-28 19:30
可以简单理解为谁调用this就指向谁
是这个意思的，但是担心大家不懂，哈哈哈
页:
[1]