正文
06 变量的作用域，函数划分
function zhengXing():void{ var yangzi:string = '刘亦菲' console.log(yangzi) } zhengXing() console.log(yangzi)
以上例子说明了，在函数体内，是封闭的
无论是全局声明，还是什么声明，都只在函数体内起作用
在外部，所以是不起作用的
什么是全局变量？(函数体外声明的变量) 什么是局部变量？(函数体内声明的变量)
var yangzi:string = '刘亦菲' function zhengXing():void{ console.log('我的女神是'+yangzi) } zhengXing() console.log(yangzi)
小坑:重名会发生变量提升
当重名的时候，内部变量会起作用
var yangzi:string = '刘亦菲' function zhengXing():void{ var yangzi:string = '黄圣依' console.log('我的女神是'+yangzi) } zhengXing() console.log(yangzi)
终端显示结果：
var yangzi:string = '刘亦菲' function zhengXing():void{ //当在函数体内未声明就使用，会显示undefined console.log('我的女神是'+yangzi) var yangzi:string = '黄圣依' console.log('我的女神是'+yangzi) } zhengXing() console.log(yangzi)
其实上面那一段变量提升相当于下面的写法
var yangzi:string = '刘亦菲' function zhengXing():voi d{ var yangzi:string console.log('我的女神是'+yangzi) yangzi = '黄圣依' console.log('我的女神是'+yangzi) } zhengXing() console.log(yangzi)
所以说，为声明之前打印会显示undefined
所以记住第一句打印的是undefined，第二句打印的是函数体内声明的变量
js早期只有局部变量和全局变量
但是比如我们的大众语言，java，c++
她们的变量都是以大括号{}为区域划分的
所以js经常被吐槽说，js不适合大型项目开发
因为很容易引起内存溢出
因为它没有变量作用域
划分只能靠函数来进行，是非常不方便的
所以在我们的ES6，就使用了let
let关键字就可以声明函数的作用域是块级作用域
function zhengXing():void{ var yangzia:string="朱茵" { let yangzib:string='巩俐' console.log('我的女神是'+yangzib+'吗') } console.log('我的女神是'+yangzia+'吗') console.log('我的女神是'+yangzib+'吗') } zhengXing()
我们进行构建时终端会报错错误
但是我们运行文件之后会发现，它还是正常输出了，为什么？
这是一个小坑：为什么会这样？
因为它自动帮我们把let转译成了var
我们在构建编译好的js文件中可以查到
我们尝试在js文件中，把var修改成let
我们会发现会报错，说明我们的块级作用域还是起作用了
07 引用类型的数组
我们之前讲的都是值类型
比如给一个变量赋一个数值型的值
或者说给一个变量赋一个字符串
// 类 let person={ name:'hls', age:'18', skill:'web', saySomething:function(){ console.log('不忘初心，砥砺前行') } } console.log(person.name) person.saySomething()
数组引用类型----比如：array String Date RegExp
数组的初始化，也就是声明
下面是数组的两种声明方法
let arr1:number[] //数值类型 let arr2:Array//数组类型变成了布尔类型
下面我们看看数组赋值的两种方式
字面量赋值法
let arr1:number[]=[] let arr2:number[]=[1,2,3] let arr3:Array<string>=['香蕉','橘子','菠萝','草莓'] let arr4:Array<boolean>=[true,false,false]
构造函数赋值法(构造函数:用new来赋值)
let arr1:number[]=new Array() let arr2:number[]=new Array(1,2,3) let arr3:Array<string>=new Array('香蕉','橘子','菠萝','草莓') let arr4:Array<boolean>=new Array(tr ue,false,false)
这两种方法都阔以，都很直观鸭
有一种特殊的数组叫做元组
元组可以在我们的ts中赋值两种类型
在开发中，元祖还是比较少用的，所以此处略
08 引用类型的字符串
基本类型字符串：单引号或双引号字符引起来的字符串
引用类型字符串：用new实例化的String类型字符串
let hls:string = 'hello' let cola:String = new String('WO') console.log(hls) console.log(cola)
小结：用引用类型或者基本类型声明的字符串，属性和方法的用法都是一样的
为什么要有引用类型和基本类型两种类型呢？
其实很早之前只有普通类型
但是我们的前端人员经常操作我们的string类型
那么为了扩展方法，就加了引用类型
下面我来看看数组最基本的属性：length
let hls:string = 'hello' let cola:String = new String('WO') console.log(hls.length) console.log(cola.length)
这个属性经常使用，所以最好记住
1. 查找字符串 indexOf
let something:string='这类框架主要原理就是将 APP的?部分需要动态变动的内容通过H5来实现' let xiaojiejie:string = 'H5' console.log(something.indexOf(xiaojiejie))
2. 从后面开始查找字符串 lastIndexOf（查无的话就返回-1）
let something:string='这类框架主要原理就是将APP的?部分需要动态变动的内容通过H5来实现' let xiaojiejie:string = 'H' console.log(something.lastIndexOf(xiaojiejie))
3. 截取字符串
let something:string='这类框架主要原理就是将APP的?部分需要动态变动的内容通过H5来实现' let xiaojiejie:string = 'H' console.log(something.substring(8))
let something:string='这类框架主要原理就是将APP的?部分需要动态变动的内容通过H5来实现' let xiaojiejie:string = 'H' console.log(something.substring(8,4))
4. 替换字符串:replace
let something:string='多学习，多练习，HTML，css，javascript' let xiaojiejie:string = 'typecript' console.log(something.replace('javascript','typecript'))
09 引用类型的日期对象
不传递任何参数
let d:Date = new Date() console.log(d)
传递一个整数
let d1:Date = new Date(1000)//1970-01-01 00:00:00 let d2:Date = new Date(2000)//1970-01-01 00:00:00 console.log(d1) console.log(d2)
传递一个字符串
let d1:Date = new Date('2020/02/27 14:57:00') let d2:Date = new Date('2020-02-27 14:57:00') let d3:Date = new Date('2020-02-27T14:57:00') console.log(d1) console.log(d2) console.log(d3)
还有更多语法如下，几乎和js是一样的，不赘述
let d:Date = new Date('year','month','day','hour','minute','second','microsecond')
10 引用类型的正则表达式
RegExp 和字符串很像
构造函数声明法
let reg1:RegExp=new RegExp("helloworld") console.log(reg1) let reg2:RegExp=new RegExp("helloworld",'gi') console.log(reg2)
字面量声明
let reg11:RegExp=/helloworld/ console.log(reg11) let reg22:RegExp=/helloworld/gi console.log(reg22)
正则表达式常用的两个方法
// test(string) let reg1:RegExp=/helloworld/i let website:string='helloworld.com' let result1:boolean=reg1.test(website) console.log(result1) //exec(string) let reg1:RegExp=/helloworld/i let website:string='helloworld.com' // let result1:boolean=reg1.test(website) console.log(reg1.exec(website))
11 面向对象编程-类的声明和使用
要学会使用类，才能new出对象来
类是对象具体事物的一个抽象
对象是类的具体表现
类的出现-增加代码复用性和维护性
一系列类的使用，都叫做面向对象编程
ts就是基于类的面向对象编程语言
如何声明类？大驼峰命名法
class XiaoJieJie{ name:string age:number constructor(name:string,age:number){ this.name=name; this.age=age } say(){ console.log('小哥哥好') } } let jiejie:XiaoJieJie=new XiaoJieJie('HLS',18) console.log(jiejie) jiejie.say()
12 面向对象编程-类的修饰符
public 共有的
protected
private
class XiaoJieJie{ public sex:string protected name:string private age:number public constructor(sex:string,name:string,age:number){ this.sex = sex this.name = name this.age = age } public sayHello(){ console.log('小哥哥') } protected sayLove(){ console.log('我爱你') } } var jiejie:XiaoJieJie=new XiaoJieJie('女','亦舒',22) console.log(jiejie.sex) // console.log(jiejie.name) // console.log(jiejie.age) jiejie.sayHello() // jiejie.sayLove()
注意私有的是不能访问的，VSCode会直接提示你
只读修饰符 readonly 不能改
只读属性必须在声明属性时就直接给它赋值，不要给空，它会报错
class Man{ public readonly sex:String='男' } var man:Man=new Man() //不能改,改的话会报错 man.sex='女'
13 面向对象编程-基础和重写
类必须有扩展能力
继承：允许我们创建一个类(子类)，从已有的类(父亲)上继承所有的属性和方法，子类可以新建父类中没有的属性和方法
父类：
class Hls{ public name:string public age:number public skill:string constructor(name:string,age:number,skill:string){ this.name = name this.age =age this.skill =skill } public interest(){ console.log('听歌') } } let hlsObj:Hls = new Hls('离散',18,'coding') hlsObj.interest()
子类继承：
ts不支持多重继承
class Cola extends Hls{ public xingxiang:string='魅力' public zhuangQian(){ console.log('赚了一个亿') } } let cola=new Cola('演员',3,'表演') cola.interest() cola.zhuangQian()
重写interest方法
class Cola extends Hls{ public xingxiang:string='魅力' public interest(){ super.interest() console.log('建立电商平台') } public zhuangQian(){ console.log('赚了一个亿') } } let cola=new Cola('演员',3,'表演') cola.interest()
14 面向对象编程-接口知识
接口:定义规范，就是规划程序化的东西
interface Hasband{ sex:string interest:string //接口可选参数，有个问号 maiBaoBao?:Boolean } let myhusband:Hasband={sex:'男',interest:'看书',maiBaoBao:true} console.log(myhusband)
定义一个函数
interface SearchMan{ (source:string,subString:string):boolean } //声明 let mySearch:SearchMan mySearch=function(source :string,subString:string):boolean{ //声明一个内部变量flag进行search(查找) let flag=source.search(subString) //不等于-1 就是true //等于-1 就是false return (flag!=-1) } //调用 console.log(mySearch('高，富，帅，德','胖'))
接口还可以规范类，和规范函数差不多
15 面向对象编程-命名空间
作用：让变量之间互不干扰
namespace shuaiGe{ export class Dehua{ public name:string = '刘德华' talk(){ console.log('我是歌手兼演员刘德华') } } } namespace bajie{ export class Dehua{ public name:string = '马德华' talk(){ console.log('我是马德华') } } } let dehua1:shuaiGe.Dehua=new shuaiGe.Dehua() let dehua2:bajie.Dehua=new bajie.Dehua() dehua1.talk() dehua2.talk()
