Promise复习(手写promise)---根据尚硅谷promise课程复习

已于 2023-03-11 18:45:13 修改
阅读量160 收藏
点赞数
文章标签： javascript 前端 开发语言
于 2023-03-11 15:11:05 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_74793405/article/details/129461885
版权

目录

1.整体结构

   1.1观察原生promise

  1.2实现步骤

2.Promise的resolve,reject

2.1设置初始值

2.2抛出异常及状态一旦修改就不能改变

3.then方法的执行回调

3.1执行回调实现步骤

4.then方法修改状态返回结果

4.1实现步骤(同步)

4.2实现步骤(异步)

4.3封装函数及then方法回调的异步执行

1.封装函数

2.then方法回调的异步执行

5.Promise构造函数以及then方法(总结)

6.promise的相关方法的实现

1.整体结构

   1.1观察原生promise

  1. promise内部传入了一个参数且该参数是一个函数，并且该函数接收2个函数类型的参数(resolve，reject) 
  2. 并且还可以在内部执行操作，执行resolve方法
  3. 还可以发现then方法属于promise的实例方法,所以应该在promise的原型对象(prototype)中有一个then方法，并且then方法接收2个函数类型的参数
        let p = new Promise((resolve, reject) => {
            resolve('OK');
        });
        p.then(
            value => {
                console.log(value);   //ok
            },
            reason => {
                console.log(reason);
            }
        )

  1.2实现步骤

  1. 在promise构造函数内部定义一个excutor执行器函数
  2. 立即执行excutor执行器函数-----传入2个参数  resolve, reject （在内部定义好）
  3.  在promise的原型对象(prototype)上添加then方法---传入2个参数  onResolved,onRejected       
/*
自定义promise模块: IIFE
*/
(function (window) {
    /*
    Promise构造函数
    excutor: 执行器函数(同步执行)---传入2个参数 resolve,reject
    */
    function Promise(excutor) {

        function resolve(params){

        }
        function reject(params){

        }

        //立即同步执行excutor
        excutor(resolve, reject)
    }

    /*
    Promise原型对象的then()
    */
    Promise.prototype.then = function (onResolved, onRejected) {

    }

    // 向外暴露Promise函数
    window.Promise = Promise
})(window)

2.Promise的resolve,reject

一个 Promise 必然处于以下几种状态之一：

  • 待定（pending）：初始状态，既没有被兑现，也没有被拒绝。
  • 已兑现（fulfilled）：意味着操作成功完成。
  • 已拒绝（rejected）：意味着操作失败

resolev函数传入value参数，reject函数传入reason参数

注意：resolve函数与reject函数基本一致，先以resolve举例

1.调用resolve函数后，promise的状态会发生改变(变为resolved)，并且它可以设置promise对象成功的结果

2.调用resolve函数

2.1设置初始值

  1. 设置resolve，reject函数的参数
  2. 定义三个常量状态 resolved(fulfilled) rejected pending
  3. 设置promise初始状态为pending
  4. 设置promise的结果值
    const PENDING = 'pending'
    const RESOLVED = 'resolved'
    const REJECTED = 'rejected'
    /*
    Promise构造函数
    excutor: 执行器函数(同步执行)---传入2个参数 resolve,reject
    */
    function Promise(excutor) {

        //将当前promise对象保存起来
        const self=this
        self.status = PENDING //给promise对象指定status属性,初始值为pending
        self.data = undefined  //给promise对象指定一个用于存储结果的数据的类型

        function resolve(value) {
            //1.修改对象的状态为resolved
            self.status = RESOLVED
            //2.保存value数据
            self.data=value

        }
        function reject(reason) {

        }

        //立即同步执行excutor
        excutor(resolve, reject)
    }

2.2抛出异常及状态一旦修改就不能改变

     let p = new Promise((resolve, reject) => {
            reject('ok')
            resolve('hhh')
        });
        console.log(p); //rejectde

根据上图原生的promise，和结果可以得出

  1. 当promise抛出异常后，也可以改变promise的状态值(rejected)，而且抛出的error会作为promise的值
  2. promise的状态只能修改一次

        function resolve(value) {
            //如果当前状态不是pending, 直接结束
            if (self.status !== PENDING) {
                return
            }
            //1.修改对象的状态为resolved
            self.status = RESOLVED
            //2.保存value数据
            self.data = value

        }
        function reject(reason) {

        }

        //立即同步执行excutor
        try {
            excutor(resolve, reject)
        } catch (error) {
            reject(error)
        }

3.then方法的执行回调

then方法可以接受两个回调函数作为参数。

第一个回调函数是Promise对象的状态变为resolved时调用，并输出结果值

第二个回调函数是Promise对象的状态变为rejected时调用，并输出结果值

在回调函数调用的时候会分成2种情况

1.在promise执行的是同步任务情况下，这个回调执行应该在then方法中执行

2.在promise执行的是异步任务情况下，这个回调执行应该先保存起来，在异步任务的时候执行

  let p1 = new Promise((resolve, reject) => {
            //第一种同步情况
            resolve('同步')
  });


  let 2p = new Promise((resolve, reject) => {
            //第二种同步情况
          setTimeout(()=>{
                resolve('异步')
            })
  });

3.1执行回调实现步骤

  1. 同步情况下需要判断promise的状态为什么，然后调用向对应的回调函数
  2. 异步情况下状态为pending,需要先保存回调函数,并等到promise状态判定完后进行执行，所以promise需要设定一个保存回调函数的数组(需要考虑promise可以执行多个异步回调)，并且在resolve，reject方法里使用回调函数
/*
自定义promise模块: IIFE
*/
(function (window) {
    const PENDING = 'pending'
    const RESOLVED = 'resolved'
    const REJECTED = 'rejected'
    /*
    Promise构造函数
    excutor: 执行器函数(同步执行)---传入2个参数 resolve,reject
    */
    function Promise(excutor) {

        //将当前promise对象保存起来
        const self = this
        self.status = PENDING //给promise对象指定status属性,初始值为pending
        self.data = undefined  //给promise对象指定一个用于存储结果的数据的类型
        self.callbacks = []   //每个数组元素的结构: { onResolved() {}, onRejected() {}}

        function resolve(value) {
            //如果当前状态不是pending, 直接结束
            if (self.status !== PENDING) {
                return
            }
            //1.修改对象的状态为resolved
            self.status = RESOLVED
            //2.保存value数据
            self.data = value
            //3.如果有待执行callback函数, 立即执行回调函数onResolved
                self.callbacks.forEach(callback => {
                    callback.onResolved(value)
                });

        }
        function reject(reason) {
            //如果当前状态不是pending, 直接结束
            if (self.status !== PENDING) {
                return
            }
            //1.修改对象的状态为rejected
            self.status = REJECTED
            //2.保存value数据
            self.data = reason
            //3.如果有待执行callback函数, 立即执行回调函数onRejected
                self.callbacks.forEach(callback => {
                    callback.onRejected(reason)
                });
        }

        //立即同步执行excutor
        try {
            excutor(resolve, reject)
        } catch (error) {
            reject(error)
        }

    }

    /*
    Promise原型对象的then()
    */
    Promise.prototype.then = function (onResolved, onRejected) {
        const self = this
        //根据状态调用回调函数
        if (self.status === RESOLVED) { //resolved
            onResolved(self.data)
        } else if (self.status === REJECTED) { //rejected
            onRejected(self.data)
        } else {  //pending
            self.callbacks.push({
                onRejected,
                onResolved
            })

        }
    }

4.then方法修改状态返回结果

let p = new Promise((resolve, reject) => {
            //第一种
            resolve('同步')
            // setTimeout(()=>{
            //     resolve('异步')
            // })
        }).then(
            value=>{
                console.log('onResolved1 '+value);
                return 2
            },reason=>{
                console.log(reason);
            }
        ).then(
            value=>{
                console.log('onResolved2 '+value);
            },reason=>{
                console.log(reason);
            }
        )

由上图原生的promise可知

then方法返回的是一个promise ，并且返回promise的结果由onResolved/onRejected执行结果决定

大致分为：

  1.   抛出异常, 返回promise的结果为失败, reason为异常
  2.   返回的是promise, 返回promise的结果就是这个结果
  3.   返回的不是promise, 返回promise为成功, value就是返回值

4.1实现步骤(同步)

1.then方法返回的是一个promise，需要return一个promise

2返回promise的结果由onResolved/onRejected执行结果

  if (self.status === RESOLVED) { //resolved
                //返回promise的结果由onResolved/onRejected执行结果决定
                // 1. 抛出异常, 返回promise的结果为失败, reason为异常
                // 2. 返回的是promise, 返回promise的结果就是这个结果
                // 3. 返回的不是promise, 返回promise为成功, value就是返回值
                try {
                    const result = onResolved(self.data)
                    if (result instanceof Promise) { //第二种情况,返回的是promise
                        result.then(
                            value => resolve(vlaue),
                            reason => reject(reason)
                        )
                    } else { //第三种情况,不是promise
                        resolve(result)
                    }
                } catch (error) {
                    reject(error)
                }
            } else if (self.status === REJECTED) { //rejected
                try {
                    const result = onRejected(self.data)
                    if (result instanceof Promise) { //第二种情况,返回的是promise
                        result.then(
                            value => resolve(vlaue),
                            reason => reject(reason)
                        )
                    } else { //第三种情况,不是promise
                        resolve(result)
                    }
                } catch (error) {
                    reject(error)
                }

4.2实现步骤(异步)

else {  //pending
                self.callbacks.push({
                    onResolved(value){
                        try {
                            const result = onResolved(self.data)
                            if (result instanceof Promise) { //第二种情况,返回的是promise
                                result.then(
                                    value => resolve(vlaue),
                                    reason => reject(reason)
                                )
                            } else { //第三种情况,不是promise
                                resolve(result)
                            }
                        } catch (error) {
                            reject(error)
                        }
                    },
                    onRejected(reason){
                        try {
                            const result = onRejected(self.data)
                            if (result instanceof Promise) { //第二种情况,返回的是promise
                                result.then(
                                    value => resolve(vlaue),
                                    reason => reject(reason)
                                )
                            } else { //第三种情况,不是promise
                                resolve(result)
                            }
                        } catch (error) {
                            reject(error)
                        }
                    }
                })

4.3封装函数及then方法回调的异步执行

1.封装函数

由同步和异步的修改状态返回结果来看，我们可以将他们封装成一个函数 handle

根据执行的结果改变return的promise的状态/数据 ，执行指定的回调函数

  /* 
            执行指定的回调函数
            根据执行的结果改变return的promise的状态/数据
            */
            function handle(callback) {
                //返回promise的结果由onResolved/onRejected执行结果决定
                // 1. 抛出异常, 返回promise的结果为失败, reason为异常
                // 2. 返回的是promise, 返回promise的结果就是这个结果
                // 3. 返回的不是promise, 返回promise为成功, value就是返回值
                try {
                    const result = callback(self.data)
                    if (result instanceof Promise) { //第二种情况,返回的是promise
                        result.then(
                            value => resolve(vlaue),
                            reason => reject(reason)
                        )
                    } else { //第三种情况,不是promise
                        resolve(result)
                    }
                } catch (error) {
                    reject(error)
                }
            }

2.then方法回调的异步执行

let p = new Promise((resolve, reject) => {
            // //第一种
            // reject('同步')
            setTimeout(()=>{
                resolve('异步')
                console.log('你好');
            })
        }).then(
            value=>{
                console.log('onResolved1 '+value);
                return 2
            },reason=>{
                console.log(reason);
                throw 2
            }
        ).then(
            value=>{
                console.log('onResolved2 '+value);
            },reason=>{
                console.log(reason);
            }
        )

由上图可知,因为promise中的then方法的回调函数都是异步执行，我们需要在处理每个回调函数前加一个定时器

5.Promise构造函数以及then方法(总结)

/*
自定义promise模块: IIFE
*/
(function (window) {
    const PENDING = 'pending'
    const RESOLVED = 'resolved'
    const REJECTED = 'rejected'
    /*
    Promise构造函数
    excutor: 执行器函数(同步执行)---传入2个参数 resolve,reject
    */
    function Promise(excutor) {

        //将当前promise对象保存起来
        const self = this
        self.status = PENDING //给promise对象指定status属性,初始值为pending
        self.data = undefined  //给promise对象指定一个用于存储结果的数据的类型
        self.callbacks = []   //每个数组元素的结构: { onResolved() {}, onRejected() {}}

        function resolve(value) {
            //如果当前状态不是pending, 直接结束
            if (self.status !== PENDING) {
                return
            }
            //1.修改对象的状态为resolved
            self.status = RESOLVED
            //2.保存value数据
            self.data = value
            //3.如果有待执行callback函数, 立即执行回调函数onResolved
            if (self.callbacks.length > 0) {
                setTimeout(() => {// 放入队列中执行所有成功的回调
                    self.callbacks.forEach(callback => {
                        callback.onResolved(value)
                    });
                });

            }

        }
        function reject(reason) {
            //如果当前状态不是pending, 直接结束
            if (self.status !== PENDING) {
                return
            }
            //1.修改对象的状态为rejected
            self.status = REJECTED
            //2.保存value数据
            self.data = reason
            //3.如果有待执行callback函数, 立即执行回调函数onRejected
            if (self.callbacks.length > 0) {
                setTimeout(() => { // 放入队列中执行所有成功的回调
                    self.callbacks.forEach(callback => {
                        callback.onRejected(reason)
                    });
                })

            }
        }

        //立即同步执行excutor
        try {
            excutor(resolve, reject)
        } catch (error) {
            reject(error)
        }

    }

    /*
    Promise原型对象的then()
    指定成功和失败的回调函数
    返回一个新的promise
    */
    Promise.prototype.then = function (onResolved, onRejected) {

        const self = this

        //返回一个新的promise
        return new Promise((resolve, reject) => {

            /* 
            执行指定的回调函数
            根据执行的结果改变return的promise的状态/数据
            */
            function handle(callback) {
                //返回promise的结果由onResolved/onRejected执行结果决定
                // 1. 抛出异常, 返回promise的结果为失败, reason为异常
                // 2. 返回的是promise, 返回promise的结果就是这个结果
                // 3. 返回的不是promise, 返回promise为成功, value就是返回值
                try {
                    const result = callback(self.data)
                    if (result instanceof Promise) { //第二种情况,返回的是promise
                        result.then(
                            value => resolve(vlaue),
                            reason => reject(reason)
                        )
                    } else { //第三种情况,不是promise
                        resolve(result)
                    }
                } catch (error) {
                    reject(error)
                }
            }

            //根据状态调用回调函数
            if (self.status === RESOLVED) { //resolved
                // 立即异步执行成功的回调函数
                setTimeout(() => {
                    handle(onResolved)
                })

            } else if (self.status === REJECTED) { //rejected
                // 立即异步执行失败的回调函数
                setTimeout(() => {
                    handle(onRejected)
                })
            } else {  //pending
                self.callbacks.push({
                    onResolved(value) {
                        handle(onResolved)
                    },
                    onRejected(reason) {
                        handle(onRejected)
                    }
                })

            }
        })
    }

    // 向外暴露Promise函数
    window.Promise = Promise
})(window)

6.promise的相关方法的实现

 /* 
 Promise原型对象的catch()
 指定失败的回调函数
 返回一个新的promise对象
 */
    Promise.prototype.catch = function (onRejected) {
        return this.then(undefined, onRejected)
    }

 /* 
  Promise函数对象的resolve方法
  返回一个指定结果的成功的promise
  */   
  Promise.resolve = function (value) {
    // 返回一个成功/失败的promise
    return new Promise((resolve, reject) => {
      // value是promise
      if (value instanceof Promise) { // 使用value的结果作为promise的结果
        value.then(resolve, reject)
      } else { // value不是promise  => promise变为成功, 数据是value
        resolve(value)
      }
    })
  }

  /* 
  Promise函数对象的reject方法
  返回一个指定reason的失败的promise
  */
  Promise.reject = function (reason) {
    // 返回一个失败的promise
    return new Promise((resolve, reject) => {
      reject(reason)
    })
  }

   /* 
  Promise函数对象的all方法
  返回一个promise, 只有当所有proimse都成功时才成功, 否则只要有一个失败的就失败
  */
  Promise.all = function (promises) {
    // 用来保存所有成功value的数组
    const values = new Array(promises.length) 
    // 用来保存成功promise的数量
    let resolvedCount = 0
    // 返回一个新的promise
    return new Promise((resolve, reject) => {
      // 遍历promises获取每个promise的结果
      promises.forEach((p, index) => {
        Promise.resolve(p).then(
          value => {
            resolvedCount++ // 成功的数量加1
            // p成功, 将成功的vlaue保存vlaues
            // values.push(value)
            values[index] = value
            // 如果全部成功了, 将return的promise改变成功
            if (resolvedCount===promises.length) {
              resolve(values)
            }

          },
          reason => { // 只要一个失败了, return的promise就失败
            reject(reason)
          }
        )
      })
    })
  }

  /* 
  Promise函数对象的race方法
  返回一个promise, 其结果由第一个完成的promise决定
  */
  Promise.race = function (promises) {
    // 返回一个promise
    return new Promise((resolve, reject) => {
      // 遍历promises获取每个promise的结果
      promises.forEach((p, index) => {
        Promise.resolve(p).then(
          value => {// 一旦有成功了, 将return变为成功
            resolve(value)
          },
          reason => { // 一旦有失败了, 将return变为失败
            reject(reason)
          }
        )
      })
    })
  }

m0_74793405
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Nodejs 之 promise
loeyln的博客
04-08 622
express一、CommonJs二、Promise2.1 回调地狱2.2 promise是什么2.2.1 抽象表达2.2.2 具体表达2.2.3 Promise有三个状态2.2.4 promise的状态改变2.3 promise基本流程2.4 promise的优势2.4.1. 指定回调函数的方式更加灵活2.4.2 支持链式调用, 可以解决回调地狱问题2.5 promise的使用：解决回调地狱问题2.6 async/await 同时使用2.7 Promise的使用2.8 Promise的几个关键问题 一、C
js代码-手写代码练习----promise的实现
07-15
手写Promise的练习主要涵盖以下几个关键部分： 1. **构造函数**：Promise构造函数接收一个执行器函数作为参数，这个函数接受两个参数——resolve和reject，它们分别是改变Promise状态的方法。当我们调用resolve时，...
面试准备之手写Promise
weixin_49172439的博客
04-30 2336
本文是我在看完尚硅谷Promise教程后整理的手写Promsie，内容可能会稍许有点偏差，仅供参考。 当然，都看到手写Promise了，所以肯定对Promise的基本使用是没问题了，下面就来看看如何手写一份Promise吧。 一、搭建Promise骨架 新建lib文件夹，添加Promise.js文件。 首先采用ES5语法实现，后续会讲解ES6语法实现 // 自定义Promise函数模块: IIFE (function (window) { // Promise构造函数 // executor
Promise学习笔记（尚硅谷）
Ch_ensf的博客
05-16 1244
一、Promise 的理解和使用 二、手写 Promise
Promise相关笔记 — 尚硅谷promise学习记录
qq_44363897的博客
03-12 523
Promise相关笔记 — 尚硅谷promise 一、实例对象和函数对象 函数对象：将函数作为对象使用时，简称为函数对象 实例对象：new 函数产生的对象，简称对象 <script type='text/javascript'> //js中所有函数都是Function类的实例 function Fn () { //Fn函数 } const fn =...
promise的理解和使用-尚硅谷教程笔记
weixin_42349568的博客
10-05 557
一，理解 抽象表达：promise是js中进行异步编程的新的解决方案。（旧的是纯粹的回调函数） 具体表达：从语法上来看，promise是一个构造函数。从功能上来说，promise对象用来封装一个异步操作，并可以获取其结果。 异步操作的第一阶段处理方式：回调函数作为参数传入，异步结果作为回调函数的参数传入，回调函数在异步操作后调用，以完成对异步结果的获取和处理。 之前就学习过，异步操作的执行，是无法直接得到执行结果的。 为了拿到结果，人们将函数作为参数来定义异步操作的函数： 类似于上图这样，利用回调函数作
js代码-手写promise.all
07-16
// 这里将实现手写Promise.all的逻辑 }); } ``` 接下来，我们需要跟踪Promise的状态。我们可以创建一个计数器来记录已解析的Promise数量，以及一个存储结果的数组： ```javascript let resolvedCount = 0; let ...
Promise_js手写promise_js手写Promise_手写Promise_JS手写Promise_
09-30
在本文中，我们将深入探讨如何使用原生JavaScript手写Promise。 首先，我们需要理解Promise的基本概念。Promise有三种状态：pending（等待中）、fulfilled（已完成）和rejected（已拒绝）。每个Promise实例在其生命...
js代码-手写promise.allSettled
07-14
在这个手写`promise.allSettled`的过程中，我们可以深入理解Promise的工作原理和设计模式。 首先，我们需要明白`Promise.allSettled`的核心功能：当传入的Promise数组中的每个Promise都达到settled状态（即...
更新商品前端接口编写
最新发布
weixin_55639995的博客
07-12 220
那么在vue运行的时候,会加载所有的ref属性特征的元素还有组件。标签中ref的作用就是将 该组件注册到vue对象的ref属性中。使用插槽,那个scope就是代表着一行的数据。然后里面的选项遍历的是 js定义的数据。如果文字显示过多可以使用 文本隐藏显示。表单绑定还有表单数据的绑定。数据绑定使用的表单绑定状态。写form表单然后封装数据。状态的选择使用的是选择框。副标题使用的是文本域。状态页面使用,下拉框。富文本选择器使用组件。使用后端枚举类型去写。
vue 自定义滚动条同步拖动（移动端）
u014206461的博客
07-12 98
vue 自定义滚动条同步拖动（移动端）
什么是防抖和节流？如何理解它们并在不同的场景条件下灵活运用？
Vinca@的博客
07-08 877
防抖（Debouncing）和节流（Throttling）是两种常见的性能优化技术，常用于控制某些操作（例如事件处理器）的频率，从而减少资源消耗并提高性能。防抖：在事件停止触发后的指定时间内执行函数。适用于需要等用户停止操作后再处理事件的场景。节流：在指定时间间隔内最多执行一次函数。适用于需要限制函数执行频率的场景。滚动停止后的操作：使用防抖。滚动过程中的持续操作：使用节流。根据具体需求选择适合的优化技术可以有效提高应用性能和用户体验。
Webkit简介以及工作流程
读心悦
07-10 307
WebKit是一个开源的浏览器引擎，最初由苹果公司基于KHTML（K Desktop Environment的HTML渲染引擎）开发，并广泛应用于Safari浏览器。随着时间的推移，WebKit也被其他多款浏览器和应用所采用，成为Web技术生态中的重要一员。WebKit的核心功能包括解析HTML、CSS、JavaScript等网页内容，并将其渲染为可视化的网页页面。它主要由WebCore（负责HTML解析、CSS样式计算和布局）和JavaScriptCore（负责JavaScript解释执行）两大部分组成。
lightchart 和百度echarts 有什么区别, 各自优势是什么
huanghm88的专栏
07-08 204
总体而言，Lightchart和百度Echarts都是强大的图表库，选择使用哪个取决于具体的需求和个人偏好。如果您对界面简洁和定制化有较高要求，可以选择Lightchart；社区活跃：百度Echarts拥有广泛的用户群体和开发者社区，用户可以通过社区获取到丰富的文档、教程和示例，解决问题和获取帮助。易于使用：Lightchart提供了方便易用的API和丰富的文档和示例，使用户能够快速上手并灵活使用图表库。成熟稳定：百度Echarts已经发布了多个版本，经过了长时间的发展和优化，具有较高的稳定性和可靠性。
vue引入sm-crypto通过sm4对文件进行加解密，用户输入密码
cc1314_工作、学习有感
07-12 89
通过sm4对文件进行加解密，用户输入密码
vue2 、 vue3首屏优化，减少白屏时间
m0_56104994的博客
07-09 304
vue2、vue3首屏优化,减少白屏时间
前端 JS 经典：迭代器
weixin_64684095的博客
07-12 155
如果在最后一个值返回后再调用 next()方法，那么返回的对象中属性 done 的值为 true，属性 value 则包含迭代器最终返回的值（如果没有相关数据则返回 undefined）。可迭代对象具有 Symbol.iterator 属性，通过指定的函数可以返回一个作用于附属对象的迭代器。JavaScript 中有一些内置的可迭代对象，如数组、字符串、集合（Set）、映射（Map）等，它们都具有默认的迭代器。在 JavaScript 中，迭代器是一个对象，它定义了一个序列，并在终止时可能返回一个返回值。
什么是vue的计算属性
weixin_56187723的博客
07-12 164
Vue的计算属性（Computed Properties）是Vue组件中的一个非常强大的功能，它们允许组件基于它们的响应式依赖进行缓存的派生值。只有当相关响应式依赖发生改变时，计算属性才会重新求值。这意味着只要依赖的响应式数据没有发生变化，多次访问计算属性会立即返回之前的计算结果，而不必再次执行计算函数。
javascript高级部分笔记
喵喵的博客
07-09 1265
javascript高级部分 Function方法 与 函数式编程 call 语法：call([thisObj[,arg1[, arg2[, [,.argN]]]]]) 定义：调用一个对象的一个方法，以另一个对象替换当前对象。 说明：call 方法可以用来代替另一个对象调用一个方法。call 方法可将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定的新对象。 如果没有提供 thisObj 参数，那么 Global 对象被用作 thisObj。 let myName = 'goudan
promise 手写
08-27
一次性搞懂手写Promise全过程](https://blog.csdn.net/qq_41852789/article/details/128453341)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值