this关键字在JS中的使用方法

本文详细介绍了JavaScript中this关键字的四种主要用法:普通函数、对象方法、构造函数及apply和call调用。通过实例展示了this如何根据上下文指向不同的对象,深入理解this对于JavaScript编程至关重要。
摘要由CSDN通过智能技术生成
一、this是js的一个关键字,在不同的使用场合,它的值也会发生变化;但是无论怎么变化,它本质上指的就是调用函数的那个对象
二、this在js中主要的四种用法:

1.在普通函数中使用;
2.作为对象方法来使用;
3.作为构造函数来使用;
4.call和applay调用;

1.在普通函数中的调用

在这里this指的是全局性调用;它的指针指向是window。

function test1(){
        this.x1 =1;  //相当于window.x1 =1;
        console.log('this.x1 = '+this.x1);  //console.log('window.x1 = '+window.x1);
    }
    test1();  //结果为1
var x2 = 10;  //全局变量
    function test2() {
        console.log('x2 = '+x2);  //10
        console.log('this.x2 = '+this.x2);  //10
    }
    test2();
var x3 = 100;
    function test3() {
        this.x3 = 0;  //重新赋值
    }
    test3();
    console.log(x3);  //0
2.作为对象方法来使用

在这里this指的是他的上一级对象

var obj={
        name:"hello";  //对象属性
        show:function(){  //对象方法
        console.log(this.name);
        //console.log(this);  //this指obj这个对象
    }};
    obj.show();

    var objA={name:"world"};  //申明新的对象objA,属性name:"world"
    objA.show=obj.show;  //把obj里面的show方法赋给objA
    objA.show();  //调用这个对象,此时的this指的是objA;
3.作为构造函数来使用

例子1:

var  fnn=function(age){
        this.age=age;
        this.show=function(){
            console.log(age+'岁');
            //console.log(this);  //fnn
        }
    };
    var a=new fnn(20);  //new一个新的对象a;会先生成一个空对象,然后调用方法,把this的替换成这个空对象
    a.show();  //调用a对象中的show方法。
    console.log(a.age);  //20

例子2:

var SomeClass = function(){
        this.value = 100;
        //console.log(this);
    };
    var myCreate = new SomeClass();
    console.log(myCreate.value);   // 输出100
4.apply和call调用

apply和call的区别:
(1)相同点是两个方法产生的作用是完全一样的(改变this的指向),第一个是函数运行的作用域;
(2)不同点是方法传递的参数不同,apply(obj,[arg1,arg2…]); call(obj,arg1,arg2)

var fnn4=function() {
        this.name = "hello";
        console.log(this.name);//hello
        this.show = function() {
            console.log(this.name);//hello
        }
    };

    var d = new fnn4();
    d.show();//fnn4
    //声明新的对象objD,重新复制name;
    var objD = {
        name: "objD"
    };

    d.show.call(objD);//call(objD)改变this指向

    /*
    *    obj.show=d.show();
    *    obj.show();
    *    delete obj.show();
    * */

    var x = 0;
    function test4(){
        console.log(this.x);
    }
    var o={};//声明o对象
    o.x = 10;//属性X=10赋值;
    o.m = test4;
    o.m.apply(); //0 ,this默认指全局对象
    o.m.apply(o); //10,this指o对象

   /* var arr=[1,2,3,4];
    var a=Math.min.apply(arr,arr);
    console.log(a)*/
  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值