2024-07-09

typeScript 使用 Promise 进行网络请求

new Promise<string>((resolve, reject) => {  
  // ... 异步操作 ...  
  if (/* 某些条件满足 */) {  
    resolve('加载成功');  
  } else {  
    reject('加载失败');  
  }  
}).then((result) => {  
  // 这里是接收 resolve 传递的结果的地方  
  console.log(result); // 输出: 加载成功  
}).catch((error) => {  
  // 这里是接收 reject 传递的错误的地方  
  console.error(error);  
});

typescript里面的可选参数和带初始值的参数

这是可选参数的写法
可选参数通过在参数名后添加问号?来定义，这意味着在调用函数时这个参数是可选的，可以省略。可选参数必须位于所有必选参数之后。
function greet(name?: string) {  
    if (name) {  
        console.log(`Hello, ${name}!`);  
    } else {  
        console.log('Hello, stranger!');  
    }  
}  
  
greet('Alice'); // Hello, Alice!  
greet();        // Hello, stranger!

参数默认值
function greet(name = 'stranger') {  
    console.log(`Hello, ${name}!`);  
}  
  
greet('Bob'); // Hello, Bob!  
greet();      // Hello, stranger!

typeScript 箭头函数的作用有两个：

1、typescript语言 在函数类型声明中，=>用来分隔参数列表和返回类型。

// => 符号确实用于分隔函数的参数列表和返回类型
// 声明一个函数类型AddFunction，它接受两个数字作为参数，并返回一个数字
type AddFunction = (a: number, b: number) => number;

2、箭头函数

// 定义一个符合AddFunction类型的函数
const add: AddFunction = (a, b) => a + b;

使用 type 关键字定义函数类型别名

type AddFunction = (a: number, b: number) => number;

// 调用函数
console.log(add(2,3)+""); // 输出: 5

3、定义接口约定对象的特征和行为

//1、通过interface约定 对象结构类型（特征和行为）
interface Person{
  name:string,
  age:number,
  weight:number,
  sing:(name:string) => void,
  dance:() =>void
}
//2、基于接口 定义对象并使用
let ym:Person = {
  name:'杨幂',
  age:18,
  weight:90,
  sing:(name:string)=>{
    LogUtils.debug('123','杨幂唱首歌:'+name);
  },
  dance:()=>{
    LogUtils.debug('123','杨幂跳支舞')
  }
}

4、扩展运算符 (...)：扩展运算符可以用来展开数组或类数组对象的元素。在数组字面量中，它可以用来合并多个数组。

let dataList = [1, 2, 3];
let result = [4, 5, 6];
dataList = [...dataList, ...result]; // 合并数组
console.log(dataList); // 输出: [1, 2, 3, 4, 5, 6]

//3、获取对象的属性值
LogUtils.debug('123',${ym.name},${ym.age})
LogUtils.debug('123',${ym.sing('爱的供养')},${ym.dance()})

###4.联合类型：变量可以存储多种类型的数据

let judge:number | string = '100'
let sex:'man'|'woman'|'secret'
sex = 'man'

### 5.布局方式
- [线性布局（Row/Column)](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/ui/arkts-layout-development-linear.md)
- [层叠布局（Stack）](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/ui/arkts-layout-development-stack-layout.md)
- [弹性布局（Flex）](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/ui/arkts-layout-development-flex-layout.md)
- [相对布局（RelativeContainer）](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/ui/arkts-layout-development-stack-layout.md)