一.ArkTs-语法基础（鸿蒙NEXT版）

淡墨922
387 阅读6分钟

1. 开发环境

更新了下下载链接 (developer.huawei.com/consumer/cn…

DevEco Studio支持Windows系统和macOS系统，在开发应用/服务前，需要配置应用/服务的开发环境。环境配置流程：下载软件 → 安装软件并配置 → 创建工程并运行。

安装位置尽量不要安装到C和非中文文件夹

创建顺序：Create Project → Empty Ability → Next → 输入项目名称、浏览存储路径 → Finish

汉化过程：File → Setting → Plugins → Installed -- 搜索 Chinese → 勾选 → OK → Restart

2. 基础入门

ArkTS：是一门用于开发鸿蒙应用的编程语言。

编程语言：用来控制计算机工作的，可以告诉计算机我们要做的事情。

编写代码 → 编译运行 → 查看效果

2.1 输出语句

写法：console.log('消息说明', '打印的内容')

image.png

注释：
1.单行注释 // 注释内容，快捷键： Ctrl +/
2.块注释 /注释内容/，快捷键：Ctrl + Shift + /

3. 认识和存储数据

3.1 认识数据

编程语言的核心就是处理数据

三种常见的基础数据类型：

① string 字符串：描述信息

② number 数字：计算

③ boolean 布尔：判断 （真、假）

3.2 存储数据

3.2.1 变量

变量：专门用来存储数据的容器（可变）

// let 变量名: 类型 = 值 
let title: string = '奥利奥水果捞' 
let price: number = 21.8 
let isSelect: boolean = true

认识和存储数据

// 1. 字符串 string 
let title: string = '巨无霸汉堡' 
console.log('字符串title', title) 
// 2. 数字 number let age: number = 18 
console.log('年龄age', age) 
// 3. 布尔 boolean，值 true真，false假 
let isLogin: boolean = false console.log('是否登录成功', isLogin) 
// 变量存储的数据可以修改 
age = 40 console.log('年龄age', age)
3.2.2 常量

常量：用来存储数据 （不可变）

写法：const 常量名: 类型 = 值

常量

const PI: number = 3.14 
console.log('圆周率', PI) 
const companyName: string = '华为' 
console.log('公司名称', companyName)
3.2.3 命名规则

  1. 只能包含数字、字母、下划线、$，不能以数字开头

  2. 不能使用内置关键字或保留字 （比如 let、const）

  3. 严格区分大小写

4. 数组

数组：是一个容器，可以存储多个数据

let 数组名: 类型[] = [数据1, 数据2,...] 
let names: string[] = ['小红', '小明', '大强']

注意：数组指定的类型要和存储的类型一致，否则会报错

4.1 获得数组元素

console.log('取出小明', names[0])

注意：索引号是从0开始的

示例代码（数组）

let names: string[] = ['小红', '小明', '大强'] 
console.log('数组names', names) 
// 根据索引取数据 
console.log('姓名：', names[0])

5. 函数

函数：可以被重复使用的代码块

image.png

需要三个这样的形状该怎么办？

console.log('五角星', '☆') 
console.log('五角星', '☆☆') 
console.log('五角星', '☆☆☆') 
console.log('五角星', '☆☆☆☆') 
console.log('五角星', '☆☆☆☆☆')

需要更多需要怎么办？

使用函数来解决：函数可以把具有相同或相似逻辑的代码“包裹”起来，有利于代码复用。

function fn () { 
  console.log('五角星', '☆') 
  console.log('五角星', '☆☆') 
  console.log('五角星', '☆☆☆') 
  console.log('五角星', '☆☆☆☆') 
  console.log('五角星', '☆☆☆☆☆') 
} 
fn() // 第一次输出 5行五角星 
fn() // 第二次输出 5行五角星 
fn() // 第三次输出 5行五角星

5.1 基本使用

先定义后调用

function 函数名() { 
  函数体 
 } 
 
 函数名()

示例代码

// 1. 定义函数 
  function star() { 
    console.log('五角星', '☆') 
    console.log('五角星', '☆☆') 
    console.log('五角星', '☆☆☆') 
    console.log('五角星', '☆☆☆☆') 
    console.log('五角星', '☆☆☆☆☆') 
  } 
// 2. 调用函数 
  star() 
  star() 
  star()

5.2 完整写法

根据我们传入不同的数据，进行处理，返回处理后的结果。

function 函数名（需要处理的数据） { 
  编写代码对数据进行处理 
  return 处理后的结果 
} 

let 变量名: 类型 = 函数名（实际要处理的数据）

●实参：真实数据（函数调用时候的传入的真实数据）

●形参：形式上的参数（函数定义时候写的参数）

示例代码

/* 
  * 需求1：苹果 2元/斤，买3斤需要多少钱？ 
  * 需求2：香蕉 4元/斤，买4斤需要多少钱？ 
  * */ 
function buy(price: number, num: number) { 
  // console.log('传入的数据', price, num) 
  // 1. 处理数据 
  let result: number = price * num 
  // 2. 返回数据 return result 
} 

  let apple: number = buy(2, 3) 
  console.log('苹果', apple) 
  
  let banana: number = buy(4, 4) 
  console.log('香蕉', banana)

5.3 函数的可选参数

函数在定义的时候,设置了形参入口,但是在调用的时候并不是任何时候都需要传入实参数据,为了避免报错,我们可以将形参设置为可选参数, 或者给形参设置一个默认值

5.3.1可选参数-- ? 形式

●语法: 形参 -- name?: Type

name: 形参名称

? : 表示可有可无

Type: 接收数据的类型

function sayHi(params?: string) { 
  console.log('打招呼语', params || 'hello') 
 
  // undefined console.log('打招呼语', params)
} 
  sayHi('你好') 
  sayHi()

5.3.2可选参数 -- 默认值

在一些情况下,形参的数值不能为 undefined, 否则容易引起程序的崩溃, 比如求两个数据之和, 形参的数值就不能为undefined, 否则其计算的结果不能使用到业务逻辑当中

这时候就需要使用到默认值的形式了

●语法: num: number = 2

错误用法

function sum(x: number, y: number) { 
  let res: number = x + y 
  return res 
}

正确用法

function sum(x: number, y: number = 0) { 
  let res: number = x + y return res 
} 
  console.log('结果是', sum(1, 2)) 
  console.log('结果是', sum(1))

5.4 箭头函数

箭头函数是 比普通函数 更简洁 的一种函数写法

let 函数名 = (形参1: 类型, 形参2: 类型) => { 
  // 函数体 
  // 1. 计算过程 
  // 2. 返回结果 
  return 计算的结果 
} 
  函数名(实参1, 实参2)

示例代码（箭头函数）

// 1. 基本写法 
/*let star = () => { 
  console.log('五角星', '☆') 
  console.log('五角星', '☆☆') 
  console.log('五角星', '☆☆☆') 
  console.log('五角星', '☆☆☆☆') 
  console.log('五角星', '☆☆☆☆☆') 
} 

  star() 
  star()*/ 
  
  // 2. 参数与返回值 
  /* 
  * 需求1：苹果 2元/斤，买3斤需要多少钱？ 
  * 需求2：香蕉 4元/斤，买4斤需要多少钱？ 
  * */ 
  
  let buy = (price: number, weight: number = 1) => { 
    let result: number = price * weight 
    return result 
  } 
  let apple: number = buy(2) 
  console.log('苹果', apple) 
  
  let banana: number = buy(4, 4) 
  console.log('香蕉', banana)

6.对象

作用：用于描述一个物体的特征和行为

对象：是一个可以存储多个数据的容器。

6.1对象-定义&使用

1.通过interface接口约定 对象结构类型

interface 接口名 { 
  属性1: 类型1 
  属性2: 类型2 
  属性3: 类型3 
} 

interface Person { 
  name: string 
  age: number 
  weight: number 
}

2.定义对象并使用：对象名.属性名

// 1. 定义接口 
interface Person { 
  name: string 
  age: number 
  weight: number 
} 

// 2. 基于接口，定义对象 
let ym: Person = { 
  name: '杨幂', 
  age: 18, 
  weight: 90 
} 

console.log('名字', ym.name) 
console.log('年龄', ym.age) 

let lss: Person = { 
  name: '刘诗诗', 
  age: 19, 
  weight: 88 
} 

console.log('名字', lss.name) 
console.log('年龄', lss.age)

6.2 对象-方法

方法作用：描述对象的具体行为

1 约定方法类型

interface 接口名称 { 
  方法名: (参数:类型) => 返回值类型 
} 

interface Person{ 
  dance: () => void sing: (song: string) => void 
}

2.添加方法（箭头函数）

let ym: Person = { 
  dance: () => { 
    console.log('杨幂说', '我来跳个舞') 
  }, 
  sing: (song: string) => { 
    console.log('杨幂说', '我来唱首', song) 
  } 
} 

// 对象名.方法名（参数） 
ym.dance() 
ym.sing('爱的供养')

7.联合类型

联合类型是一种灵活的数据类型，它修饰的变量可以存储不同类型的数据。

image.png

考试成绩：分数 或 级别（A/B/C）

image.png

// let 变量: 类型1 | 类型2 | 类型3 = 值 

let judge: number | string = 100 

judge = 'A+' 
judge = '优秀' 

console.log('年终考试评价', judge) 

// 联合类型可以将变量值约定在一组数据范围内进行选择 
let gender: 'man' | 'woman' | 'secret' = 'secret'

8. 枚举类型

枚举类型是一种特殊的数据类型，约定变量只能在一组数据范围内选择值

image.png

// 联合类型 不方便 
'#ff0f29' | '#ff7100' | '#30b30e'

使用枚举更方便

// 1. 定义枚举 （定义常量列表） 
enum ThemeColor { 
  Red = '#ff0f29', 
  Orange = '#ff7100', 
  Green = '#30b30e' 
} 

// 2. 给变量设定枚举类型 
  let color: ThemeColor = ThemeColor.Orange 
  console.log('color', color)
avatar
文章
阅读
粉丝