OpenHarmony源碼剖析之ACE（JavaScript運(yùn)行環(huán)境初始化）

張亮亮

深圳開鴻數(shù)字產(chǎn)業(yè)發(fā)展有限公司

簡(jiǎn)介

JS UI 框架引擎ACE全稱 Ability Cross-platform Environment，是 OpenHarmony 標(biāo)準(zhǔn)系統(tǒng)上的UI框架。ACE：結(jié)合了 OpenHarmony 系統(tǒng)的基礎(chǔ)組件 Ability，開源 jsframework 框架，開源 js 引擎 quickjs，開源跨平臺(tái) UI 框架 flutter，開源渲染引擎 skia 以及各種平臺(tái)能力 API 等共同構(gòu)筑了 OpenHarmony 標(biāo)準(zhǔn)系統(tǒng) javacript 應(yīng)用開發(fā)的基礎(chǔ)。

1.1 OpenHarmony 架構(gòu)圖

1.2 ACE UI框架引擎圖

1.3 ACE 主要構(gòu)成

1. JavaScript前端框架

目前 OpenHarmony 標(biāo)準(zhǔn)系統(tǒng)采用主流的類 Web 范式，對(duì)開源的 Weex 框架中的 jsframework 做定制化，采用 ts 開發(fā)，主要包括編程模型 MVVM、組件、API、頁(yè)面路由以及事件處理。

2. JavaScript引擎

目前 OpenHarmony 標(biāo)準(zhǔn)系統(tǒng)使用的是開源 quickjs 引擎，提供 JS 語言運(yùn)行時(shí)和執(zhí)行上下文，提供 js 的解析和 jsframework 的加載。

3. 中間轉(zhuǎn)換層

中間轉(zhuǎn)換層也就是 JS 橋接層，實(shí)現(xiàn)前端開發(fā)框架到 UI 后端引擎和 JS 引擎的對(duì)接。

4. 聲明式UI后端引擎

由 C++構(gòu)建的UI后端引擎，包括 UI 組件、布局視圖、動(dòng)畫事件、自繪制選軟管線。

5. 渲染引擎

目前 OpenHarmony 標(biāo)準(zhǔn)系統(tǒng)復(fù)用了開源跨平臺(tái) UI 框架 flutter 引擎提供基礎(chǔ)的圖形渲染能力。

6. 平臺(tái)適配層

目前 OpenHarmony 標(biāo)準(zhǔn)系統(tǒng)的適配層完成了 OpenHarmony 平臺(tái)和 IDE 的 previewer 的適配，將平臺(tái)依賴聚焦到平臺(tái)相關(guān)的畫布、通用線程以及事件處理機(jī)制等少數(shù)接口上，為跨平臺(tái)提供相應(yīng)的基礎(chǔ)設(shè)施，實(shí)現(xiàn)跨平臺(tái)一致化的 UI 渲染。

7. 能力擴(kuò)展層

為擴(kuò)展 ACE 能力提供的插件機(jī)制，平臺(tái)其他子系統(tǒng)可以利用插件機(jī)制開發(fā)相關(guān)能力的 js 接口，為應(yīng)用層提供相應(yīng)的能力支持。通過 napi 提供引擎無關(guān)的插件實(shí)現(xiàn)機(jī)制，保證接口的 ABI 兼容性。

基礎(chǔ)知識(shí)

2.1 代碼結(jié)構(gòu)

/foundation/ace/ace_engine├── adapter                       # 平臺(tái)適配目錄│   ├── common|   ├── ohos                      # ohos平臺(tái)適配目錄│   └── preview                   # IDE preview平臺(tái)適配目錄├── frameworks                    # 框架代碼│   ├── base                      # 基礎(chǔ)庫(kù)│   ├── bridge                    # 前后端對(duì)接層│   └── core                      # 聲明式UI后端引擎目錄/third_party/jsframework          # JavaScript前端框架/third_party/quickjs              # JavaScript引擎/third_party/flutter#flutterengine提供跨平臺(tái)自渲染引擎

2.2 ACE框架類圖

（點(diǎn)擊圖片查看高清大圖） 2.3 線程模型

ACE JS 應(yīng)用啟動(dòng)時(shí)會(huì)創(chuàng)建一系列線程，形成獨(dú)立的線程模型，以實(shí)現(xiàn)高性能的渲染流程。

Platform線程：當(dāng)前平臺(tái)的主線程，也就是應(yīng)用的主線程，主要負(fù)責(zé)平臺(tái)層的交互、應(yīng)用生命周期以及窗口環(huán)境的創(chuàng)建。

JS線程：JS 前端框架的執(zhí)行線程，應(yīng)用的 JS 邏輯以及應(yīng)用 UI 界面的解析構(gòu)建都在該線程執(zhí)行。

UI線程：引擎的核心線程，組件樹的構(gòu)建以及整個(gè)渲染管線的核心邏輯都在該線程：包括渲染樹的構(gòu)建、布局、繪制以及動(dòng)畫調(diào)度。

GPU線程：現(xiàn)代的渲染引擎，為了充分發(fā)揮硬件性能，都支持 GPU 硬件加速，在該線程上，會(huì)通過系統(tǒng)的窗口句柄，創(chuàng)建 GPU 加速的 OpenGL 環(huán)境，負(fù)責(zé)將整個(gè)渲染樹的內(nèi)容光柵化，直接將每一幀的內(nèi)容渲染合成到該窗口的 Surface 上并送顯。

IO線程：主要為了異步的文件 IO 讀寫，同時(shí)該線程會(huì)創(chuàng)建一個(gè)離屏的 GL 環(huán)境，這個(gè)環(huán)境和 GPU 線程的 GL 環(huán)境是同一個(gè)共享組，可以共享資源，圖片資源解碼的內(nèi)容可直接在該線程上傳生成 GPU 紋理，實(shí)現(xiàn)更高效的圖片渲染。

Javascript運(yùn)行環(huán)境初始化

3.1 時(shí)序圖

（點(diǎn)擊圖片查看高清大圖）

3.2 源碼解析

1.OnStart()

• AceAbility繼承自Ability，當(dāng)應(yīng)用啟動(dòng)時(shí)首先應(yīng)用程序框架會(huì)調(diào)用AceAbility的生命周期函數(shù)OnStart()；

• 通過Ability的api獲取Hap包的路徑，通過讀取配置文件manifest.json獲取應(yīng)用程序配置的前端的類型；

• 當(dāng)前我們只關(guān)注JS前端，目前支持的前端類型包括enum class FrontendType { JSON, JS, JS_CARD, DECLARATIVE_JS }；

• 根據(jù)前端類型調(diào)用ACE核心聚合類AceContainer的靜態(tài)方法CreateContainer，這個(gè)類是ACE框架平臺(tái)適配層的核心類，接下來的前端核心類和JS引擎的創(chuàng)建都是在其中完成的。

//foundationaceace_engineadapterpreviewentranceace_ability.cppvoid AceAbility::OnStart(const Want& want){    ...        //獲取打包的js bundle文件，取出配置文件，獲取前端類型    auto packagePathStr = GetBundleCodePath();    auto moduleInfo = GetHapModuleInfo();    if (moduleInfo != nullptr) {        packagePathStr += "/" + moduleInfo->name + "/";    }    FrontendType frontendType = GetFrontendTypeFromManifest(packagePathStr);
    // create container    //創(chuàng)建AceContainer：內(nèi)部初始化時(shí)創(chuàng)建了js線程，load了js engine，創(chuàng)建了JsFrontend    Platform::CreateContainer(        abilityId_, frontendType, this,        std::make_unique([this]() {            TerminateAbility();        }));    ...    ...
    //運(yùn)行page    Platform::RunPage(        abilityId_, Platform::GetContainer(abilityId_)->GeneratePageId(),        parsedPageUrl, want.GetStringParam(START_PARAMS_KEY));
    ...}

2. CreateContainer

• 在AceContainer::CreateContainer中，首先創(chuàng)建了AceContainer對(duì)象；

• 在構(gòu)造函數(shù)中創(chuàng)建了FlutterTaskerExecutor對(duì)象用于多線程的任務(wù)管理；

• 此處主要關(guān)注JS線程的創(chuàng)建和初始化，在InitJsThread()中創(chuàng)建了JS線程并獲取保存了jsRunner_用于JS任務(wù)的派發(fā)；

//foundationaceace_engineadapterpreviewentranceace_container.cppvoid AceContainer::CreateContainer(int32_t instanceId, FrontendType type, AceAbility* aceAbility,    std::unique_ptr callback){    auto aceContainer = AceType::MakeRefPtr(instanceId, type, aceAbility, std::move(callback));    AceEngine::Get().AddContainer(instanceId, aceContainer);    auto front = aceContainer->GetFrontend();    if (front) {        front->UpdateState(Frontend::ON_CREATE);        front->SetJsMessageDispatcher(aceContainer);    }}
AceContainer::AceContainer(int32_t instanceId, FrontendType type, AceAbility* aceAbility,    std::unique_ptr callback) : instanceId_(instanceId), type_(type), aceAbility_(aceAbility){    ACE_DCHECK(callback);    //創(chuàng)建和初始化FlutterTaskerExecutor用于封裝管理Flutter ACE中涉及的多個(gè)線程：platform，UI，JS，GPU，IO，統(tǒng)一post任務(wù)到各線程執(zhí)行    auto flutterTaskExecutor = Referenced::MakeRefPtr();    //初始化platform線程，將flutter platform線程的TaskerRunner適配到ohos平臺(tái)主線程的EventRunner    flutterTaskExecutor->InitPlatformThread();    //初始化JS線程，這個(gè)線程用于解析JS，不歸flutter管理，因此是單獨(dú)在ACE里使用的    flutterTaskExecutor->InitJsThread();    //taskExector_封裝了所有線程任務(wù)調(diào)度的接口，因此會(huì)傳給Frontend用于JS前端解析任務(wù)和PipelineContext后端渲染UI和GPU IO相關(guān)    taskExecutor_ = flutterTaskExecutor;    if (type_ != FrontendType::DECLARATIVE_JS) {        //zll:初始化前端        InitializeFrontend();    }
    platformEventCallback_ = std::move(callback);}
void FlutterTaskExecutor::InitJsThread(bool newThread){    //創(chuàng)建并初始化JS線程，獲取保存js線程的TaskRunner    //JS線程是ACE平臺(tái)特有，不通過flutter創(chuàng)建管理    if (newThread) {        jsThread_ = std::make_unique(GenJsThreadName());        jsRunner_ = jsThread_->GetTaskRunner();    } else {        jsRunner_ = uiRunner_;    }}

3. JsFrontend

• 完成JS線程的初始化后，如果前端類型不是DECLARATIVE_JS，會(huì)調(diào)用InitializeFrontend()對(duì)前端進(jìn)行初始化。

• 首先創(chuàng)建前端對(duì)象，F(xiàn)rontend::Create定義在js_frontend.cpp中，創(chuàng)建的是JsFrontend實(shí)例；

• 然后通過JsEngineLoader::Get()動(dòng)態(tài)加載QjsEngineLoader；

• 再通過QjsEngineLoader創(chuàng)建QjsEngine并設(shè)置給JsFrontend；最后對(duì)JsFrontend對(duì)象做初始化；

• JsFrontend是ACE框架從后端進(jìn)入前端的唯一入口，AceAbility、AceContainer和JsFrontend是一一對(duì)應(yīng)的關(guān)系；

//foundationaceace_engineadapterpreviewentranceace_container.cppvoid AceContainer::InitializeFrontend(){    if (type_ == FrontendType::JS) {        //目前Frontend::Create定義在js_frontend.cpp中，創(chuàng)建的是JsFrontend實(shí)例        frontend_ = Frontend::Create();        auto jsFrontend = AceType::DynamicCast(frontend_);        //創(chuàng)建并初始化js engine，此處是通過dlopen加載的qjs engine管理對(duì)象        jsFrontend->SetJsEngine(Framework::Get().CreateJsEngine(instanceId_));        ...    } else if (type_ == FrontendType::DECLARATIVE_JS) {        ...    } else {        ...    }    ACE_DCHECK(frontend_);    //初始化前端和js engine    frontend_->Initialize(type_, taskExecutor_);}

4. QjsEngine

• 接下來我們繼續(xù)分析一下JS引擎管理對(duì)象的創(chuàng)建；

• 首先通過dlopen動(dòng)態(tài)加載libace_engine_qjs.z.so通過入口函數(shù)創(chuàng)建獲取QjsEngineLoader單例對(duì)象；

• 然后通過QjsEngineLoader::CreateJsEngine()創(chuàng)建QjsEngine；

//foundationaceace_engineframeworksridgejs_frontendenginecommonjs_engine_loader.cpp//"libace_engine_qjs.z.so"動(dòng)態(tài)庫(kù)的入口，在qjs_engine_loader.cpp中定義constexpr char JS_ENGINE_ENTRY[] = "OHOS_ACE_GetJsEngineLoader";constexpr char QUICK_JS_ENGINE_SHARED_LIB[] = "libace_engine_qjs.z.so";...const char* GetSharedLibrary(){    return QUICK_JS_ENGINE_SHARED_LIB;}JsEngineLoader& GetJsEngineLoader(const char* sharedLibrary){    void* handle = dlopen(sharedLibrary, RTLD_LAZY);    ...    //    auto loader = reinterpret_cast(entry());    ...
    return *loader;}...//通過加載動(dòng)態(tài)鏈接庫(kù)的形式獲取qjs橋接模塊的入口函數(shù)并創(chuàng)建QjsEngineLoaderJsEngineLoader& JsEngineLoader::Get(){    static JsEngineLoader& instance = GetJsEngineLoader(GetSharedLibrary());    return instance;}
//foundationaceace_engineframeworksridgejs_frontendenginequickjsqjs_engine_loader.cppRefPtr QjsEngineLoader::CreateJsEngine(int32_t instanceId) const{    return AceType::MakeRefPtr(instanceId);}

5. JS線程

• 在完成了QjsEngine的創(chuàng)建并設(shè)置給JsFrontend后，調(diào)用JsFrontend::Initialize()；

• 這里主要完成了FrontendDelegateImpl對(duì)象的創(chuàng)建和初始化將對(duì)JS引擎的相關(guān)操作委派給這個(gè)對(duì)象；

• 以及Post JS引擎初始化的任務(wù)到JS線程的TaskRunner的message queue；

//foundationaceace_engineframeworksridgejs_frontendjs_frontend.cppbool JsFrontend::Initialize(FrontendType type, const RefPtr& taskExecutor){    LOGI("JsFrontend initialize begin.");    type_ = type;    ACE_DCHECK(type_ == FrontendType::JS);    //創(chuàng)建并初始化FrontendDelegate對(duì)象，具體實(shí)現(xiàn)為FrontendDelegateImpl    InitializeFrontendDelegate(taskExecutor);    //在JS線程初始化js engine，真正的啟動(dòng)JS引擎運(yùn)行時(shí)并創(chuàng)建上下文    taskExecutor->PostTask(        [weakEngine = WeakPtr(jsEngine_), delegate = delegate_] {            auto jsEngine = weakEngine.Upgrade();            if (!jsEngine) {                return;            }            jsEngine->Initialize(delegate);        },        TaskExecutor::JS);
    LOGI("JsFrontend initialize end.");    return true;}

6. jsframework

• 在JS線程執(zhí)行QjsEngine對(duì)象的初始化，初始化JS運(yùn)行環(huán)境；

• 初始化JS引擎運(yùn)行時(shí)上下文和初始化JavaScript框架層jsframework；

//foundationaceace_engineframeworksridgejs_frontendenginequickjsqjs_engine.cppbool QjsEngine::Initialize(const RefPtr& delegate){    ACE_SCOPED_TRACE("QjsEngine::Initialize");    LOGI("Initialize");
    JSRuntime* runtime = nullptr;    JSContext* context = nullptr;
    // put JS_NewContext as early as possible to make stack_top in context    // closer to the top stack frame pointer of JS thread.    runtime = JS_NewRuntime();    if (runtime != nullptr) {        context = JS_NewContext(runtime);    }
    ...
    engineInstance_ = AceType::MakeRefPtr(delegate, instanceId_);    return engineInstance_->InitJsEnv(runtime, context);}
bool QjsEngineInstance::InitJsEnv(JSRuntime* runtime, JSContext* context){    ...    context_ = context;    //1.初始化js運(yùn)行時(shí),上下文    if (!InitJsContext(context_, MAX_STACK_SIZE, instanceId_, this)) {        LOGE("Qjs cannot allocate JS context");        EventReport::JS_ENGINE_INIT_ERR);        JS_FreeRuntime(runtime_);        return false;    }    ...    //2.加載JS Framework，初始化JS前端框架    //加載jsframework，js_framework和js_framework_size是quickjs編譯器編譯jsframework的ts生成的c文件    //quickjs通過JS_ReadObject讀取生成的cbytecode，并通過JS_EvalFunction(ctx, obj)執(zhí)行相應(yīng)的函數(shù)    //在這里最終調(diào)用的函數(shù)是jsframework/runtime/preparation/index.ts中的initFramework()函數(shù)    JSValue retVal = LoadJsFramework(GetQjsContext(), js_framework, js_framework_size, instanceId_);    bool result = JS_IsException(retVal) ? false : true;    if (context) {        JS_FreeValue(context, retVal);    }    ...
    return result;}

7. ACE模塊

• 初始化JS引擎運(yùn)行時(shí)上下文是在InitJsContext完成；

• 其中初始化Ace模塊并將模塊導(dǎo)入JS運(yùn)行時(shí)上下文中，為jsframework框架層提供了ACE功能相關(guān)的接口；

• jsframework可以通過調(diào)用ACE模塊的接口完成Page上Dom元素到后端聲明式UI元素節(jié)點(diǎn)的創(chuàng)建；

• 同時(shí)往JS運(yùn)行時(shí)上下文全局對(duì)象掛載了日志打印的函數(shù)用于對(duì)接平臺(tái)日志打印功能；

//foundationaceace_engineframeworksridgejs_frontendenginequickjsqjs_engine.cpp//ace模塊向js context暴露的函數(shù)，（js函數(shù)名，參數(shù)個(gè)數(shù)，對(duì)應(yīng)的C函數(shù)）const JSCFunctionListEntry JS_ACE_FUNCS[] = {    JS_CFUNC_DEF_CPP("domCreateBody", 5, JsDomCreateBody),    JS_CFUNC_DEF_CPP("domAddElement", 9, JsDomAddElement),    JS_CFUNC_DEF_CPP("updateElementAttrs", 3, JsUpdateElementAttrs),    JS_CFUNC_DEF_CPP("updateElementStyles", 3, JsUpdateElementStyles),    JS_CFUNC_DEF_CPP("onCreateFinish", 0, JsOnCreateFinish),    JS_CFUNC_DEF_CPP("onUpdateFinish", 0, JsOnUpdateFinish),    JS_CFUNC_DEF_CPP("removeElement", 2, JsRemoveElement),    JS_CFUNC_DEF_CPP("callNative", 1, JsCallNative),    JS_CFUNC_DEF_CPP("callComponent", 3, JsCallComponent),    JS_CFUNC_DEF_CPP("loadIntl", 0, JsLoadIntl),    JS_CFUNC_DEF_CPP("loadLocaleData", 0, JsLoadLocaleData),#ifdef ENABLE_JS_DEBUG    JS_CFUNC_DEF_CPP("compileAndRunBundle", 4, JsCompileAndRunBundle),#endif};...
bool InitJsContext(JSContext* ctx, size_t maxStackSize, int32_t instanceId, const QjsEngineInstance* qjsEngineInstance){    ...        //將ace模塊注入到上下文中，使得jsframework可以通過注冊(cè)的接口調(diào)用ace的相關(guān)功能    // Inject ace native functions module    InitAceModules(ctx);
    JSValue globalObj, perfUtil;    globalObj = JS_GetGlobalObject(ctx);    perfUtil = JS_NewObject(ctx);
    InitJsConsoleObject(ctx, globalObj);
    JS_SetPropertyStr(ctx, perfUtil, "printlog", JS_NewCFunction(ctx, JsPerfPrint, "printlog", 0));    JS_SetPropertyStr(ctx, perfUtil, "sleep", JS_NewCFunction(ctx, JsPerfSleep, "sleep", 1));    JS_SetPropertyStr(ctx, perfUtil, "begin", JS_NewCFunction(ctx, JsPerfBegin, "begin", 1));    JS_SetPropertyStr(ctx, perfUtil, "end", JS_NewCFunction(ctx, JsPerfEnd, "end", 1));    JS_SetPropertyStr(ctx, globalObj, "perfutil", perfUtil);
    ...
    JSValue hiView;    hiView = JS_NewObject(ctx);    JS_SetPropertyStr(ctx, hiView, "report", JS_NewCFunction(ctx, JSHiViewReport, "report", 2));    JS_SetPropertyStr(ctx, globalObj, "hiView", hiView);
    JSValue i18nPluralRules;    i18nPluralRules = JS_NewObject(ctx);    JS_SetPropertyStr(ctx, i18nPluralRules, "select", JS_NewCFunction(ctx, JsPluralRulesFormat, "select", 1));    JS_SetPropertyStr(ctx, globalObj, "i18nPluralRules", i18nPluralRules);        //將ace模塊導(dǎo)入到cxt指定的js 上下文中    const char* str = "import * as ace from 'ace';
"                      "var global = globalThis;
"                      "global.ace = ace;
"#ifdef ENABLE_JS_DEBUG                      "global.compileAndRunBundle = ace.compileAndRunBundle;
"#endif                      "global.callNative = ace.callNative;
";
    if (JS_CALL_FAIL == CallEvalBuf(ctx, str, strlen(str), "", JS_EVAL_TYPE_MODULE, instanceId)) {        LOGW("Qjs created JS context but failed to init Ace modules!");    }
    JS_FreeValue(ctx, globalObj);    return true;}

8. 初始化完成

• 完成JS運(yùn)行時(shí)上下文初始化之后，緊接著加載初始化jsframework，為JS應(yīng)用程序提供javascript應(yīng)用框架；

• 這個(gè)地方使用quickjs的運(yùn)行bytecode的方法，在編譯時(shí)通過qjsc（quickjs編譯器）將jsframework編譯成c文件；

• c文件的內(nèi)容就是一個(gè)bytecode的組數(shù)和數(shù)組大小，指定了jsframework的入口函數(shù)；

• 在這里對(duì)應(yīng)jsframework/runtime/preparation/index.ts 中的initFramework()完成jsframework的初始化；

• jsframework初始化完成的工作主要包括掛載到j(luò)s運(yùn)行時(shí)上下文全局對(duì)象上提供給native調(diào)用的jsframework函數(shù)，注冊(cè)到j(luò)sframework的ACE提供的模塊及其中的方法和jsframework提供的與native一一對(duì)應(yīng)的組件及其方法；

//foundationaceace_engineframeworksridgejs_frontendenginequickjsqjs_engine.cppJSValue LoadJsFramework(JSContext* ctx, const uint8_t buf[], const uint32_t bufSize, int32_t instanceId){    ACE_SCOPED_TRACE("LoadJsFramework");
    LOGI("Qjs loading JS framework");    //等同于調(diào)用jsframework/runtime/preparation/index.ts 中的initFramework()    JSValue ret = CallReadObject(ctx, buf, bufSize, true, instanceId);    if (JS_IsException(ret)) {        LOGD("Qjs loading JSFramework failed!");        QjsUtils::JsStdDumpErrorAce(ctx, JsErrorType::LOAD_JS_FRAMEWORK_ERROR, instanceId);    }
    return ret;}

//third_partyjsframework
untimepreparationinit.tsexport function initFramework(): void {  for (const serviceName in i18n) {    service.register(serviceName, i18n[serviceName]);  }  for (const serviceName in dpi) {    service.register(serviceName, dpi[serviceName]);  }  //jsframework提供的可供Ace native在QjsEngine對(duì)象中調(diào)用的TS方法  const globalMethods: GlobalInterface = {    'createInstance': globalApi.createInstance,    'registerModules': globalApi.registerModules,    'appDestroy': globalApi.appDestroy,    'appError': globalApi.appError,    'destroyInstance': globalApi.destroyInstance,    'getRoot': globalApi.getRoot,    'callJS': globalApi.callJS  };  //注冊(cè)modules，這些modules是ACE module提供的，調(diào)用這些模塊的方法，會(huì)通過調(diào)用注冊(cè)到qjs_engine的ace模塊中的callNative方法  //會(huì)最終通過ace module的callNative調(diào)用到qjs_engine中的JsCallNative-->JsHandleModule-->然后調(diào)用對(duì)應(yīng)的native方法  // registerModules and registerComponents  ModulesInfo.forEach(modules => {    globalMethods['registerModules'](modules);  });    //注冊(cè)components組件，對(duì)組件方法的調(diào)用，最終會(huì)通過ace module的callComponent調(diào)用到qjs_engine中的JsCallComponent  ComponentsInfo.forEach((name) => {    if (name && name.type && name.methods) {      NativeElementClassFactory.createNativeElementClass(        name.type,        name.methods      );    }  });  //全局方法，這些方法可以被Qjs engine通過JS_GetPropertyStr(ctx, globalObj, "methodNamge")獲取并調(diào)用，從而實(shí)現(xiàn)了從native到j(luò)s的調(diào)用  for (const methodName in globalMethods) {    global[methodName] = (...args: any) => {      const res: any = globalMethods[methodName](...args);      if (res instanceof Error) {        Log.error(res.toString());      }      return res;    };  }}

總結(jié)

以上內(nèi)容首先對(duì) OpenHarmony 標(biāo)準(zhǔn)系統(tǒng)上 JS UI 框架引擎 ACE 的邏輯架構(gòu)及相關(guān)模塊進(jìn)行了簡(jiǎn)單的介紹，給出了 ACE 架構(gòu)中相關(guān)模塊涉及的部分類的類圖，結(jié)合本次重點(diǎn)分析的 Javascript 運(yùn)行環(huán)境初始化的時(shí)序圖詳細(xì)分析了 Javascript 運(yùn)行環(huán)境初始化的整個(gè)流程。

本文首發(fā)自：https://harmonyos.51cto.com/posts/7908
編輯：jq