2022年8月17/对象函数/this

71 阅读2分钟

对象中的函数

1.()=>{}
2.函数名(){}
3.函数名 function(){}

3种方法的区别:window是浏览器顶级对象(可以理解为是神一样),没有对象使用这个对象时,是window在调用

  function创建的函数,this指向当前调用的对象
  lambda创建的函数(箭头函数),this指向上一级的作用域对象
  面向对象:使用一个函数时,必须分清是哪个对象

  

function案例:1

//对象中的函数
//方法1:function的方法
//步骤:1.声明对象;2.给键赋值;3.声明函数;4.在函数中打印数据,this哪个对象调用了函数,就指向哪个对象;5.复制前面4个步骤;6.调用:对象名下的函数名()
var five={
    play:'hu the',
    play2:'The document',
    Wow(){
        console.log('文档',this);
    }
}
var five2={
    There :'The picture',
    There2 :'Connected to the Internet',
    net(){
        console.log('文档',this);
    }

}
five.Wow()
five2.net()

function案例:2特点就是省代码

//前面的方法中,声明函数时有点麻烦,要是我想要n个数据时,是不是再创建一个函数啊?太麻烦了,下面这种方法就大大减少了代码复用
// 方法2
//步骤:1.声明函数;2.在函数中打印数据,并获取当前对象;3.声明变量;4.给键赋值;5.键名赋上步骤1的函数名;6.复制前面的5个步骤;7.调用:对象名下的键名+()
function outside(){
    console.log('中秋诗句',this);
}
var wan={
    wen:'更深月色半人家,北斗阑干南斗斜。',
    wen2:'绝景良时难再并,他年此日应惆怅。',
    wu:outside
}
var wan2={
    After:'昨风一吹无人会,今夜清光似往年。',
    After2:'庆中秋双喜连,喜迎节庆家团圆。',
    position:outside
}
wan.wu()
wan2.position()


lambda案例1

var forehead={
    play:'hu the',
    play2:'The document',
     uh:()=>{
        console.log('文档',this);
    }
}
var forehead2={
    ren :'The picture',
    ren2 :'Connected to the Internet',
    uh2:()=>{
        console.log('文档',this);
    }

}
forehead.uh()
forehead2.uh2()

lambda案例2,特点是省代码

function outside(){
    console.log('中秋诗句',this);
}
var wan={
    wen:'更深月色半人家,北斗阑干南斗斜。',
    wen2:'绝景良时难再并,他年此日应惆怅。',
    wu:outside
}
var wan2={
    After:'昨风一吹无人会,今夜清光似往年。',
    After2:'庆中秋双喜连,喜迎节庆家团圆。',
    position:outside
}
wan.wu()
wan2.position()

this:获取当前对象

function中,哪个对象调用了函数,就指向哪个对象
在lambda表达式中,this指向不会被修改。(不会被修改的话就指向window

image.png