从Google V8引擎剖析Promise实现

plokmju88 发布于2019-08-26 13:52 / 558人阅读

摘要：从引擎剖析实现本文阅读的源码为，此版本的实现为版本，在后续版本继续对其实现进行了处理。引入了语法等，在版本迭代后，逐渐迭代成了版本实现。方法的调用暴露给外部的高版本为方法，如果当前的指向的构造函数，则设置当前的状态，否则调用函数执行。

从Google V8引擎剖析Promise实现

</>复制代码 
    本文阅读的源码为Google V8 Engine v3.29.45，此版本的promise实现为js版本，在后续版本Google继续对其实现进行了处理。引入了es6语法等，在7.X版本迭代后，逐渐迭代成了C版本实现。    贴上源码地址：https://chromium.googlesource... 大家自觉传送。
    代码中所有类似%functionName的函数均是C语言实现的运行时函数。

Define variables

首先定义了将要在JS作用域使用了一些变量，提高了编译器的效率。

</>复制代码 
var IsPromise;
var PromiseCreate;
var PromiseResolve;
var PromiseReject;
var PromiseChain;
var PromiseCatch;
var PromiseThen;
var PromiseHasRejectHandler;

随后定义了一些全局私有变量供给和C语音交互，用于维护Promise的状态和进行Debug。

</>复制代码 
var promiseStatus = GLOBAL_PRIVATE("Promise#status");
var promiseValue = GLOBAL_PRIVATE("Promise#value");
var promiseOnResolve = GLOBAL_PRIVATE("Promise#onResolve");
var promiseOnReject = GLOBAL_PRIVATE("Promise#onReject");
var promiseRaw = GLOBAL_PRIVATE("Promise#raw");
var promiseDebug = GLOBAL_PRIVATE("Promise#debug");
var lastMicrotaskId = 0;

其中GLOBAL_PRIVATE是python进行实现的，运用python的宏定义（macro）来定义调用了C语言的CreateGlobalPrivateOwnSymbol方法。

</>复制代码 
macro GLOBAL_PRIVATE(name) = (%CreateGlobalPrivateOwnSymbol(name));

随后运用了一个自执行的匿名函数进行闭包逻辑。

</>复制代码 
(function() {
  // 主逻辑
})();

在闭包逻辑的最后，在promise原型上挂载了三个方法：chain，then，catch。在promise对象上挂载了all,race等六个方法。将Promise对象注册到了global。

</>复制代码 
%AddNamedProperty(global, "Promise", $Promise, DONT_ENUM);
InstallFunctions($Promise, DONT_ENUM, [
    "defer", PromiseDeferred,
    "accept", PromiseResolved,
    "reject", PromiseRejected,
    "all", PromiseAll,
    "race", PromiseOne,
    "resolve", PromiseCast
]);
InstallFunctions($Promise.prototype, DONT_ENUM, [
    "chain", PromiseChain,
    "then", PromiseThen,
    "catch", PromiseCatch
]);

Start from constructor

</>复制代码 
var $Promise = function Promise(resolver) {
    // 如果传入参数为全局promiseRaw变量的时候return
    if (resolver === promiseRaw) return;
    // 如果当前函数不是构造函数的化，抛出错误这不是一个promise
    if (!%_IsConstructCall()) throw MakeTypeError("not_a_promise", [this]);
    // 如果传入参数不是一个函数的话，抛出错误，传入参数不是一个function
    if (!IS_SPEC_FUNCTION(resolver))
        throw MakeTypeError("resolver_not_a_function", [resolver]);
    var promise = PromiseInit(this);
    try {
        // debug相关忽略
        %DebugPushPromise(promise);
        resolver(function(x) { PromiseResolve(promise, x) },
                 function(r) { PromiseReject(promise, r) });
    } catch (e) {
        // 报错之后走到错误处理函数
        PromiseReject(promise, e);
    } finally {
        // debug相关忽略
        %DebugPopPromise();
    }
}

构造函数在做完额外的异常和参数判断后，进入主逻辑调用PromiseInit方法初始化promise，随后调用了resolver方法，传入了两个默认的处理函数。在promise在内部被调用时（PromiseDeferred方法被调用时）会实例化$promise,将默认方法return回去，使得创建的promise示例具有resolve和reject方法。

</>复制代码 
function PromiseDeferred() {
    if (this === $Promise) {
        // Optimized case, avoid extra closure.
        var promise = PromiseInit(new $Promise(promiseRaw));
        return {
            promise: promise,
            resolve: function(x) { PromiseResolve(promise, x) },
            reject: function(r) { PromiseReject(promise, r) }
        };
    } else {
        var result = {};
        result.promise = new this(function(resolve, reject) {
            result.resolve = resolve;
            result.reject = reject;
        })
        return result;
    }
}

PromiseInit

</>复制代码 
function PromiseSet(promise, status, value, onResolve, onReject) {
    // macro SET_PRIVATE(obj, sym, val) = (obj[sym] = val);
    // 设置promise的状态，SET_PRIVATE只有在给已经存在的对象设置已有属性值的时候才会被调用
    SET_PRIVATE(promise, promiseStatus, status);
    SET_PRIVATE(promise, promiseValue, value);
    SET_PRIVATE(promise, promiseOnResolve, onResolve);
    SET_PRIVATE(promise, promiseOnReject, onReject);
    // debug代码忽略
    if (DEBUG_IS_ACTIVE) {
        %DebugPromiseEvent({ promise: promise, status: status, value: value });
    }
    return promise;
}
function PromiseInit(promise) {
    return PromiseSet(
        promise, 0, UNDEFINED, new InternalArray, new InternalArray)
}

实质上是调用了PromiseSet方法给promise设置了当前的状态。

PromiseResolve

promiseResolve方法的调用暴露给外部的promise.accept(高版本为resolve)方法，如果当前的this指向promise的构造函数，则设置当前的promise状态，否则调用resolve函数执行。

</>复制代码 
function PromiseResolved(x) {
    if (this === $Promise) {
        // Optimized case, avoid extra closure.
        return PromiseSet(new $Promise(promiseRaw), +1, x);
    } else {
        return new this(function(resolve, reject) { resolve(x) });
    }
}

promiseResolve处理逻辑同promiseReject，不再赘述。

promise.then

PromiseThen方法的调用暴露给实例化后的promise.then方法调用。

</>复制代码 
PromiseThen = function PromiseThen(onResolve, onReject) {
    onResolve = IS_SPEC_FUNCTION(onResolve) ? onResolve
    : PromiseIdResolveHandler;
    onReject = IS_SPEC_FUNCTION(onReject) ? onReject
    : PromiseIdRejectHandler;
    var that = this;
    var constructor = this.constructor;
    return %_CallFunction(
        this,
        function(x) {
            x = PromiseCoerce(constructor, x);
            return x === that ? onReject(MakeTypeError("promise_cyclic", [x])) :
            IsPromise(x) ? x.then(onResolve, onReject) : onResolve(x);
        },
        onReject,
        PromiseChain
    );
}

首先判断传入的两个参数是否是函数，不是的话添加默认的处理函数，做良好的容错处理。而后调用了 %_CallFunction方法(第一个参数是this，最后一个参数是要调用的方法，中间是传入参数)，类似Function.prototype.call()方法，调用了PromiseChain方法，传入了两个参数resolve和reject。在resolve方法内部调用了PromiseCoerce方法，生成对象如果是个thenable对象调用对象的then方法否则直接onResolve方法。

PromiseCoerce

</>复制代码 
function PromiseCoerce(constructor, x) {
    if (!IsPromise(x) && IS_SPEC_OBJECT(x)) {
        var then;
        try {
            then = x.then;
        } catch(r) {
            return %_CallFunction(constructor, r, PromiseRejected);
        }
        // macro IS_SPEC_FUNCTION(arg) = (%_ClassOf(arg) === "Function");
        // 如果是一个function
        if (IS_SPEC_FUNCTION(then)) {
            var deferred = %_CallFunction(constructor, PromiseDeferred);
            try {
                %_CallFunction(x, deferred.resolve, deferred.reject, then);
            } catch(r) {
                deferred.reject(r);
            }
            return deferred.promise;
        }
    }
    return x;
}

核心的逻辑是如果传入对象的then属性是一个function，则调用then方法。若有报错走到reject方法。

PromiseChain

</>复制代码 
PromiseChain = function PromiseChain(onResolve, onReject) {  
    // 补默认的处理函数
    onResolve = IS_UNDEFINED(onResolve) ? PromiseIdResolveHandler : onResolve;
    onReject = IS_UNDEFINED(onReject) ? PromiseIdRejectHandler : onReject;
    var deferred = %_CallFunction(this.constructor, PromiseDeferred);
    switch (GET_PRIVATE(this, promiseStatus)) {
        case UNDEFINED:
            throw MakeTypeError("not_a_promise", [this]);
        case 0:  // Pending
            GET_PRIVATE(this, promiseOnResolve).push(onResolve, deferred);
            GET_PRIVATE(this, promiseOnReject).push(onReject, deferred);
            break;
        case +1:  // Resolved
            PromiseEnqueue(GET_PRIVATE(this, promiseValue),
                           [onResolve, deferred],
                           +1);
            break;
        case -1:  // Rejected
            PromiseEnqueue(GET_PRIVATE(this, promiseValue),
                           [onReject, deferred],
                           -1);
            break;
    }
    // debug代码忽略
    if (DEBUG_IS_ACTIVE) {
        %DebugPromiseEvent({ promise: deferred.promise, parentPromise: this });
    }
    return deferred.promise;
}

PromiseChain方法是promise实现的核心，判断当前定义的promise状态，如果是pending状态在promiseOnResolve数组中push当前的onResolve方法。如果是Resolved状态或者Rejected状态，则调用PromiseEnqueue函数进行微任务的添加。

PromiseEnqueue

</>复制代码 
function PromiseEnqueue(value, tasks, status) {
    var id, name, instrumenting = DEBUG_IS_ACTIVE;
    %EnqueueMicrotask(function() {
        if (instrumenting) {
            %DebugAsyncTaskEvent({ type: "willHandle", id: id, name: name });
        }
        for (var i = 0; i < tasks.length; i += 2) {
            PromiseHandle(value, tasks[i], tasks[i + 1])
        }
        if (instrumenting) {
            %DebugAsyncTaskEvent({ type: "didHandle", id: id, name: name });
        }
    });
    if (instrumenting) {
        id = ++lastMicrotaskId;
        name = status > 0 ? "Promise.resolve" : "Promise.reject";
        %DebugAsyncTaskEvent({ type: "enqueue", id: id, name: name });
    }
}

此步骤其实是将PromiseHandle函数加入JS运行时的微任务队列中。微任务的队列列表是C语言进行维护的，应用%EnqueueMicrotask方法进行添加。

PromiseHandle

</>复制代码 
function PromiseHandle(value, handler, deferred) {
    try {
        %DebugPushPromise(deferred.promise);
        var result = handler(value);
        if (result === deferred.promise)
            throw MakeTypeError("promise_cyclic", [result]);
        else if (IsPromise(result))
            %_CallFunction(result, deferred.resolve, deferred.reject, PromiseChain);
        else
            deferred.resolve(result);
    } catch (exception) {
        try { deferred.reject(exception); } catch (e) { }
    } finally {
        %DebugPopPromise();
    }
}

此函数处理了传入的方法，是指是调用了resolve方法，如果返回的结果依旧是一个promise则继续调用PromiseChain方法，否则调用新生成的promise实例的resolve方法，进而实现循坏调用。

promise.all

promise的all方法实现了发送多个promise请求，返回一个新的promise，所有promise打到resolve状态时触发resolve状态，若有一个promise被reject，则返回此promise的reject原因。

</>复制代码 
function PromiseAll(values) {
    var deferred = %_CallFunction(this, PromiseDeferred);
    var resolutions = [];
    if (!%_IsArray(values)) {
        deferred.reject(MakeTypeError("invalid_argument"));
        return deferred.promise;
    }
    try {
        var count = values.length;
        if (count === 0) {
            deferred.resolve(resolutions);
        } else {
            for (var i = 0; i < values.length; ++i) {
                this.resolve(values[i]).then(
                    (function() {
                        // Nested scope to get closure over current i (and avoid .bind).
                        // TODO(rossberg): Use for-let instead once available.
                        var i_captured = i;
                        return function(x) {
                            resolutions[i_captured] = x;
                            if (--count === 0) deferred.resolve(resolutions);
                        };
                    })(),
                    function(r) { deferred.reject(r) }
                );
            }
        }
    } catch (e) {
        deferred.reject(e)
    }
    return deferred.promise;
}

首先判断传参的合理性，生成一个新的promise对象，利用遍历的方式给每个传入的promise的resolve方法后都追加了then方法，使得每个传入的promise执行then方法后凑执行判断逻辑，当计数count的flag为0的时候，所有promise resolve完成，调用新promise对象的resolve方法，传入新promise的reject方法作为then方法reject参数。使得所有promise的reject函数被调用时都会走到新promise对象的reject，最后返回新生成的promise。

Summary

Promise的状态和核心变量均托管到公共的作用域去维护，通过数组的push方法去添加Promise自定的resolve和reject方法。并将resolve和reject方法的执行加入微服务队列中，等到resolve方法被调用时执行resolve(value)方法进行调用。为了实现promise的循环嵌套调用，在每次处理value之前将处理逻辑之上包裹了一层新的promise逻辑，类似(new promise()).then(resolve(value))，思路如下。

</>复制代码 
var ref = function (value) {
    if (value && value.then)
        return value;
    return {
        then: function (callback) {
            // 实例化一个新的promise
            var result = defer();
            // 进入宏任务队列
            enqueue(function () {
                result.resolve(callback(value));
            });
            return result.promise;
        }
    };
};

Reference

promise设计思想：https://github.com/kriskowal/...

JavaScript执行机制：https://www.jianshu.com/p/17c...

GPU云服务器云服务器源码google v8 jquery_promise实现 php实现搜索引擎 jdk实现WebRTC语音引擎

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

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

从JS引擎理解Await b()与Promise.then(b)的堆栈处理

摘要：对于引擎来说，两者获取堆栈的方式是不同的。对于引擎来说，堆栈信息附加在了函数所返回的并在链中传递，这样函数也能在需要的时候获取堆栈信息。使用可以实时监控线上应用的错误，并获取完整的堆栈信息。译者按： Async/Await真的只是简单的语法糖吗？No！原文：Asynchronous stack traces: why await beats .then() 作者: Math...

ziwenxie 2019-08-23 10:48 评论0 收藏0
Promisify 的源码解析

摘要：参考文档升级后的函数回调参数问题中的使用方法和还是不一样的源码讲解的内部机制优化相关内容文章官方文档简述使用过的都知道这个方法的作用，通过该方法会让形式的函数风格转换成方法，可以认为是一颗语法糖，例如接下来我们就分析一下这个的内部流程。参考文档升级bluebird 3后Promise.promisify的函数回调参数问题：3中的使用方法和2还是不一样的 How does Bl...

gougoujiang 2019-08-20 14:35 评论0 收藏0
2017文章总结

摘要：欢迎来我的个人站点性能优化其他优化浏览器关键渲染路径开启性能优化之旅高性能滚动及页面渲染优化理论写法对压缩率的影响唯快不破应用的个优化步骤进阶鹅厂大神用直出实现网页瞬开缓存网页性能管理详解写给后端程序员的缓存原理介绍年底补课缓存机制优化动欢迎来我的个人站点性能优化其他优化浏览器关键渲染路径 - 开启性能优化之旅高性能滚动 scroll 及页面渲染优化理论 | HTML写法...

dailybird 2019-08-01 18:28 评论0 收藏0
2017文章总结

摘要：欢迎来我的个人站点性能优化其他优化浏览器关键渲染路径开启性能优化之旅高性能滚动及页面渲染优化理论写法对压缩率的影响唯快不破应用的个优化步骤进阶鹅厂大神用直出实现网页瞬开缓存网页性能管理详解写给后端程序员的缓存原理介绍年底补课缓存机制优化动欢迎来我的个人站点性能优化其他优化浏览器关键渲染路径 - 开启性能优化之旅高性能滚动 scroll 及页面渲染优化理论 | HTML写法...

hellowoody 2019-08-22 14:02 评论0 收藏0

发表评论

登陆后可评论

0条评论

plokmju88

男|高级讲师

我要关注我要私信

TA的文章

resnet18

阅读 785·2023-04-26 01:42
#黑五#webplot：德国/英国VPS/虚拟主机高达75%折扣，年付£6.49起，独立服务器£69

阅读 3306·2021-11-22 11:56
codeql 代码审计

阅读 2508·2021-10-08 10:04
RUNIDC：香港E3服务器$30/月起;台湾E3服务器$50/月起

阅读 982·2021-09-24 10:37
图片 + 未知宽高 + 垂直居中

阅读 3240·2019-08-30 15:52
css中那些需要组合、互斥和特别注意的属性

阅读 1948·2019-08-29 13:44
详解 CSS 属性 - :before && :after

阅读 580·2019-08-28 17:51
antd 树形组件常用工具

阅读 2243·2019-08-26 18:26

资讯专栏INFORMATION COLUMN

上云采购季！| 2核2G4M爆款云服务器低至59元/年，更有多台、长期优惠，快来选购！

从Google V8引擎剖析Promise实现

</>复制代码

</>复制代码

</>复制代码

</>复制代码

</>复制代码

</>复制代码

</>复制代码

</>复制代码

</>复制代码

</>复制代码

</>复制代码

</>复制代码

</>复制代码

</>复制代码

</>复制代码

</>复制代码

</>复制代码

相关文章

**从JS引擎理解Await b()与Promise.then(b)的堆栈处理**

Promisify 的源码解析

2017文章总结

2017文章总结

发表评论

0条评论

plokmju88

男|高级讲师

TA的文章

resnet18

#黑五#webplot：德国/英国VPS/虚拟主机高达75%折扣，年付£6.49起，独立服务器£69

codeql 代码审计

RUNIDC：香港E3服务器$30/月起;台湾E3服务器$50/月起

图片 + 未知宽高 + 垂直居中

css中那些需要组合、互斥和特别注意的属性

详解 CSS 属性 - :before && :after

antd 树形组件常用工具

最新活动