zoukankan      html  css  js  c++  java
  • js中的this指向问题

    关于js的this指向问题

    一直困扰着我们,并且面试的时候总是喜欢有关this的的问题

    讨论this的指向,就要从四个角度来分析看触发this的方式去决定this指向哪里

    1.方法调用

    var obj = {
        name: '残梦博客园',
        say: function(){
            console.log(this.name)    //残梦博客园
        }
    }
    obj.say();     //看这里面的this指向,需要看调用他的对象     !!!!所以要看这行!!!
    

    2.函数调用

    function getName(){
        console.log(this)    //window
    }
    getName()     //先写一个函数,然后调用这个函数,就是指向window  
    

    如果在严格模式下,会出现undefined

    function getName(){
        `use strict`
        console.log(this)    //undefined
    }
    getName()     //函数内部为严格模式要求,就出现了undefined
    

    3.new构造函数调用

    function Person(name){
        this.name = name
    }
    var person = new Person('残梦')
    var person1 = new Person('博客园')
    console.log(person,person1)  //Person {name: "残梦"} Person {name: "博客园"}
    // 通过new调用的时候,this就会指向他的实例  什么意思呢?
    // var person = new Person('残梦')运行的时候,会调用Person函数,并且把参传递过去,这个时候的this就会指向person
    

    4.call,apply等特殊方式

    有的时候我们希望可以自己去修改this的指向,那么就用到了这种方式

    function person(){
    	name = '残梦博客园'
    }
    function obj(){
    	console.log(this.name)
    }
    //我们想让obj的this指向person函数
    person.call(obj)    //这个单纯的改变指向,没有任何其他作用
    //和apply相比,只是参数不一样
    obj()      //残梦博客园
    //上面我调用了obj这个函数,发现他的this指向了person函数
    

    补充一点,es6的箭头函数,this会指向父元素的this指向

    总之一句话,this的指向就看调用他的方式,大体上就是四种方式,但是具体可能还会发生变化,比如es6箭头函数,严格模式等等

  • 相关阅读:
    C#.net使用DotNetCharting控件生成报表统计图
    部署DTCMS到Jexus遇到的问题及解决思路--验证码
    部署DTCMS到Jexus遇到的问题及解决思路---部署
    LNMP环境搭建
    LAMP环境搭建
    Mac开发配置手册
    MAC OS X的命令行技巧
    如何生成SSH key
    ssh-keygen 的 详解
    Mac上Homebrew的使用——Homebrew 使 OS X 更完整
  • 原文地址:https://www.cnblogs.com/sunhang32/p/11854850.html
Copyright © 2011-2022 走看看