• 不安分的this


    不安分的this

     前言:关于javascript中的this,上网一搜一大片的文章。惊!

    而我个人认为要想分清this,就有必要先搞清楚“对象”。

    目录:

    一.函数对象的认识

    二.this 

    一.函数对象的认识

    post出概念:

    每逢过节,亲戚朋友都会问,小罗你的对象呢?

    这里所指的对象:是指小罗我感觉合适的某个异性。是指实体:实例。

    1:小罗感觉合适(对应计算机语言就是:方法)对人友善

    2:异性(属性)女人

    那么回答亲戚就说:黄某某

    我想表达的是,对象是指某一类人,当使用的时候是明确的某个人。

    函数

    插入内容,如下引用:

    函数对象与其他用户所定义的对象有着本质的区别,这一类对象被称之为内部对象

    例如日期对象(Date)、数组对象(Array)、字符串对象 (String)都属于内部对象。

    这些内置对象的构造器是由JavaScript本身所定义的:通过执行new Array()这样的语句返回一个对象,JavaScript内部有一套机制来初始化返回的对象,而不是由用户来指定对象的构造方式。

    在JavaScript中,函数对象对应的类型是Function,正如数组对象对应的类型是Array,日期对象对应的类型是Date一样,可以通过 new Function()来创建一个函数对象,也可以通过function关键字来创建一个对象。

    下面两行代码都是创建一个数组对象myArray:
    var myArray=[];
    //等价于
    var myArray=new Array();
    同样,下面的两段代码也都是创建一个函数myFunction:
    function myFunction(a,b){
    return a+b;
    }
    //等价于
    var myFunction=new Function("a","b","return a+b"); 

    出自:雨中无伞V-蓝色“认识js中的function和this

     就是说:

     看到用function关键字创建的,和用new Function()创建的内容称为函数对象(function)

     而this就是指向函数对象。

    二.this

    判断this所指的具体对象方法:

    step1:找到函数真正被调用执行的位置(运行时的位置)

    step2:查看有没有闭包或者直接调用再或者call与apply

    step3: this: 当前方法属于谁,this就是谁!

    关键字词:this关键字总是返回某个具体对象。再说的详细一些,就是属性或方法“当前”所在的某个对象。(重点一

    (1)身处全局变量中

    案例:

    var name="全局";
    function getName(){
        var name="局部";
        return this.name;
    };
    alert(getName());//全局

    step1:找到函数真正被调用执行的位置(运行时的位置)

    既是:

    alert(getName());

    step2:查看有没有闭包或者直接调用再或者call与apply

    没有这些内容,不会跳了出来。

    step3: this: 当前方法属于谁,this就是谁!

    这里只是声明了那一类,而没有指出是哪一个人。那么就会默认指向window

    则getName返回的this.name其实是window.name,因此alert出来的是“全局”!

    (2)身处局部变量中

    在解说之前,要插入一些内容

    构造函数:

    var obj = new Object();

    如上,称new 调用的函数为构造函数,构造函数和普通函数区别仅仅在于是否使用了new来调用,它们的返回值也会不同

    所谓“构造函数”,就是专门用来生成“对象”的函数。

    特点:1可以生成多个对象

    2可以通过.来为对象添加属性和方法

    obj.name = 'Byron';
    obj.printName = function(){
        console.log(obj.name);
    };

    可以等价于

    var obj = {
        name: 'Byron',
        printNmae: function(){
            console.log(obj.name);
        }
    }

    自动化就要使用函数嵌套了

    function createObj(name, age){
      var obj = {
        name: name,
        age: age,
        printName: function(){
                console.log(this.name);
            }
      };
      return obj;
    }
    
    var obj3 = createObj('Byron', 30);
    obj3.printName();

    but:构造出来的对象类型都是Object,没有识别度

    可以改造为

    function Person(nick, age){
        this.nick = nick;
        this.age = age;
        this.sayName = function(){
                console.log(this.nick);
        }
    }
    var p1 = new Person();

    参考文章:谦行的“JavaScript面向对象

    有了如上的基础,就可以看下方的例子了。

    案例:

    var name="全局";
    var twobin={
        name:"局部",
        getName:function(){
            return this.name;
        }
    };
    alert(twobin.getName());

    step1:找到函数真正被调用执行的位置(运行时的位置)

    既是:

    alert(twobin.getName());

    step2:查看有没有闭包或者直接调用再或者call与apply

    没有这些内容,不会跳了出来。

    step3: this: 当前方法属于谁,this就是谁!

    这里指出是哪一个人twobin。那么就会默认指向window

    则getName返回的this.name其实是twobin.name,因此alert出来的是“局部”!

    (3)身处闭包中

    var name="全局";
    var twobin={
        name:"局部",
        getName:function(){
            return function(){
                return this.name;
            };
        }
    };
    alert(twobin.getName()());

    step1:找到函数真正被调用执行的位置(运行时的位置)

    既是:

    alert(twobin.getName()());

    step2:查看有没有闭包或者直接调用再或者call与apply

    有,所以不能根据第一步,而是

    匿名函数的运行时位置来判断。

    function (){

        return this.name;

    };来确认位置

    step3: this: 当前方法属于谁,this就是谁!

    匿名函数所在的对象是window

    匿名函数返回的this.name其实是window.name,因此alert出来的就是“全局”!

    那么,如何在闭包中使得this身处在twobin中呢?

    var name="全局";
    var twobin={
        name:"局部",
        getName:function(){
            var that=this;
            return function(){
                return that.name;
            };
        }
    };
    alert(twobin.getName()());

    step1:找到函数真正被调用执行的位置(运行时的位置)

    既是:

    alert(twobin.getName());

    step2:查看有没有闭包或者直接调用再或者call与apply

    有,但是this不再匿名函数中

    step3: this: 当前方法属于谁,this就是谁!

    这里指出是哪一个人twobin。那么就会默认指向window

    则getName返回的this.name其实是twobin.name,因此alert出来的是“局部”!

    (4)call与apply中的this

    在JavaScript中能管的住this的估计也就非call与apply莫属了。

    call与apply就像this的父母一般,让this住哪它就得住哪,不得不听话!

    var name="全局";
    var twobin={
        name:"局部",
    };
    function getName(){
        alert(this.name);
    }
    getName(twobin);
    getName.call(twobin);

    step1:找到函数真正被调用执行的位置(运行时的位置)

    既是:

    getName(twobin);

    step2:查看有没有闭包或者直接调用再或者call与apply

    没有这些内容,不会跳了出来。

    step3: this: 当前方法属于谁,this就是谁!

    这里只是声明了那一类,而没有指出是哪一个人。那么就会默认指向window

    则getName返回的this.name其实是window.name,因此alert出来的是“全局”!

    getName.call(twobin);

    其中,call指定this的安身之处就是在twobin对象,因为this被迫只能在twobin那安家,则此时this指向twobin对象, this.name其实是twobin.name,因此alert出来的是“局部”!

    这些是我本人话了一个下午的时间总结出来的,应该有些不足。我相信在日后的工作上会慢慢的提炼出更为准确的知识。

  • 相关阅读:
    Features for Multi-Target Multi-Camera Tracking and Re-identification论文解读
    CBAM(Convolutional Block Attention Module)使用指南
    j2ee web项目 ssh 中使用junit测试
    log4j 发送日志到邮箱
    java.util.ConcurrentModificationException
    java 项目 报错
    json 传参数到action中 乱码
    TOMCAT 信息
    action 纯注解 笔记
    java 上传图片 打水印
  • 原文地址:https://www.cnblogs.com/hewasdrunk/p/7381609.html
Copyright © 2020-2023  润新知