js调用napi的数据,对于简单的数据类型,只需要napi返回对应类型的napi_value数据即可 (详情参照napi数据类型类型与同步调用)。但是对于一些复杂的数据类型(如我们常用c的类对象),是不能直接返回一个napi_value数据的。这时我们需要对这些数据进行一系列操作后将其导出,这样js才能使用导出后的对象。
本文以导出类对象为例来说明napi导出对象的具体过程。
类对象导出的具体过程:
这里我们以导出NapiTest类为例说明导出一个类的实现过程
NapiTest类主要实现了接收js设置的数据并将该数据返回到js应用中,具体定义如下(NapiTest.h):
class NapiTest {
public:
NapiTest() : mEnv(nullptr), mRef(nullptr) {
}
~NapiTest();
static napi_value Create(napi_env env, napi_callback_info info); // 创建NapiTest类的实体,并将实体返回到应用端,该方法为js创建一个类实体,因此需要将该接口对外导出
static napi_value Init(napi_env env, napi_value exports); // 初始化js类并设置对应属性并将其导出。
private:
static napi_value SetMsg(napi_env env, napi_callback_info info); // 设置数据,此方法给到js直接调用,因此需要将该接口对外导出
static napi_value GetMsg(napi_env env, napi_callback_info info); // 获取数据,此方法给到js直接调用,因此需要将该接口对外导出
static napi_value Constructor(napi_env env, napi_callback_info info); // 定义js结构体时实际的构建函数
static void Destructor(napi_env env, void *nativeObject, void *finalize); // 释放资源的函数(类似类的析构函数)
static napi_ref sConstructor_; // 生命周期变量
static std::string _msg; // 设置和获取数据的变量
napi_env mEnv = nullptr; // 记录环境变量
napi_ref mRef = nullptr; // 记录生命周期变量
};
napi_property_descriptor desc[] = {
{ "getMsg", nullptr, NapiTest::GetMsg, nullptr, nullptr, nullptr,
napi_default, nullptr },
{ "setMsg", nullptr, NapiTest::SetMsg, nullptr, nullptr, nullptr,
napi_default, nullptr },
}
napi_value mConstructor = nullptr;
if (napi_define_class(env, NAPI_CLASS_NAME, NAPI_AUTO_LENGTH, Constructor, nullptr,
sizeof(desc) / sizeof(desc[0]), desc, &mConstructor) != napi_ok) {
return nullptr;
}
使用到函数说明:
napi_status napi_define_class(napi_env env,
const char* utf8name,
size_t length,
napi_callback constructor,
void* data,
size_t property_count,
const napi_property_descriptor* properties,
napi_value* resu
功能:将c类定义为js的类
参数说明:
返回:调用成功返回0,失败返回其他
当js应用通过new方法获取类对象的时候,此时会调用 napi_define_class 中设置 constructor 回调函数,该函数实现方法如下:
napi_value NapiTest::Constructor(napi_env env, napi_callback_info info)
{
napi_value undefineVar = nullptr, thisVar = nullptr;
napi_get_undefined(env, &undefineVar);
if (napi_get_cb_info(env, info, nullptr, nullptr, &thisVar, nullptr) ==
napi_ok && thisVar != nullptr) {
// 创建NapiTest 实例
NapiTest *reference = new NapiTest(env);
// 绑定实例类创建NapiTest到导出的对象result
if (napi_wrap(env, thisVar, reinterpret_cast<void *>(reference),
NapiTest::Destructor, nullptr, &(reference->mRef)) == napi_ok) {
return thisVar;
}
return thisVar;
}
return undefineVar;
}
其中NapiTest::Destructo方法是用来释放创建的对象:
void NapiTest::Destructor(napi_env env, void *nativeObject, void *finalize)
{
NapiTest *test = reinterpret_cast<NapiTest*>(nativeObject);
test->~NapiTest();
}
使用到函数说明:
napi_status napi_wrap(napi_env env,
napi_value js_object,
void* native_object,
napi_finalize finalize_cb,
void* finalize_hint,
napi_ref* result);
功能:将c类实例绑定到js对象,并关联对应的生命周期
参数说明:
返回:调用成功返回0,失败返回其他
if (napi_create_reference(env, mConstructor , 1, &sConstructor_) != napi_ok) {
return nullptr;
}
mConstructor 定义js类时返回的代表类的构造函数的数据
sConstructor_ 生命周期变量
if (napi_set_named_property(env, exports, NAPI_CLASS_NAME, constructor) != napi_ok) {
return nullptr;
}
通过以上步骤,我们基本实现了NapiTest这个类的导出。
注意:以上实现都是在类的Init方法中,我们只需要在NAPI注册的接口中调用该Init即可。
js应用除了调用new方法获取类的实例外,我们也可以提供一些方法让js应用获取对应的类的实例,如在我们的NapiTest类中,我们定义了一个Create方法,该方法实现了NapiTest类实例的获取。具体实现如下:
napi_value NapiTest::Create(napi_env env, napi_callback_info info) {
napi_status status;
napi_value constructor = nullptr, result = nullptr;
// 获取生命周期变量
status = napi_get_reference_value(env, sConstructor_, &constructor);
// 创建生命周期内的实例对象并将其返回
status = napi_new_instance(env, constructor, 0, nullptr, &result);
auto napiTest = new NapiTest();
// 绑定实例类创建NapiTest到导出的对象result
if (napi_wrap(env, result, reinterpret_cast<void *>(napiTest), Destructor,
nullptr, &(napiTest->mRef)) == napi_ok) {
return result;
}
return nullptr;
}
在napi接口的注册中将该方法以接口的方式导出,应用层就可以直接调用该接口并获取到该类的实例对。
特别说明:如果单独实现了一个类实例获取的方法,那么js的类构造函数可以不实现。
我们已helloworld为列,
static napi_module demoModule = {
.nm_version =1,
.nm_flags = 0,
.nm_filename = nullptr,
.nm_register_func = Init,
.nm_modname = "hello",
.nm_priv = ((void*)0),
.reserved = { 0 },
};
EXTERN_C_START
static napi_value Init(napi_env env, napi_value exports)
{
napi_property_descriptor desc[] = {
{ "create", nullptr, NapiTest::Create, nullptr, nullptr, nullptr, napi_default, nullptr } // 单独导出 create 方法,js应用可以直接调用Create方法获取类实例
};
napi_define_properties(env, exports, sizeof(desc) / sizeof(desc[0]), desc);
return NapiTest::Init(env, exports); // 导出类以及类的方法
}
EXTERN_C_END
// 注册 hello模块
extern "C" __attribute__((constructor)) void RegisterHelloModule(void)
{
napi_module_register(&demoModule);
}
至此,我们完成了整个napi接口注册以及napi类的导出。
在使用该NAPI的时候,我们需要在ts文件(路径在\entry\src\main\cpp\types\libentry\index.d.ts),声明以下内容:
export const create : () => NapiTest;
export class NapiTest {
setMsg(msg: string): void;
getMsg(): string;
}
该文件申明了NAPI接口中导出的方法和类
新建一个helloworld的ETS工程,该工程中包含一个按键,我们可以通过该按键进行数据的在native c中存储和获取
import testNapi from "libentry.so";
struct Index {
@State message: string = 'Hello World'
@State flag:number = 0
tt = testNapi.create();
build() {
Row() {
Column() {
Text(this.message)
.fontSize(50)
.fontWeight(FontWeight.Bold)
.onClick(() => {
})
}
.width('100%')
}
.height('100%')
}
if (this.falg == 0) {
this.flag = 2
this.tt.setMsg("1+1")
} else {
this.flag = 0
this.tt.setMsg("1-1")
}
console.info("[NapiTest]:" + this.tt.getMsg() + " = " + this.flag);
通过IDE LOG信息可以查看到,当按多次下按钮时,出现交替以下信息:
02200/JsApp: [NapiTest]: 1+1 = 2
02200/JsApp: [NapiTest]: 1-1 = 0
如果你觉得这篇内容对你还蛮有帮助,我想邀请你帮我三个小忙:
原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。
如有侵权,请联系 cloudcommunity@tencent.com 删除。
原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。
如有侵权,请联系 cloudcommunity@tencent.com 删除。
扫码关注腾讯云开发者
领取腾讯云代金券
Copyright © 2013 - 2025 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号:粤B2-20090059 深公网安备号 44030502008569
腾讯云计算(北京)有限责任公司 京ICP证150476号 | 京ICP备11018762号 | 京公网安备号11010802020287
Copyright © 2013 - 2025 Tencent Cloud.
All Rights Reserved. 腾讯云 版权所有