首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

深入理解:为什么在与新的Promise一起使用时,.bind(这)似乎不遵循正常规则

在与新的Promise一起使用时,.bind(这)似乎不遵循正常规则的原因是,Promise对象是一种用于处理异步操作的特殊对象,它代表了一个尚未完成但最终会完成的操作。在使用Promise时,我们可以通过调用.then()方法来注册回调函数,以处理Promise对象的状态变化。

然而,当我们使用.bind()方法来绑定回调函数中的this值时,可能会遇到一些问题。正常情况下,.bind()方法会创建一个新的函数,并将其内部的this值绑定到指定的对象上。但是,在与Promise一起使用时,.bind(这)似乎不起作用的原因是,Promise对象的回调函数是在未来某个时间点执行的,而不是在绑定时立即执行的。

由于Promise的回调函数是在未来执行的,此时使用.bind()方法来绑定this值已经没有意义,因为在回调函数执行时,this值已经发生了变化。实际上,Promise对象会在回调函数执行时将this值设置为undefined,而不是绑定时的对象。

因此,在与新的Promise一起使用时,不建议使用.bind(这)来绑定回调函数中的this值。相反,可以使用箭头函数来确保回调函数中的this值与绑定时的对象保持一致。箭头函数会继承外部函数的this值,因此可以避免this值的变化。

以下是一个示例代码,展示了在与Promise一起使用时,使用箭头函数来绑定回调函数中的this值:

代码语言:txt
复制
const obj = {
  value: 42,
  getValue() {
    return new Promise((resolve, reject) => {
      setTimeout(() => {
        resolve(this.value);
      }, 1000);
    });
  }
};

obj.getValue().then((value) => {
  console.log(value); // 输出: 42
});

在上述示例中,箭头函数被用于回调函数中,确保了回调函数中的this值与绑定时的obj对象保持一致。

总结起来,当与新的Promise一起使用时,.bind(这)似乎不遵循正常规则的原因是,Promise对象的回调函数是在未来执行的,此时使用.bind()方法来绑定this值已经没有意义。因此,建议使用箭头函数来确保回调函数中的this值与绑定时的对象保持一致。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

学习函数式编程 Monad

函数式编程中,Monad 是一种结构化程序抽象,我们通过三个部分来理解一下。...Monad 中 unit, Promise 中可以看为:x => Promise.resolve(x) Monad 中 bind Promise 中可以看为:Promise.prototype.then...看到这里,相信大家对 Promise 也有了一层了解,正是借助了 Monad 一样链式操作,才使 Promise 广泛应用在了前端异步代码中,你是否也和我一样,对 Monad 充满了好感?...那么 1 就是单位元(乘法单位元) Ok,我们已经了解了所有应该掌握专业术语,那就简单串解一下这段解释吧: 一个 自函子 范畴 上 幺半群 ,可以理解为,一个满足结合律和单位元规则集合中,存在一个映射关系...相信掌握了这些理论知识,肯定会对 Monad 有一个更加深入理解

70320

美团前端一面高频面试题

根据上面的数据,可以知道,get方法中URL长度最长超过2083个字符,这样所有的浏览器和服务器都可能正常工作。...对象(包括数组)会首先被转换为相应基本类型值,如果返回是非数字基本类型值,则再遵循以上规则将其强制转换为数字。...可以借助这个特性 自己包装一个 空 Promise 要发起 Promise 来实现function wrap(pro) { let obj = {}; // 构造一个promise用来竞争..., 不能修改对象 return res;}bind描述:bind 方法会创建一个函数, bind() 被调用时,这个函数 this 被指定为 bind() 第一个参数,而其余参数将作为函数参数...核心思想:调用bind可能不是函数bind() 除了 this 外,还可传入多个参数bind() 创建函数可能传入多个参数函数可能被当做构造函数调用函数可能有返回值实现:Function.prototype.bind1

62630

javascript基础修炼(3)—Whats this(下)

引用转换 引用转换实际上并不会影响this指向,因为它是词法性质,发生在定义时,而this指向是运行时确定。只要遵循this指向基本原则就不难理解。...所以函数内部操作一个值为引用类型形参时,会影响到函数外部作用域,因为它们均指向内存中同一个函数。详细可参考[深入理解javascript函数系列第二篇——函数参数]这篇博文。...五. this指针丢失 第三节和第四节中,通过原理分析就能够明白为何在一些特定场合下this会指向全局对象,但是从语言角度来看,却很难理解this为什么指向了全局对象,因为这个规则和语法字面意思是有冲突...Nodejs中this Nodejs是一种脱离浏览器环境javascript运行环境,this指向规则浏览器环境全局对象指向上存在一定差异。 1....函数级this指向 this基本规则中有一条—当作为函数调用时,函数中this指向全局对象,这一条nodejs中也是成立,这里this指向了全局对象(此处全局对象Global对象是有别于模块级全局对象

86520

死磕 36 个 JS 手写题(搞懂后,提升真的大)

bind 方法会创建一个函数, bind() 被调用时,这个函数 this 被指定为 bind() 第一个参数,而其余参数将作为函数参数,供调用时使用。...return value } return new Promise(resolve => resolve(value)) } 参考:深入理解 Promise[10] Promise.reject...但 Promise.resolve() 不同是,如果给 Promise.reject() 传递一个 Promise 对象,则这个对象会成为 Promise 值。...Promise.all 规则是这样: 传入所有 Promsie 都是 fulfilled,则返回由他们值组成,状态为 fulfilled Promise; 只要有一个 Promise...规则是这样: 所有 Promise 状态都变化了,那么返回一个状态是 fulfilled Promise,且它值是一个数组,数组每项由所有 Promise 值和状态组成对象; 如果有一个是

90860

【React】1260- 聊聊我眼中 React Hooks

但相应地,这也破坏了函数命名语义。固定use前缀使 Hooks 很难命名,你既为useGetState这样命名感到困惑,也无法理解useTitle到底是怎么个use法儿。...好比封装一个纯函数add(),不论开发者是什么环境调用、多么深层级调用、用什么样用时序,只要传入参数符合要求,它就可以正常运作,简单而纯粹。...意味着一次完整生命周期中,useRef保留引用始终不会改变。 而这一特点却让它成为了 Hooks 闭包救星。 「遇事决,useRef !」...即便我们封装中包含任何 Hooks,用时也仅仅是包一层useEffect而已,不算费事,而且让这段逻辑也可以 Hooks 以外地方使用。...小结 本文没有鼓吹 Class Component 拒绝使用 React Hooks 意思,反而是希望通过细致地比对二者,从而更深入理解 Hooks。

1.1K20

Promise 原理探究

因此有必要深入了解一下Promise原理。 看看下面这几道题,能不能轻松答出来?...完整版(v4) 完整版中,将加入以下特性 支持then链式调用,每次调用then均返回一个promise 决议值为promise(非简单数值)以及 then返回promise时,需要反解出结果...每个then都会返回promise,错误是发生在p2里面的,而onRejected捕获是p1错误。...·三点 每次调用then均返回一个Promise 反解内部promise then未传入任何回调,透传上一promise决议值 第一题 为什么finalHandler执行顺序doSomethingElse...第四题 这是正常用法,doSomethingElse作为then1onResolve回调,接收doSomething()决议值,执行后返回另一个promise,then1会将这个promise解开并将其决议值作为他

2.2K70

一劳永逸地搞懂 JavaScript中‘this’

免费体验 Gpt4 plus AI作图神器,我们出钱 体验地址:体验 引言:this JS 中 —— 为什么它如此重要 你是否曾觉得 JavaScript 似乎戏弄你,尤其是当它在你面前挥舞...那么,为什么很重要? 掌握全局上下文中 this 为理解更复杂场景中行为提供了基础。...当你深入JavaScript时,你会发现有些情况下,函数或方法是从全局上下文中调用理解这种行为变得至关重要。 通过掌握基础知识,当我们深入探讨 this 后续部分时,你为自己奠定了成功基础。...理解常规函数内部this行为都是关于上下文。它是关于知道用时哪个对象“拥有”函数。这种洞察可以防止无数错误和挫败感,尤其是当你JavaScript项目复杂性上增长时。...这都是关于你来自哪里 你知道在生活中,我们中一些人根据我们所在地方和我们与谁在一起会戴不同帽子吗?常规函数也做类似的事情 this。

10210

36个助你成为专家需要掌握JavaScript概念

状态变化对于使用React开发人员尤其重要。 纯函数总是返回提供输入一致值,而访问或者改变其作用域以外任何变量。这种类型函数更容易阅读、调试和测试。...老实说,我是在做演示项目时学到Promise概念让我很难理解发生了什么,因为我不知道Promise是什么。快进到现在。由于网络上丰富资源,我对Promise有了更好理解。...没有固定规则规定你应该使用这些算法之一,但是这些算法性能方面是众所周知,并且有很好文档证明。 你甚至可以创建自己算法,并将其介绍给世界。...如果它比目前已知算法更好,你可能会成为下一个编程明星! 31、 继承、多态和代码重用 JavaScript中继承原型一起工作。这是因为JavaScript是非面向对象语言。...你可以文章中阅读更多关于解构内容。 36、ES2020特性 编程美妙之处在于,如果不断学习,就永远不可能成为编程语言专家。

69720

NioServerSocketChannel绑定源码解析

promise) { //this.bind head return pipeline.bind(localAddress, promise); } 我们到这里看到了一行奇怪代码,...似乎调用了一个通道传播,我们继续跟下去: @Override public final ChannelFuture bind(SocketAddress localAddress, ChannelPromise...是从后向前传播,即从tail节点向前传播,最终到Head节点结束,但是TailContextServerBootstrapAcceptor都未实现bind方法,那么我们最终把位置定位到HeadContext...代码上:(注意,这里不必知道,哎pipeline中是如何传播,下面有一章节是对pipeline添加、寻找、注册有一个完整源码分析,这里为了同学们更好理解,就先涉及这么多了!)...才疏学浅,如果文章中理解有误,欢迎大佬们私聊指正!欢迎关注作者公众号,一起进步,一起学习!

43430

那些高级前端是如何回答面试题_2023-02-24

bind() 被调用时,这个函数 this 被指定为 bind() 第一个参数,而其余参数将作为函数参数,供调用时使用。...实现要点:bind() 除了 this 外,还可传入多个参数;bing 创建函数可能传入多个参数;函数可能被当做构造函数调用;函数可能有返回值;Function.prototype.bind2 =...但 Promise.resolve() 不同是,如果给 Promise.reject() 传递一个 Promise 对象,则这个对象会成为 Promise 值。...规则是这样:传入所有 Promsie 都是 fulfilled,则返回由他们值组成,状态为 fulfilled Promise;只要有一个 Promise 是 rejected,则返回...规则是这样:空数组或者所有 Promise 都是 rejected,则返回状态是 rejected Promsie,且值为 AggregateError 错误;只要有一个是 fulfilled

46630

任务,微任务,队列和时间表

Microsoft Edge,Firefox 40,iOS Safari和桌面Safari 8.0.8 setTimeout之前promise1和之后都进行了日志记录promise2-尽管似乎是一种竞争状况...真的很奇怪,因为Firefox 39和Safari 8.0.7始终如一地正确。 为什么会这样 要了解这一点,您需要了解事件循环如何处理任务和微任务。第一次遇到这个问题可能会让您大吃一惊。...是的,我们几乎已经完成了这一步,但我需要您在接下来这段时间内保持坚强…… Microtasks通常安排事情,应该当前执行脚本后直发生,如反应批量行动,或使一些异步而采取一个全新任务处罚。...这就是为什么promise1并promise2之后记录日志原因script end,因为当前正在运行脚本必须在处理微任务之前完成。...上面的规则确保微任务不会中断执行中JavaScript。意味着我们处理侦听器回调之间微任务队列,而是两个侦听器之后进行处理。 有什么关系吗? 是的,它会在不起眼地方(哎呀)咬你。

2.2K20

前端老手 10 年心得,JavaScriptTypeScript 项目保养实用指南

当我们用户遵循“快乐路径(happy path)”时,这些错误似乎无关紧要,因为软件似乎能够按照预期运行。所以,我们可能会使用@ts-ignore、any或类型断言来暂时忽略它们。...你希望看到是期望值降低到一个最低平均水准。这样的话,你可以把代码划分为不同范围,并为每个范围设置不同期望水平。 例如,考虑一个即将为电子商务网站实现特性团队。...举例来说: 如果开发人员失去了长期保持高设计标准和 / 或代码质量动力。 如果部分开发人员遵循团队质量准则,造成系统性返工、挫折和延误。...下面是一些关于如何避免上述陷阱建议: 详细阐述业务问题解决方案时,至少让一名开发人员参与设计过程。这将提高开发人员责任心,使他们能够为一个充分理解问题实现一个好解决方案。...管理方面,确保开发人员不会得到这样激励,即“每周尽可能多地发布特性”。找到使每个开发人员职业目标团队短期和长期期望相匹配发展轨道。

13510

【JS 口袋书】第 8 章:以更细角度来看 JS 中 this

当一个函数全局环境中被调用时,该函数会将它this指向全局对象,咱们例子中是window。 这是JS第一条规则,叫作默认绑定。默认绑定就像一个回退,大多数情况下它是不受欢迎。...用于显式绑定(规则3):显式绑定指显示地将this绑定到一个上下文。但为什么要显式绑定或重新绑定函数呢?...bind 是绑定函数最强大方法。bind仍然为给定函数接受一个上下文对象,但它不只是用上下文对象调用函数,而是返回一个永久绑定到该对象函数。...现在应该清楚为什么要在 React 使用 bind来重新绑定类方法了吧。...大多数情况下,希望全局作用域交互,JS 为此就提供了一种用严格模式来中和默认绑定方法。严格模式下,对全局对象任何引用都是 undefined,这有效地保护了我们避免愚蠢错误。

2.7K20

为何面向手写代码常被吐槽,但其仍未动摇?

又一年金三银四到来,似乎 “面向手写/机写代码面试” 已经成为一些公司必备面试之一了,互联网面试中也占据着重要地位,当被面试手写代码时,刚开始自信心爆棚,有种提笔就来感觉,上来就是一顿写、一顿画,...社区已经有一些现成库了,为什么还要手写?当然并不是必须,谈一点自己思考,实际开发过程中,也会去优先选择一些优秀库,并不会到处造轮子,否则也会增加维护成本。...如果只会 API 调用,哪怕它实现很简单,也是不知道,如果能在工作中多一些思考,对一些自己经常使用东西多一些学习和思考,一方面能加深自己理解、例如 Promise resolve 函数执行会发生什么...自定义 mayJunBind 函数 bind 实现 call、apply 不同,但也没那么复杂,首先 bind 绑定之后并不会立即执行,而是会返回一个匿名函数,只有我们手动调用它才会执行。...Promise 解决过程 声明函数 resolveMayJunPromise(),Promise 解决过程是一个抽象操作,在这里可以做到系统 Promise 或一些遵循 Promise/A+ 规范

77540

【单子】说白了不过就是【自函子范畴】上一个【幺半群】而已?请说人话!!

bind(约束变量那个bind),并表示为中缀算子>>=,去包装一个单体变量,接着把它插入到一个单体函数/表达式之中,结果为一个单体值: (mx >>= f) :: (M T, T -> M U...) -> M U 同时, 3 个组成部分还需遵循 3 个定律: unit是bind左单比特: unit(a) >>= λx -> f(x) ↔ f(a) unit也是bind右单比特:...可以直接这样理解:Monad 是一种特殊数据结构,它能把值进行包装,然后链接执行;王垠《对函数式语言误解》中准确了描述了 Monad 本质: Monad 本质是使用类型系统“重载”(overloading...bind,用于链接执行; Promise 等效于把函数进行包装,Promise.resolve 等效于把这个包装进行拆开,将为一个普通值; 不过,Promise 都是 Monad,示例 Promise.resolve...如果不是,那就放到后面需要去理解时候再去理解吧~~ 不过至少,也要勾勒一下 Monad 和 Promise 关系大致轮廓;Promise 是 JS 人浪漫!Monad 是函数式编程浪漫!

99820

腾讯前端二面面试题(附答案)

相比,返回报文主体部分;OPTIONS:询问支持请求方法,用来跨域请求;CONNECT:要求代理服务器通信时建立隧道,使用隧道进行TCP通信;TRACE: 回显服务器收到请求,主要⽤于测试或诊断..., bind() 被调用时,这个函数 this 被指定为 bind() 第一个参数,而其余参数将作为函数参数,供调用时使用。...但 Promise.resolve() 不同是,如果给 Promise.reject() 传递一个 Promise 对象,则这个对象会成为 Promise 值。...11.Proxy Proxy 可以理解成,目标对象之前架设一层“拦截”,外界对该对象访问 都必须先通过层拦截,因此提供了一种机制,可以对外界访问进行过滤和改写。...WebSocket 是 HTML5 定义一个协议议,传统 http 协议不同,该协议允许由服务器主动向客户端推送信息。使用 WebSocket 协议缺点是服务器端配置比较复杂。

1K30

JS箭头函数三连问:为何用、怎么用、何时用

在这篇文章中我们将回顾箭头函数是怎样工作,然后深入探讨,实际代码中箭头函数是如何改进我们代码,以及一些箭头函数推荐情况。...跟传统函数很相像,只是我们省略了function关键字,并且添加了一个=>参数后面。 并且,这里也有很多种情况,让箭头函数结构变得更加简洁。...Promise可以更简单编写异步程序。虽然你乐意去使用async/await,你也需要好好理解promise,因为这是他们基础。 使用promise,仍然需要定义你代码执行完成之后回调函数。...如果你以下情形使用箭头函数,那么this动态绑定不会如期工作,并且你也会困惑这些代码为什么不像预期那样工作,也会给你之后工作的人造成麻烦。...当然你也可以在上面的情形之下谨慎使用箭头函数。但特别是jquery和vue情况下, 通常会干扰正常功能, 并使您感到困惑:为什么看起来跟别人代码一样代码就是工作。

2.5K20

源代码寿命

我们一直在学习:更好理解领域,更好理解领域解决方案,架构方式,工具,方法,标准以及思路。...我对大量源代码做过调查,其中包括商业以及开源,设计各种语言(Java,C#,Ruby)。总体上,这些代码都遵循一个相似的规则: 大约70%代码,在你写后12个月内一直使用,没有发生修改。...也许并不奇怪,代码完成之后头几个月改动是最频繁。再往后似乎就进入了一种维护模式,改动量变得相对较少。 我发现玩意儿实在太有趣了:大约75%代码我完成一年后仍然是原来样子。...而且,在那些仍然遗留着类似技术债代码库里,就算我们一直孜孜不倦地偿还,也没见到老代码了多少。 我是怎么做这项分析?这要归功于Git魔力,它使这项分析变得很简单。...年代愈发久远,原来代码就越腐朽而越难以修改,根据上面的分析,你很容易明白为什么一个代码仓库能够存在将近十年之久,里面的代码为什么都是些老古董:每年改动量少之又少,它们就是躺在那儿没人管,自始至终我们就只是不断地往里面添加遗产

1.3K10

【学术】区块链专家:为什么我对比特币黄金产生了怀疑?

然后给出一个具体例子,说明你为什么要小心它。 ? 最基本问题:区块链是如何工作? 为了理解区块链,首先要了解一些关于区块链基本知识。寻找一个区块来扩展区块链过程叫做“挖掘”。...现在,当矿工们使用这些一致性规则开始开采矿时,他们将会广播他们“解决”区块(当他们计算出了使blockhash目标匹配随机数时)到一个比特币核心节点时。...该节点会拒绝该块,因为区块头SHA256散列很可能与预期目标匹配。但是,比特币黄金节点将接受这个块,因为这个“Equihash散列”目标是匹配。...这也是为什么人们似乎对比特币黄金(以及其他)分叉感到满意。 比特币黄金中存在危险信号 分析中,我发现了几个对比特币黄金警告,应该会让你产生产生警惕: ?...如果这样做了,你正常”比特币就会被发送到比特币黄金链上传输地址中相同地址。重放保护到位之前,永远不要使用它,否则你有可能丢失硬币。

76560

精读《Javascript 事件循环异步》

with async/await 1 引言 我为什么要选这篇文章呢?...sessionstack最近接连发了好几篇文章, 深入探讨JS, 以及 JS 中一些内部原理. 文中也讲到了, 伴随深入了解 JS 中一些工作原理, 才有可能写出更好代码和程序....任何同步代码都只存在于 Call Stack 中,遵循先进后出,后进先出规则,也就是只有异步代码(不一定是回调)才会进入 Event Loop 中,哪些是异步代码呢?...最终效果如下 gif 图所示: Microtask Macrotask Event Loop 处理异步方式也分两种,分别是 setTimeout 之流 Macrotask, Promise...4 总结 理解了事件循环之后,才是第一步,比如我就对 React 生命周期中异步 setState 合并机制时而生效,时而生效抱有疑问,所以想要写好稳健业务代码还是挺难,首先要理解这种 “内科”

39440
领券