new

Ts/1_hello.html

@@ -26,7 +26,7 @@
 
   tsc + 文件名 可以把ts转化为js文件
   <!-- <script src="./1_hello.ts"></script> -->
-  <script src="./js/1hello.js"></script>
+  <!-- <script src="./js/1hello.js"></script> -->
 
 
   总结： ts中的文件 如果直接书写js中的代码  在html文件种直接引入ts  会进行报错
@@ -42,5 +42,9 @@
   3.启动监视任务：
     终端 -> 运行任务 ->监视
     
+
+  <!-- <script src="./js/2_类型注解.js"></script> -->
+  <!-- <script src="./js/3_接口.js"></script> -->
+  <script src="./js/4_类.js"></script>
 </body>
 </html>

Ts/2_类型注解.ts

@@ -0,0 +1,10 @@
+//类型注解： 是一个轻量级的为函数或者变量添加的约束
+//ts本身有静态分析代码的能力 可以分析代码结构和类型注解
+(()=>{
+  function showMsg(str:string){
+    return '黑龙江' + str
+  }
+  let msg = '哈尔滨'
+  // let msg = [10,20,30]
+  console.log(showMsg(msg))
+})()

Ts/3_接口.ts

@@ -0,0 +1,17 @@
+(()=>{
+  //定义一个接口
+  interface iPerson{
+    firstName: string
+    lastName: string
+  }
+  //输出名字
+  function showFullName(person:iPerson){
+    return person.firstName + '_' + person.lastName
+  }
+  //定义一个对象
+  const person = {
+    firstName: '山东',
+    lastName: '蓝翔'
+  }
+  console.log(showFullName(person))
+})()

Ts/4_类.ts

@@ -0,0 +1,30 @@
+(() => {
+  //定义一个接口
+  interface iPerson {
+    firstName: string
+    lastName: string
+  }
+  //定义一个类
+  class Person {
+    //定义公共的字段属性
+    firstName: string
+    lastName: string
+    fullName: string
+    //定义一个构造函数
+    constructor(firstName: string, lastName: string) {
+      this.firstName = firstName
+      this.lastName = lastName
+      this.fullName = this.firstName + this.lastName
+    }
+
+  }
+  //定义一个函数
+  function showFullName(person: iPerson) {
+    return person.firstName + '_' + person.lastName
+  }
+  //实例化对象
+  const person = new Person('山东', '蓝翔')
+
+  console.log(showFullName(person))
+
+})()

Ts/js/2_类型注解.js

@@ -0,0 +1,10 @@
+//类型注解： 是一个轻量级的为函数或者变量添加的约束
+//ts本身有静态分析代码的能力 可以分析代码结构和类型注解
+(function () {
+    function showMsg(str) {
+        return '黑龙江' + str;
+    }
+    var msg = '哈尔滨';
+    // let msg = [10,20,30]
+    console.log(showMsg(msg));
+})();

Ts/js/3_接口.js

@@ -0,0 +1,12 @@
+(function () {
+    //输出名字
+    function showFullName(person) {
+        return person.firstName + '_' + person.lastName;
+    }
+    //定义一个对象
+    var person = {
+        firstName: '山东',
+        lastName: '蓝翔'
+    };
+    console.log(showFullName(person));
+})();

Ts/js/4_类.js

@@ -0,0 +1,19 @@
+(function () {
+    //定义一个类
+    var Person = /** @class */ (function () {
+        //定义一个构造函数
+        function Person(firstName, lastName) {
+            this.firstName = firstName;
+            this.lastName = lastName;
+            this.fullName = this.firstName + this.lastName;
+        }
+        return Person;
+    }());
+    //定义一个函数
+    function showFullName(person) {
+        return person.firstName + '_' + person.lastName;
+    }
+    //实例化对象
+    var person = new Person('山东', '蓝翔');
+    console.log(showFullName(person));
+})();