入坑typescript了

今天算是正式入坑 typescript 了,基于 vue 写了第一个函数,用来做一个文字效果。

演示效果:

整体思路听简单的,就是用定时器和延时器来做,通过定时器来间隔的处理文本,延时器来延后所有的方法。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
class TextHandle {
private allDuration: number = 0;
public appendText(text: string) : void {
setTimeout(() = >{
const LeftMessage = document.getElementById('LeftMessage');
if (LeftMessage === null) {
return;
}

let index: number = 0;
const MessageText: string = LeftMessage.innerText;

// tslint:disable-next-line:only-arrow-functions
const interval = setInterval(function() {
if ((LeftMessage === null) || (index++ === text.length + 1)) {
return clearInterval(interval);
}

LeftMessage.innerText = MessageText + text.substring(0, index);
},
300);
},
this.AllDuration);
this.AllDuration += text.length * 300 + 100;
}
}

typescript确实挺不错的,平时都在写静态语言,如C++,所以当我开始学动态语言的时候,就会觉得水土不服,现在
通过typescript就可以让我继续使用静态语言的开发方式来写web,而且代码更容易理解。


本博客所有文章除特别声明外,均采用 CC BY-SA 4.0 协议 ,转载请注明出处!