鴻蒙5：常用語法

一.常用類型轉換

1.字符串轉數(shù)字
  • Number():字符串 直接轉數(shù)字，轉換失敗返回NaN(字符串中包含非數(shù)字)
  • parseInt():去掉小數(shù)部分 轉數(shù)字，轉換失敗返回NaN
  • parseFloat():保留小數(shù)部分 轉數(shù)字，轉換失敗返回NaN
let string1:string ="1.7"
let string2:string ="1.7a"
let string3:string ="1.7"

console.log("string1",parseInt(string1))//1
console.log("string2",parseFloat(string2))//1.7
console.log("string3",parseFloat(string3))//1.7
console.log("string3",Number(string3))//1.7
console.log("string3",Number(string2))//Nan
2.字符串轉數(shù)字
  • toString():數(shù)字直接轉字符串
  • toFixed():四舍五入轉字符串，可設置保留幾位小數(shù)
let number1:number=1.1
let number2:number=1.9

console.log("number1",number1.toString())//1.1
console.log("number2",number1.toFixed())//1
console.log("number3",number2.toFixed())//2
console.log("number4",number2.toFixed(2))//1.90

二.點擊事件

  • 語法:onClick( (參數(shù)) => {} )
    Text("點擊事件")
          .padding(40)
          .backgroundColor(Color.Gray).onClick(() => {
          AlertDialog.show({ message: "這是一個彈窗" })
        })

三.狀態(tài)管理

1. 狀態(tài)管理的基本流程圖
image.png
2. 普通變量 和 狀態(tài)變量 的區(qū)別?
  • 普通變量:只能在初始化時渲染，后續(xù)將不會再刷新。
  • 狀態(tài)變量:需要裝飾器裝飾，改變會引起 UI 的渲染刷新。
@Entry
@Component
struct Index {
  @State message: string = 'hello';

  build() {
    Column({ space: 2 }) {
      Stack({ alignContent: Alignment.TopStart }) {
        Text("點擊事件$"+this.message)
          .padding(40)
          .backgroundColor(Color.Gray).onClick(() => {
          this.message="你好ArkTs"
        })

      }
    }
  }
}

四.運算符

1.算數(shù)運算符 和 賦值運算符
image.png
2.一元運算符

常見一元運算符:++ 和 --

  • 后置寫法:先賦值后自增/自減
  • 前置寫法:先自增/自減再賦值
let number3:number=10
let number4:number=10
console.log("number10",number3++)//10
console.log("number11",++number4)//11
3.運算符優(yōu)先級
image.png

四.數(shù)組

  • 查找： 數(shù)組名[下標]、數(shù)組名.length
  • 修改： 數(shù)組名[下標] = 新值
  • 開頭增加: ： 數(shù)組名.unshift(數(shù)據(jù)1, 數(shù)據(jù)2, ...)
  • 結尾增加 ： 數(shù)組名.push(數(shù)據(jù)1, 數(shù)據(jù)2, ...)
  • 從開頭刪： 數(shù)組名.shift()
  • 從結尾刪：數(shù)組名.pop()
  • 任意位置增加或刪除： 數(shù)組名.splice(操作的起始位置, 刪除的個數(shù), 新增1, 新增2, ......)
let devices: string[]=["兒童手表","攝像機","門鈴"]
let devices: string[]=["兒童手表","攝像機","門鈴"]

console.log("devices",devices[0])//兒童手表
console.log("devices",devices.length)//3
devices[0]="行車記錄儀"
console.log("devices",devices)//行車記錄儀、攝像機、門鈴
devices.push("兒童手表")
console.log("devices",devices)//行車記錄儀、攝像機、門鈴、兒童手表
devices.unshift("定位器")
console.log("devices",devices)//定位器,行車記錄儀、攝像機、門鈴、兒童手表
devices.shift()
console.log("devices",devices)//行車記錄儀、攝像機、門鈴、兒童手表
devices.pop()
console.log("devices",devices)//行車記錄儀、攝像機、門鈴
devices.pop()
console.log("devices",devices)//行車記錄儀、攝像機、
devices.splice(1,1)//行車記錄義、
console.log("devices",devices)//行車記錄義
devices.splice(0,1,"兒童手表",'記錄儀')//兒童手表，記錄儀
console.log("devices",devices)//兒童手表，記錄儀

五.ForEach-渲染控制

語法: ForEach(arr, (item, index) => {})

  @State message: number[] =[1,2,3,4];
ForEach(this.message,(numberText:number,index)=>{
        Text("循環(huán)個數(shù)"+numberText)
          .padding(10)
          .backgroundColor(Color.Gray).onClick(() => {
          this.message[0]++
        })
      })

六.Class類

1.修飾符：修飾符包括:readonly、private、protected 和 public。省略不寫默認為 public
  • readonly：只讀，都可以訪問
  • private：私有，類內(nèi)部可以訪問
  • protected：保護，類及子類可以訪問
  • public：公共，都可以訪問
2.Class 類 – instanceof

instanceof 運算符可以用來檢測某個對象是否是某個類的實例
用法：實例對象 instanceof Class

七.剩余參數(shù) 和 展開運算符

剩余參數(shù) 和 展開運算符 ...
剩余參數(shù)的語法，我們可以將 函數(shù) 或 方法 中一個不定數(shù)量的參數(shù)表示為一個數(shù)組

// 剩余參數(shù)只能寫在最后一位
function 函數(shù)名(參數(shù)1,參數(shù)2,...剩余參數(shù)數(shù)組){
// 邏輯代碼
// 之前的參數(shù):挨個獲取即可 // 剩余參數(shù):以數(shù)組的形式獲取
}

function sum(numA:number,numB:number,...theArgs:number[]) {
        let total = numA+numbB;
        for (const arg of theArgs) {
                  total += arg;
          }
      return total; 
}
console.log(sum(1, 2, 3).toString()) // 6 
console.log(sum(1, 2, 3, 4).toString()) // 10

出于程序穩(wěn)定性，以及運行性能考慮，在 ArkTS 中 ...(展開運算符) 只能用在數(shù)組上

const numArr1: number[] = [1, 2, 3, 4] 
const numArr2: number[] = [5, 6, 7]
// 合并到一起
const totalArr: number[] = [...numArr1, ...numArr2]

八.接口

  • 接口繼承使用的關鍵字是 extends
interface IAnimal {
  name: string
}}

interface ICat extends IAnimal {
  color: string
  const cat: ICat = { name: '加菲貓', color: '黑色'
}
  • 可以通過接口結合 implements 來限制 類 必須要有 某些屬性 和 方法
interface IDog { 
   name: string bark: () => void
}
class Dog implements IDog {
  name: string = ''
  food: string = ''
  bark() { }
}

九.泛型：類型是 可變 的!

function fn1 (temp: string): string {
   return temp
}

function fn2 (temp: number): number {
  return temp
}

function fn3 (temp: boolean): boolean { 
  return temp
}
//改寫
function 函數(shù)名<Type>(temp:Type):Type{ 
   return temp
}

fn<string>('123')
fn<number>(1)
  • 泛型約束
interface ILength {
   length: number
}
// 傳入的類型必須要有 接口中的屬性
function fn<T extends ILength>(param: T) { 
   console.log('', param.length)
}
  • 多個泛型參數(shù)

function funcA<T, T2>(param1: T, param2: T2) { 
  console.log('參數(shù) 1', param1)
  console.log('參數(shù) 2', param2)
}

funcA<string, number>('大白菜', 998)
funcA<string[], boolean[]>(['小老虎'], [false])
  • 泛型接口
interface IdFunc<Type> { 
   id: (value: Type) => Type
   ids: () => Type[]
}
let obj: IdFunc<number> = { 
 id(value) { return value },
  ids() { return [1, 3, 5] }
}
  • 泛型類
// 定義
class Person <T> {
   id: T
   constructor(id: T) {
      this.id = id
   }
   getId(): T {
    return this.id
  }
}
// 使用
let p = new Person<number>(10)
最后編輯于 ：
?著作權歸作者所有,轉載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時請結合常識與多方信息審慎甄別。
平臺聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點，簡書系信息發(fā)布平臺，僅提供信息存儲服務。

相關閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容