HarmonyOS NEXT函数和自定义构建函数

函数实例

typescript 复制代码

// 有名函数
function add(x:number, y:number) {
  return x + y;
}
console.log("add",add(1,2)); 

// 匿名函数（lambda表达式）
let myAdd = (x:number, y:number) => {
  return x + y;
};
console.log("myAdd",myAdd(1,2)); 

//typescript是如何确保输入输出的准确性
//1.入参指定数据类型
console.log("add2",add(1,'2')); 
//2.函数指定数据类型
function newAdd(x:number, y:number):number {
  return "newAdd："+x+y;
}
console.log("newAdd",newAdd(1,2)); 

//可选参数
function buildName(firstName: string, lastName?: string):string {
    if (lastName)
        return firstName + ' ' + lastName;
    else
        return firstName;
}
let result1 = buildName('Bob');
let result2 = buildName('Bob', 'Adams');
console.log("result1",result1);
console.log("result2",result2);

//剩余参数，个数不限的可选参数。 可以一个都没有，也可以有任意个。使用省略号（ ...）进行定义
function getEmployeeName(firstName: string, ...restOfName: string[]):string {
  return firstName + ' ' + restOfName.join(' ');
}
let employeeName = getEmployeeName('Joseph', 'Samuel', 'Lucas', 'MacKinzie');
console.log("employeeName",employeeName);

自定义构建函数 ArkUI提供了一种轻量的UI元素复用机制@Builder，其内部UI结构固定，仅与使用方进行数据传递，开发者可以将重复使用的UI元素抽象成一个方法，在build方法里调用。

为了简化语言，@Builder装饰的函数也称为"自定义构建函数"。

@Builder装饰器有两种使用方式，分别是定义在自定义组件内部的私有自定义构建函数和定义在全局的全局自定义构建函数。

定义在自定义组件内部的私有自定义构建函数：

arkts 复制代码

@Entry
@Component
struct BuilderDemo {
  @Builder
  showTextBuilder() {
    Text('Hello World')
      .fontSize(30)
      .fontWeight(FontWeight.Bold)
  }
  @Builder
  showTextValueBuilder(param: string) {
    Text(param)
      .fontSize(30)
      .fontWeight(FontWeight.Bold)
  }
  build() {
    Column() {
      // 无参数
      this.showTextBuilder()
      // 有参数
      this.showTextValueBuilder('Hello @Builder')
    }
  }
}

定义在全局的全局自定义构建函数

arkts 复制代码

@Builder
function showTextBuilder() {
  Text('Hello World')
    .fontSize(30)
    .fontWeight(FontWeight.Bold)
}
@Entry
@Component
struct BuilderDemo {
  build() {
    Column() {
      showTextBuilder()
    }
  }
}

参数传递规则自定义构建函数的参数传递有按值传递和按引用传递两种，均需遵守以下规则：

参数的类型必须与参数声明的类型一致，不允许undefined、null和返回undefined、null的表达式。
在@Builder修饰的函数内部，不允许改变参数值。
@Builder内UI语法遵循UI语法规则。
只有传入一个参数，且参数需要直接传入对象字面量才会按引用传递该参数，其余传递方式均为按值传递。