资讯专栏INFORMATION COLUMN

【js基础】之this,call,apply,bind

khs1994 / 1695人阅读

摘要:的使用场景作为构造函数执行作为对象属性执行作为普通函数执行。要在执行时才能确认值,定义时无法确认改变上下文指向。

1.this

this的使用场景:

1.作为构造函数执行;

2.作为对象属性执行;

3.作为普通函数执行;

4.call apply bind。

this要在执行时才能确认值,定义时无法确认
var a = {
    name:"A",
    fn:function(){
        console.log(this.name);
    }
}

a.fn();//this===a

a.fn.call({name:"B"});//this==={name:"B"}

var fn1 = a.fn;
fn1();//this===window
2.call,apply

改变上下文this指向。

fn.call({this指向},参数1,参数2)

fn.apply({this指向},[参数1,参数2])

//call
function fn2(name,age){
    alert(name);//zhangsan
    console.log(this);//{x: 100}
}

fn2.call({x:100},"zhangsan",20);

//apply
function fn3(name,age){
    alert(name);//lisi
    console.log(this);//{y: 200}
}

fn3.apply({y:200},["lisi",30]);
3.bind

在函数表达式后边改变函数的上下文。

var fn = function(参数){}.bind({this指向});

fn(参数)

var fn4 = function(name,age){
    alert(name);//wangwu
    console.log(this);//{z: 300}
}.bind({z:300});

fn4("wangwu",40);

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/94657.html

相关文章

  • JS系列call & apply & bind

    摘要:参考链接在中,和是对象自带的三个方法,都是为了改变函数体内部的指向。返回值是函数方法不会立即执行,而是返回一个改变了上下文后的函数。而原函数中的并没有被改变,依旧指向全局对象。原因是,在中,多次是无效的。 参考链接:https://juejin.im/post/59bfe8... 在JavaScript中,call、apply和bind是Function对象自带的三个方法,都是为了改变...

    xiaochao 评论0 收藏0
  • 面试官问:JSthis指向

    摘要:之前写过一篇文章面试官问能否模拟实现的和方法就是利用对象上的函数指向这个对象,来模拟实现和的。虽然实际使用时不会显示返回,但面试官会问到。非严格模式下,和,指向全局对象 前言 面试官出很多考题,基本都会变着方式来考察this指向,看候选人对JS基础知识是否扎实。读者可以先拉到底部看总结,再谷歌(或各技术平台)搜索几篇类似文章,看笔者写的文章和别人有什么不同(欢迎在评论区评论不同之处),...

    warnerwu 评论0 收藏0
  • javascript 基础 call, apply, bind

    摘要:系统,扎实的语言基础是一个优秀的前端工程师必须具备的。第一个参数为调用函数时的指向,随后的参数则作为函数的参数并调用,也就是。和的区别只有一个,就是它只有两个参数,而且第二个参数为调用函数时的参数构成的数组。 系统,扎实的 javascript 语言基础是一个优秀的前端工程师必须具备的。在看了一些关于 call,apply,bind 的文章后,我还是打算写下这篇总结,原因其实有好几个。...

    xeblog 评论0 收藏0
  • javascript基础this

    摘要:出现箭头函数的时候,指向为定义时的上下文对象而非指向时,并且不能被改变首先我们先看一个例子由上面的例子我们可以看出来此时指针在用改变了之后指向的依然是全局对象非严格浏览器环境中是而非。 javascript基础之this指针 越往后面学越发现基础的重要性,所以打算重新过一遍基础,之后出几个vue和react的实战教程。ok,严归正传。 首先什么是this this是执行上下文创建时确定...

    Zoom 评论0 收藏0
  • 前端面经整理JS和CSS

    摘要:作为对象原型链的终点。调用函数时,应该提供的参数没有提供,该参数等于。它可以用于引用该函数的函数体内当前正在执行的函数。 一 JS 二 CSS 一 JS ==和===的区别 ===叫做严格运算符 ==叫做相等运算符严格运算符比较时不仅仅比较数值还要比较数据类型是否一样相等运算符在比较相同类型的数据时,与严格相等运算符完全一样。 在比较不同类型的数据时,相等运算符会先将数据进行类型转换,...

    stonezhu 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<