一、前言

太阳编辑器功能强大,除了不能直接像WE那样直接编辑地形,物编、触发、文件导入的功能的功能都是非常的方便。例如用xlsx批量管理(编辑)物编,JASS转TS,TS编辑触发,UI编辑器等等。 正如太阳编辑器宣传那样——“作图时间:太阳rpg编辑器(40%) + VSCode/WebStorm(40%) + WPS(10%) + WE(10%)”,所以太阳编辑器的最大优势就是:缩短地图编辑时间、增强触发在地图间移植。

这篇笔记主要按照魔兽编辑器触发讲讲TypeScript。如果你暂时不敢兴趣可以跳过,先去看看其他感兴趣的内容。

如果你想用TS做图或者JASS转TS,那么就必须学点TypeScript编程语言基础。太阳编辑器的开发者建议大家去菜鸟教程(www.runoob.com)学习:基础类型、变量声明、类、对象。

二、基础类型

TypeScript的基础类型相当于魔兽编辑器的变量类型。TypeScript包含的数据类型有any、字符串、布尔类型、数组、元组、枚举、void等等。 而魔兽触发编辑器里的变量类型除了布尔类型、整数、实数、字符串,还有物品、单位、玩家、点、区域、对话框、计时器、多面板等等。

三、变量声明

在太阳编辑器中一般使用let声明变量。  有时也会使用static、const。很少使用var。

1、let和var的区别

简单来说,两者的差别:

(1)作用域不同。var是函数作用域,let是块作用域。

在函数中声明了var,整个函数内都是有效的,比如说在for循环内定义的一个var变量,实际上其在for循环以外也是可以访问的。

而let由于是块作用域,所以如果在块作用域内定义的变量,比如说在for循环内,在其外面是不可被访问的,所以for循环推荐用let

(2)let不能在定义之前访问该变量,但是var可以。

let必须先声明,再使用。而var先使用后声明也行,只不过直接使用但没有定义的时候,其值是undefined。var有一个变量提升的过程,当整个函数作用域被创建的时候,实际上var定义的变量都会被创建,并且如果此时没有初始化的话,则默认为初始化一个undefined。

(3)let不能在1个作用域里多次被重新定义,但是var是可以的。

let a = 5;
let a = 6;
console.log(a) //报错

var a = 5;
var a = 6;
console.log(a) //输出6

详细了解可以访问TypeScript 中文网:www.tslang.cn/docs/handbook/variable-declarations.html

2、let和const的区别

结合上面的内容先说下两者相同之处:

(1) 都是块级作用域。在块外无法访问块内声明的变量。

(2)都不能先使用,后声明

(3)都不能在1个作用域里多次被重新定义

两者的不同之处:

let声明的是变量,值和类型可以改变;const声明的是常量,不可以改变,这意味着,const一旦声明,就必须立即初始化,不能以后再赋值。

3、let和static的区别

static声明的是静态变量,用于类作用域,可以通过类名(从类作用域)直接访问。

四、函数

魔兽编辑器JASS也有函数,以function开头,endfunction结尾。

TypeScript的函数更为简洁:

function 函数名(参数名1:参数类型 , 参数名2:参数类型)
{
// 执行代码
}

调用直接就是:函数名()

注意:TypeScript定义了参数,则我们必须传入这些参数;否则在:前使用问号标识 ?,表示该参数为可选参数。另外可选参数必须跟在必需参数后面。

默认参数、剩余参数、匿名函数等介绍请直接访问菜鸟教程(www.runoob.com/typescript/ts-function.html)。

(一)构造函数

语法格式如下:

var 构造函数名= new Function ([参数名字1[, 参数名字2[, ...参数名字N]],] functionBody)

 

(二)箭头函数

箭头函数表达式的语法比函数表达式更短。用=>代替了function。

var foo = (x:number)=> {
x = 10 + x
console.log(x)
}
foo(100)

五、类

1、定义类的关键字为 class。类可以包含以下几个模块(类的数据成员):

  • 字段 − 字段是类里面声明的变量。字段表示对象的有关数据。
  • 构造函数 − 类实例化时调用,可以为类的对象分配内存。
  • 方法 − 方法为对象要执行的操作。

为什么在类中经常使用构造函数?简单的说。就是用了构造函数的类,可以在构造函数中进行参数的接收,从而产生不同的实例。

class Dog {
name: string = '旺财'
age: number = 3
bark(): void {
alert('旺旺旺!')
}
}
let dog1 = new Dog()
let dog2 = new Dog()
let dog3 = new Dog()
console.log(dog1)
console.log(dog2)
console.log(dog3)

没有构造函数,狗1、狗2、狗3都是叫“3岁的旺财”。

class Dog {
name: string;
age: number;

/*constructor被称为构造函数
构造函数会在创建的时候调用
* */
constructor(name: string, age: number) { //在构造函数中进行参数的接收
// console.log(this) //在构造函数中,this指向于当前实例化对象
this.name = name;
this.age = age
}

bark(): void {
console.log(this) //表示当前调用方法的那个对象
console.log(`${this.name}在汪汪汪`)
}
}

let dog1 = new Dog('小白', 1)
dog1.bark()
let dog2 = new Dog('旺财', 2)

有了构造函数,我我能区分小白汪汪叫和旺财的汪汪叫。

2、使用 new 关键字来实例化类的对象。为什么要实例化对象?类是对象的抽象,而对象是类的具体实例。类是抽象的,不占用内存,而对象是具体的,占用存储空间。

3、类继承使用关键字 extends。语法格式如下:

class 子类名称 extends 父类名称

子类除了不能继承父类的私有(private )成员(方法和属性)和构造函数,其他的都可以继承。

static 关键字用于定义类的数据成员(属性和方法)为静态的,静态成员可以直接通过类名调用。

在TypeScript里,成员都默认为 public

构造函数里使用this.来访问实例属性?使用 Grid.来访问静态属性。

六、对象

语法表达如下。需要注意的是key值后面除了最后一句没,其他都以,号结尾.

var object_name = {
key1: "value1", // 标量
key2: "value",
key3: function() {
// 函数
},
key4:["content1", "content2"] //集合
}

可以用类型模板给对象添加方法。此外对象也可以作为一个参数传递给函数。

七、总结

以上内容为本羊边学边记录的,在后面的实践中会逐渐完善本文。完整参悟还是需要反复研究菜鸟教程和TypeScript 中文网。