【Javascript】this

最新推荐文章于 2022-11-23 15:23:06 发布

王昱潇

最新推荐文章于 2022-11-23 15:23:06 发布

阅读量90

点赞数

分类专栏：前端学习笔记文章标签： javascript

本文链接：https://blog.csdn.net/qs52955339/article/details/115759345

版权

前端同时被 2 个专栏收录

40 篇文章 1 订阅

订阅专栏

学习笔记

36 篇文章 0 订阅

订阅专栏

1、在函数中直接调用

this 指向window

    function get() {
        console.log('hello world')
    }
    get()
    //get.call(windows)

2、函数作为对象的方法被调用

    var person = {
        name: 'lee',
        run: function () {
            console.log(`${this.name} is run`)
        }
    }
    person.run()
    // person.run.call(person)

注：this就是谁调用我我指向谁

例题：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>reduce</title>
</head>
<body>
<script>
    var name = 222
    var a = {
        name: 111,
        say: function () {
            console.log(this.name)
        }
    }

    var fun = a.say
    fun()  //fun.call(window)    222
    a.say()   //a.say.call(a)    111

    var b = {
        name: 333,
        say: function (fun) {
            fun()  //fun.call(window)
        }
    }

    b.say(a.say)  //fun.call(window) 222
    b.say = a.say
    b.say() // b.say.call(b)  333
</script>
</body>
</html>

2021年4月27日 19:50:27 来更一下，

上面是我浅薄了，重新学习一下，this的四种绑定规则

默认绑定；指向window；独立调用也指向window;
隐式绑定；是对象调用，指向对象，谁调用就指向谁。 => 存在隐式丢失（函数赋给变量时或方法里的形参实参在拷贝时，会造成隐式丢失）
显示绑定：call，apply，bind => obj.call(obj)
new绑定 => new foo();

这四种规则，存在优先级，默认绑定规则的优先级是最低的，下面讨论一下其他三种的优先级。

示例1：通过这个例子，我们可以看出显式绑定的优先级是高于隐式绑定的。

function foo() {
        console.log(this.a)
    }

    var obj1 = {
        a:2,
        foo: foo
    }

    var obj2 = {
        a: 3,
        foo: foo
    }
    //隐式绑定
    obj1.foo()    //2
    obj2.foo()    //3

    //显式绑定
    obj1.foo.call(obj2)   //3
    obj2.foo.call(obj1)   //2

示例2：new绑定的优先级高于显式绑定

function foo(b) {
    this.a = b
}

var obj1 = {};  //obj1这个对象用来更改this指向
var bar = foo.bind(obj1)
bar(2)

console.log(obj1.a)   //2

var baz = new bar(3)
//这里this指向绑定到baz，但obj1.a的this并没有被清除，所以下面还是会打印2
console.log(obj1.a)   //2
console.log(baz.a)    //3
//new把this绑定到baz后给它新增了一个属性a，所以它打印出来是3

王昱潇

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
【Javascript】this

1、在函数中直接调用this 指向window function get() { console.log('hello world') } get() //get.call(windows)2、函数作为对象的方法被调用 var person = { name: 'lee', run: function () { console.log(`${this.name} is run`)
复制链接

扫一扫