类的使用方法:

类:有两特征:

1.静态特征---属性

2.动态特征----方法/函数

class类的关键词

Person 类名 首字母大写

写法:

class Person {
    //构造函数
    constructor(name: string, sex: string, age: number) {
        this.name = name
        this.sex = sex
        this.age = age
    }
    name: string
    sex: string
    age: number
    //方法
    chi() {
        console.log("吃饭");

    }
    he() {
        console.log("喝水");

    }

}

对象 类的实例,创建对象 实例化对象

写法:

let lm: Person = new Person('小明', '男', 18)

通过对象名.属性  进行访问

写法:

//lm.name='李正华'
//lm.age=18;
//lm.sex='男'
lm.name = '小红'
console.log(lm.name);
lm.chi()
lm.he()

例子:

电脑类 品牌,型号,重量 开机 关机

class Computer {
    brand: string
    type: string
  weight:number

    constructor(brand: string, type: string,weight:number) {
        this.brand=brand
        this.type=type
        this.weight=weight
    }
 star(){
    console.log('开机');
    
 }
 end(){
    console.log('关机');
    
 }

}
let c1:Computer=new Computer('惠普','v7',86)
console.log(c1);
c1.star()
c1.end()

对象数组

1.学生类 学号,姓名,班级 学习

class Student {
    id: string
    name: string
    clas: string
    constructor(id: string, name: string, clas: string) {
        this.id = id
        this.name = name
        this.clas = clas
    }
    study() {
        console.log(this.name + "在学习");

    }
}

//2.把学生存到数组中
let stus: Array<Student> = [];
let stu1: Student = new Student('001', '张三', 'java')
let stu2: Student = new Student('002', '张四', 'html')
let stu3: Student = new Student('003', '张五', 'java')
let stu4: Student = new Student('004', '张小明', 'css')
let stu5: Student = new Student('005', '张三8', 'js')
let stu6: Student = new Student('006', '张三9', 'ts')
let stu7: Student = new Student('007', '张三7', 'arks')

stus.push(stu1)
stus.push(stu2)
stus.push(stu3)
stus.push(stu4)
stus.push(stu5)
stus.push(stu6)
stus.push(stu7)
//3.遍历数组
for (let i in stus) {
    let s: Student = stus[i];
    console.log(`学号:${s.id},姓名:${s.name},班级:${s.clas}`);

}

用DevEcoStudio来写代码

用类:

写法:

class Reg{
  val:string
  isflag:number
  Msg:string
  msgErr:string
  pat:string
  asdd:string

  constructor( val:string,isflag:number,Msg:string,msgErr:string,pat:string,asdd:string) {
    this.val=val
    this.isflag=isflag
    this.Msg=Msg
    this.msgErr=msgErr
    this.pat=pat
    this.asdd=asdd
  }
}



@Entry
@Component
struct Reg3Page {
  @State message: string = '账号注册';
 // @State val: string[]=['','','','','','',''];//默认值
  //@State isFlag: number[]=[0,0,0,0,0,0,0]//0默认第一次进入 1验证成功
  //@State Msg: string []= ['','','','','','','']//提示
  //@State msgErr:string[]=['账号为6~12为单词字符','密码长度6~12','密码不一致','手机号不正确','身份证不正确','昵称违规','邮箱必须包含@.'];//错误提示
  //@State pat:string[]=['^\\w{6,12}$','^\\w{6,12}$','^\\w{6,12}','^\\d{10}$','^\\d{17}[0-9Xx]$','^.+$','^\\w+@\\w+\\.\\w+$',]
  //@State asdd:string[]=['账号不能为空','密码不能为空','确认密码不能为空','手机号不能为空','身份证不能为空','昵称不能为空','邮箱不能为空']
@State reg:Reg[]=[];
  //启动页面时,自动执行函数中的内容
  aboutToAppear(): void {
    let r1:Reg=new Reg('',0,'','账号为6~12为单词字符','^\\w{6,12}$','账号不能为空')
    let r2:Reg=new Reg('',0,'','密码长度6~12','^\\w{6,12}$','密码不能为空')
    let r3:Reg=new Reg('',0,'','密码不一致','^\\w{6,12}$','确认密码不能为空')
    let r4:Reg=new Reg('',0,'','手机号不正确','^^\\d{10}$','手机号不能为空')
    let r5:Reg=new Reg('',0,'','身份证不正确','^\\d{17}[0-9Xx]$','身份证不能为空')
    let r6:Reg=new Reg('',0,'','昵称违规','^.+$','昵称能为空')
    let r7:Reg=new Reg('',0,'','邮箱必须包含@.','^\\w+@\\w+\\.\\w+$','邮箱不能为空')
    this.reg.push(r1)
    this.reg.push(r2)
    this.reg.push(r3)
    this.reg.push(r4)
    this.reg.push(r5)
    this.reg.push(r6)
    this.reg.push(r7)

  }
  build() {
    Column() {
      Text(`${this.message}`).fontSize(30)

      //账号
      Column({ space: 10 }) {
        Row() {
          TextInput({ placeholder: '账号' }).width('90%').borderRadius(0)
            .onChange(Val => this.reg[0] .val= Val)
          if (this.reg[0] .isflag== 1) {
            Text('√')
              .fontColor('#fff')
              .fontSize(20)
              .fontWeight(900)
              .width(30)
              .height(30)
              .backgroundColor('blue')
              .borderRadius(30)
              .textAlign(TextAlign.Center)
          } else if (this.reg[0].isflag==2) {
            Text('×')
              .fontColor('#fff')
              .fontSize(25)
              .fontWeight(900)
              .width(30)
              .height(30)
              .backgroundColor('red')
              .borderRadius(30)
              .textAlign(TextAlign.Center)
          }

        }.width('100%')

        Text(`${this.reg[0].Msg}`).fontColor('red').width('100%')
      }.width('90%').height(70)

      //密码
      Column({ space: 10 }) {
        Row() {
          TextInput({ placeholder: '密码' }).width('90%').borderRadius(0).type(InputType.Password)
            .onChange(Val => this.reg[1].val = Val)
          if (this.reg[1].isflag == 1) {
            Text('√')
              .fontColor('#fff')
              .fontSize(20)
              .fontWeight(900)
              .width(30)
              .height(30)
              .backgroundColor('blue')
              .borderRadius(30)
              .textAlign(TextAlign.Center)
          } else if (this.reg[1].isflag==2) {
            Text('×')
              .fontColor('#fff')
              .fontSize(25)
              .fontWeight(900)
              .width(30)
              .height(30)
              .backgroundColor('red')
              .borderRadius(30)
              .textAlign(TextAlign.Center)
          }

        }.width('100%')

        Text(`${this.reg[1].Msg}`).fontColor('red').width('100%')
      }.width('90%').height(70)

      //确认密码
      Column({ space: 10 }) {
        Row() {
          TextInput({ placeholder: '确认密码' }).width('90%').borderRadius(0).type(InputType.Password)
            .onChange(Val => this.reg[2].val = Val)
          if (this.reg[2] .isflag== 1) {
            Text('√')
              .fontColor('#fff')
              .fontSize(20)
              .fontWeight(900)
              .width(30)
              .height(30)
              .backgroundColor('blue')
              .borderRadius(30)
              .textAlign(TextAlign.Center)
          } else if (this.reg[2].isflag==2) {
            Text('×')
              .fontColor('#fff')
              .fontSize(25)
              .fontWeight(900)
              .width(30)
              .height(30)
              .backgroundColor('red')
              .borderRadius(30)
              .textAlign(TextAlign.Center)
          }


        }.width('100%')

        Text(`${this.reg[2].Msg}`).fontColor('red').width('100%')
      }.width('90%').height(70)

      //手机号
      Column({ space: 10 }) {
        Row() {
          TextInput({ placeholder: '手机号' }).width('90%').borderRadius(0)
            .onChange(Val => this.reg[3] .val= Val)
          if (this.reg[3] .isflag== 1) {
            Text('√')
              .fontColor('#fff')
              .fontSize(20)
              .fontWeight(900)
              .width(30)
              .height(30)
              .backgroundColor('blue')
              .borderRadius(30)
              .textAlign(TextAlign.Center)
          } else if (this.reg[3].isflag==2) {
            Text('×')
              .fontColor('#fff')
              .fontSize(25)
              .fontWeight(900)
              .width(30)
              .height(30)
              .backgroundColor('red')
              .borderRadius(30)
              .textAlign(TextAlign.Center)
          }

        }.width('100%')

        Text(`${this.reg[3].Msg}`).fontColor('red').width('100%')
      }.width('90%').height(70)

      //身份证
      Column({ space: 10 }) {
        Row() {
          TextInput({ placeholder: '身份证' }).width('90%').borderRadius(0)
            .onChange(Val => this.reg[4].val = Val)
          if (this.reg[4] .isflag== 1) {
            Text('√')
              .fontColor('#fff')
              .fontSize(20)
              .fontWeight(900)
              .width(30)
              .height(30)
              .backgroundColor('blue')
              .borderRadius(30)
              .textAlign(TextAlign.Center)
          } else if (this.reg[4].isflag==2) {
            Text('×')
              .fontColor('#fff')
              .fontSize(25)
              .fontWeight(900)
              .width(30)
              .height(30)
              .backgroundColor('red')
              .borderRadius(30)
              .textAlign(TextAlign.Center)
          }


        }.width('100%')

        Text(`${this.reg[4].Msg}`).fontColor('red').width('100%')
      }.width('90%').height(70)

      //昵称
      Column({ space: 10 }) {
        Row() {
          TextInput({ placeholder: '昵称' }).width('90%').borderRadius(0)
            .onChange(Val => this.reg[5] .val= Val)
          if (this.reg[5] .isflag== 1) {
            Text('√')
              .fontColor('#fff')
              .fontSize(20)
              .fontWeight(900)
              .width(30)
              .height(30)
              .backgroundColor('blue')
              .borderRadius(30)
              .textAlign(TextAlign.Center)
          } else if (this.reg[5].isflag==2) {
            Text('×')
              .fontColor('#fff')
              .fontSize(25)
              .fontWeight(900)
              .width(30)
              .height(30)
              .backgroundColor('red')
              .borderRadius(30)
              .textAlign(TextAlign.Center)
          }

        }.width('100%')

        Text(`${this.reg[5].Msg}`).fontColor('red').width('100%')
      }.width('90%').height(70)

      //邮箱
      Column({ space: 10 }) {
        Row() {
          TextInput({ placeholder: '邮箱' }).width('90%').borderRadius(0)
            .onChange(Val => this.reg[6] .val= Val)
          if (this.reg[6] .isflag== 1) {
            Text('√')
              .fontColor('#fff')
              .fontSize(20)
              .fontWeight(900)
              .width(30)
              .height(30)
              .backgroundColor('blue')
              .borderRadius(30)
              .textAlign(TextAlign.Center)
          } else if (this.reg[6].isflag==2) {
            Text('×')
              .fontColor('#fff')
              .fontSize(25)
              .fontWeight(900)
              .width(30)
              .height(30)
              .backgroundColor('red')
              .borderRadius(30)
              .textAlign(TextAlign.Center)
          }

        }.width('100%')

        Text(`${this.reg[6].Msg}`).fontColor('red').width('100%')
      }.width('90%').height(70)

      Button("注册").type(ButtonType.Normal).width('80%')
        .onClick(() => {

          for(let i=0;i<this.reg.length;i++){
            if(this.reg[i].val.length>0) {
              if(i==2){//再次输入密码
                if(this.reg[1].val==this.reg[2].val){
                  this.reg[2].isflag=1;
                  this.reg[2].Msg=''
                }else {
                  this.reg[2].isflag=2;
                  this.reg[2].Msg='两次密码不一致'
                }
                continue
              }
              let flag:boolean=this.patt(i);
            }else{
              this.reg[i].isflag=2;
              this.reg[i].Msg=this.reg[i].asdd
            }
            //获取原来数据
            let r:Reg=this.reg[i]
            //删除并添加
            this.reg.splice(i,1,r)

          }

        })

      //是否同意本协议

    }
    .height('100%')
    .width('100%')
  }
  //验证  (下标,规则,组件,)
  patt(index:number):boolean{
    if(this.reg[index].val.match(this.reg[index].pat)){ //符合规则
      this.reg[index].isflag=1;
      this.reg[index].Msg=''
      return true
    }else {
      this.reg[index].isflag=2;
      this.reg[index].Msg=this.reg[index].msgErr
      return false
    }
  }



}

  • 2
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值