课程地址 ：https://www.bilibili.com/video/BV14Z4y1u7pi?p=148
1. 安装解析器
Typescript 是【微软】开发的，把所有的变量都提前写好 type。
比如：let name : String = "哈哈哈"，Type + script
Typescript 是 JavaScrip 的一个超集
底层还是得解析翻译成JavaScrip。
解析器就叫 typescript （小写）
cnpm i -g typescript
2. 安装简化执行 TS
3. vscode 断点调试
4. 数组
存储多个数据
内置对象：所以通过 . 语法
常用属性： songs.length;
常用方法：songs.push，forEach，some
let names: string[] = ['a', 'b', 'c'] // 推荐
let names: string[] = new Array('a', 'b', 'c') // 不推荐
//为数组添加最后一个新成员
names.push = 'new1 name';
let names[names.length] = 'new name'
//遍历数组
for(let i:number=0; i<=names.length-1; i++) {
console.log(names[i]);
}
//简化遍历数组
for(let i:number=0; i<names.length; i++) {
console.log(names[i]);
}
//forEach
names.forEach((item, index) => { //函数作为参数，回调函数
console.log(item, index); //如果有三个元素，这个回调函数会被调用三次，所以就会打印三次
})
//最大值
let max: number = 0;
for (let i: number = 0; i < sum.length; i++) {
if (sum[i] > max) {
max = sum[i];
}
}
// console.log(max)
//求和
let total: number = 0;
for (let i: number = 0; i < sum.length; i++) {
total += sum[i];
}
// console.log(total);
//数组中，将不为 0 的元素取出，组成新的数组
let newArray: number[] = [];
for (let i: number = 0; i < sum.length; i++) {
if (sum[i] != 0) {
// newArray.push(sum[i]);
newArray[newArray.length] = sum[i];
}
}
console.log(newArray)
let has: boolean = sum.some((item, index) => {
if (item > 10) {
return true;//找到满足条件元素，通过返回 true 停止后续遍历
}
return false;//没有找到元素，通过 false 来继续后面的循环
})
console.log(has)
some
forEach 必须循环完所有项，不能 break，不能 return。
如果找一个数组中有没有某个值时，找到就停止 ⏹ ，就要用 some
const array = [1, 2, 3, 4, 5];
// checks whether an element is even
const even = (element) => element % 2 === 0;
console.log(array.some(even));
// expected output: true
let odd: boolean = sum.some(value => {
if (value % 2 === 0) return true
return false
})
console.log("odd: " + odd)
function checkAdult(age) {
return age >= 18;
}
console.log(array.some(checkAdult))
浅拷贝一个数组
var shallowCopy = fruits.slice(); // this is how to make a copy
// ["Strawberry", "Mango"]
slice 删掉某些元素，这里是全部删除，返回整个 array，相当于拷贝。
删除还可以用改变数组长度，比如
let fruits = ['a', 'b', 'c']
fruits.length = 2 // c就不在了
函数
声明一次，但可以调用任意多次的一段代码
增加代码复用，减少重复代码，提升开发效率
函数参数：增加了函数的灵活性，通用性。针对相同的功能，能够适应更多的数据（值）
形式参数形参和实参的区别
英文名字不同：形参是parameter，实参是argument。
返回值
function getTotal(nums: number[]): number {//声明返回值类型
let sum: number = 0
for (let i: number = 0; i < nums.length; i++) {
sum += nums[i]
}
console.log(sum)
return sum//指定返回值
}
console.log(getTotal(sum) + getTotal(sum))
//求三角形面积
function getArea(hight: number, width: number): number {
let area: number = 1 / 2 * hight * width; //不要忘了这个地方的类型number
return area;
// return 1/2 * width * hight;
}
console.log(getArea(10, 10))
对象
一组相关属性和方法的集合，并且是无序的。
无序键值对的集合
对象的来源：
- 自己创建
- 编辑语言自带（内置对象） 或 第三方（像 vue 里面的 api）
内置对象：TS/JS 自带的一些基础对象，提供了 TS 开发时所需的基础和必要的能力，比如数组
对象的类型注解
提前设计好对象的结构
//对象注解
let person: {
name: string; //分号可以省略
age: number;
sayHi: () => void;
sing: (name: string) => void;
sum: (num1: number, num2: number) => number;
}
//对象
person = {
name: 'John',
age: 34,
sayHi: () => {
console.log('Hello')
},
sing: (name) => {
console.log(`歌曲名称：${name}`)
},
sum: (num1, num2) => { return num1 + num2 }
}
接口：为对象的类型注解命名，并未代码建立契约来约束对象的结构
接口名称约定以 I 开头
//接口
interface IPerson { //没有 ：
name: string; //分号可以省略
age: number;
sayHi: () => void;
sing: (name: string) => void;
sum: (num1: number, num2: number) => number;
}
//对象
let person1: IPerson = {
name: 'John',
age: 34,
sayHi: () => {
console.log('Hello')
},
sing: (name) => {
console.log(`歌曲名称：${name}`)
},
sum: (num1, num2) => { return num1 + num2 }
}
访问对象属性 和 获取对象中的方法【 并调用 】
person1.age = 19
person1.sing('对对对') //调用方法
