ts

10.ts/4.面向对象/dist/1.类.js

@@ -0,0 +1,27 @@
+"use strict";
+// 通过class去定义类
+// 对象中包含两部分：属性  方法
+// readonly 只读
+// static 通过类进行使用 
+// 规避name字段
+class Person {
+    constructor() {
+        this.name = '孙悟空';
+        this.hi = false;
+    }
+    static say() {
+        console.log("大声说再见");
+    }
+}
+Person.age = 10;
+// 使用
+// 实例化对象 
+let p = new Person();
+p.name = '猪八戒';
+// p.age = 12;
+console.log(p, 'p');
+// console.log(p.age)
+Person.age = 12;
+console.log(Person.age, 'Person');
+// p.say()
+Person.say();

10.ts/4.面向对象/dist/2.构造函数和this.js

@@ -0,0 +1,24 @@
+"use strict";
+// 构造函数 =>  函数
+// function fn1() {
+//     console.log(this)
+// }
+// fn1();
+// new fn1();
+class Person1 {
+    constructor(name, age) {
+        console.log(this, 'this1');
+        this.name = name;
+        this.age = age;
+        console.log(this, 'this2');
+    }
+    play() {
+        console.log("我叫" + this.name);
+    }
+}
+let p1 = new Person1('哪吒', 3);
+let p2 = new Person1('唐僧', 30);
+console.log(p1, 'p1');
+console.log(p2, 'p2');
+p1.play();
+p2.play();

10.ts/4.面向对象/dist/3.继承.js

@@ -0,0 +1,36 @@
+"use strict";
+// (function(){})() 
+(function () {
+    class Money {
+        constructor(name, num) {
+            this.name = name;
+            this.num = num;
+        }
+        say() {
+            console.log("你好");
+        }
+    }
+    /**
+     * 继承 extends
+     * 因为想让多个子类同时拥有父类的属性或方法  所以产生继承
+     * 继承后 子类会拥有父类相同的内容
+     * 子类中 若出现与父类相同的方法 则进行覆盖
+     * 子类中 若出现与父类不相同的方法 则执行新方法
+     */
+    class A extends Money {
+        say() {
+            console.log("我叫a");
+        }
+        hello() {
+            console.log("haha");
+        }
+    }
+    class B extends Money {
+    }
+    let a = new A('喜羊羊', 100);
+    let b = new B('灰太狼', 50);
+    console.log(a, 'a');
+    console.log(b, 'b');
+    a.say();
+    a.hello();
+})();

10.ts/4.面向对象/dist/4.super.js

@@ -0,0 +1,31 @@
+"use strict";
+// (function(){})() 
+(function () {
+    class Money {
+        constructor(name, num) {
+            this.name = name;
+            this.num = num;
+        }
+        say() {
+            console.log("你好");
+        }
+    }
+    /**
+     * super
+     * 如果子类要使用父类中属性
+     * 子类的构造函数必须对父类的构造函数重新进行接受
+     * 使用super
+     */
+    class A extends Money {
+        constructor(name, num, age) {
+            super(name, num);
+            this.age = age;
+        }
+    }
+    class B extends Money {
+    }
+    let a = new A('喜羊羊', 100, 18);
+    let b = new B('灰太狼', 50);
+    console.log(a, 'a');
+    console.log(b, 'b');
+})();

10.ts/4.面向对象/dist/5.抽象类.js

@@ -0,0 +1,23 @@
+"use strict";
+(function () {
+    /**
+     * abstract 与 其他类大差不差
+     * 不是为了实例化对象
+     * 是因为继承才产生的类
+     * 抽象类中方法没用具体内容 只有方法体
+     * 在继承中写具体方法
+     */
+    class Toy {
+        constructor(name) {
+            this.name = name;
+        }
+    }
+    class A extends Toy {
+        say() {
+            console.log(this.name + '说你好');
+        }
+    }
+    let a = new A("迪迦奥特曼");
+    console.log(a);
+    a.say();
+})();

10.ts/4.面向对象/dist/6.接口.js

@@ -0,0 +1,22 @@
+"use strict";
+(function () {
+    // 类去继承接口
+    class Person {
+        constructor(name1, name2, name3) {
+            this.name1 = name1;
+            this.name2 = name2;
+            this.name3 = name3;
+        }
+        say() {
+            console.log(this.name1, this.name2, this.name3);
+        }
+    }
+    let p = new Person('水仙', "1", "1");
+    console.log(p);
+    p.say();
+    const aa = {
+        color: 'red',
+        flower: '牡丹'
+    };
+    console.log(aa);
+})();

10.ts/4.面向对象/dist/7.属性的封装.js

@@ -0,0 +1,51 @@
+"use strict";
+(function () {
+    // 属性的封装：更加安全
+    // public 公有的
+    // private 私有的 只能在当前类中进行访问
+    // class Person {
+    //     name:string;
+    //    private age: number;
+    //     constructor(name:string,age:number) {
+    //         this.name = name;
+    //         this.age = age;
+    //     }
+    //     get age1() {
+    //         return this.age;
+    //     }
+    //     set age1(val) {
+    //         this.age = val
+    //     }
+    //     // get name1() {
+    //     // }
+    //     // getAge() {
+    //     //     return this.age
+    //     // }
+    //     // setAge(val) {
+    //     //     return this.age = val; 
+    //     // }
+    // }
+    // let p = new Person('孙悟空',100000);
+    // // p.age = 20;
+    // console.log(p)
+    // // console.log(p.age)
+    // p.age1 = 10;
+    // console.log(p.age1)
+    // console.log(p.setAge(10))
+    // console.log(p.getAge())
+    class A {
+        constructor(num) {
+            this.num = num;
+        }
+    }
+    class B extends A {
+        aa() {
+            console.log("你好");
+        }
+    }
+    const b = new B(12);
+    b.num = 11;
+    // B.num = 122;
+    console.log(B.num);
+    console.log(b);
+})();

10.ts/4.面向对象/dist/8.泛型.js

@@ -0,0 +1,2 @@
+"use strict";
+// (function)

10.ts/4.面向对象/index.html

@@ -0,0 +1,11 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+</head>
+<body>1
+    <script src="./dist/7.属性的封装.js"></script>
+</body>
+</html>

10.ts/4.面向对象/src/1.类.ts

@@ -0,0 +1,26 @@
+// 通过class去定义类
+// 对象中包含两部分：属性  方法
+// readonly 只读
+// static 通过类进行使用 
+// 规避name字段
+class Person {
+    name:string = '孙悟空';
+   static age:number = 10;
+    hi:boolean = false;
+    static say() {
+        console.log("大声说再见")
+    }
+}
+
+// 使用
+// 实例化对象 
+let  p = new Person();
+p.name = '猪八戒';
+// p.age = 12;
+
+console.log(p,'p')
+// console.log(p.age)
+Person.age = 12;
+console.log(Person.age,'Person')
+// p.say()
+Person.say();

10.ts/4.面向对象/src/2.构造函数和this.ts

@@ -0,0 +1,26 @@
+// 构造函数 =>  函数
+// function fn1() {
+//     console.log(this)
+// }
+// fn1();
+// new fn1();
+class Person1 {
+    name:string;
+    age: number;
+    constructor(name:string,age:number) {
+        console.log(this,'this1')
+        this.name = name;
+        this.age = age;
+        console.log(this,'this2')
+    }
+    play() {
+        console.log("我叫"+this.name)
+    }
+}
+
+let p1 = new Person1('哪吒',3);
+let p2 = new Person1('唐僧',30);
+console.log(p1,'p1');
+console.log(p2,'p2');
+p1.play()
+p2.play()

10.ts/4.面向对象/src/3.继承.ts

@@ -0,0 +1,38 @@
+// (function(){})() 
+(function() {
+    class Money {
+        name: string;
+        num: number;
+        constructor(name:string,num:number) {
+            this.name = name;
+            this.num = num;
+        }
+        say() {
+            console.log("你好")
+        }
+    }
+    /**
+     * 继承 extends
+     * 因为想让多个子类同时拥有父类的属性或方法  所以产生继承
+     * 继承后 子类会拥有父类相同的内容
+     * 子类中 若出现与父类相同的方法 则进行覆盖
+     * 子类中 若出现与父类不相同的方法 则执行新方法
+     */
+    class A extends Money {
+        say() {
+            console.log("我叫a")
+        }
+        hello() {
+            console.log("haha")
+        }
+    }
+    class B extends Money {
+
+    }
+    let a = new A('喜羊羊',100);
+    let b = new B('灰太狼',50);
+    console.log(a,'a');
+    console.log(b,'b')
+    a.say()
+    a.hello()
+})()

10.ts/4.面向对象/src/4.super.ts

@@ -0,0 +1,34 @@
+// (function(){})() 
+(function() {
+    class Money {
+        name: string;
+        num: number;
+        constructor(name:string,num:number) {
+            this.name = name;
+            this.num = num;
+        }
+        say() {
+            console.log("你好")
+        }
+    }
+    /**
+     * super
+     * 如果子类要使用父类中属性
+     * 子类的构造函数必须对父类的构造函数重新进行接受
+     * 使用super
+     */
+    class A extends Money {
+        age:number;
+        constructor(name:string,num:number,age:number) {
+            super(name,num);
+            this.age=age;
+        }
+    }
+    class B extends Money {
+
+    }
+    let a = new A('喜羊羊',100,18);
+    let b = new B('灰太狼',50);
+    console.log(a,'a');
+    console.log(b,'b')
+})()

10.ts/4.面向对象/src/5.抽象类.ts

@@ -0,0 +1,25 @@
+(function(){
+    /**
+     * abstract 与 其他类大差不差
+     * 不是为了实例化对象
+     * 是因为继承才产生的类
+     * 抽象类中方法没用具体内容 只有方法体
+     * 在继承中写具体方法
+     */
+    abstract class Toy {
+        name:string;
+        constructor(name) {
+            this.name = name;
+        }
+
+        abstract say():void
+    }
+    class A extends Toy {
+        say() {
+            console.log(this.name+'说你好')
+        }
+    }
+    let a = new A("迪迦奥特曼")
+    console.log(a)
+    a.say()
+})()

10.ts/4.面向对象/src/6.接口.ts

@@ -0,0 +1,50 @@
+(function() {
+    /**
+     * 接口：定义数据的规范
+     */
+    interface vase {
+        name1:string,
+        name2:string
+    }
+
+    interface vase {
+        name3:string
+    }
+ 
+
+    // 类去继承接口
+    class Person implements vase {
+        // name1:string;
+        // constructor(name1:string) {
+        //     this.name1 = name1;
+        // }
+        name1: string;
+        name2: string;
+        name3: string;
+        constructor(name1:string,name2:string,name3:string) {
+            this.name1 = name1;
+            this.name2 = name2;
+            this.name3 = name3;
+
+        }
+        say() {
+            console.log(this.name1,this.name2,this.name3)
+        }
+    }
+    let p = new Person('水仙',"1","1");
+    console.log(p)
+    p.say()
+
+
+
+    // type 类型别名
+    type obj = {
+        color:string,
+        flower:string
+    }
+    const aa:obj = {
+        color:'red',
+        flower:'牡丹'
+    }
+    console.log(aa)
+})()

10.ts/4.面向对象/src/7.属性的封装.ts

@@ -0,0 +1,57 @@
+(function() {
+    // 属性的封装：更加安全
+    // public 公有的
+    // private 私有的 只能在当前类中进行访问
+    // class Person {
+    //     name:string;
+    //    private age: number;
+    //     constructor(name:string,age:number) {
+    //         this.name = name;
+    //         this.age = age;
+    //     }
+    //     get age1() {
+    //         return this.age;
+    //     }
+    //     set age1(val) {
+    //         this.age = val
+    //     }
+    //     // get name1() {
+
+    //     // }
+    //     // getAge() {
+    //     //     return this.age
+    //     // }
+    //     // setAge(val) {
+    //     //     return this.age = val; 
+    //     // }
+    // }
+    // let p = new Person('孙悟空',100000);
+
+    // // p.age = 20;
+    // console.log(p)
+    // // console.log(p.age)
+    // p.age1 = 10;
+    // console.log(p.age1)
+
+    // console.log(p.setAge(10))
+    // console.log(p.getAge())
+
+    class A {
+        num:number;
+        constructor(num:number) {
+            this.num = num;
+        }
+    }
+    class B extends A {
+      static num: number;
+      aa(){
+        console.log("你好")
+      }  
+    }
+    const b = new B(12);
+    b.num = 11;
+    // B.num = 122;
+    console.log(B.num)
+
+    console.log(b)
+})()

10.ts/4.面向对象/src/8.泛型.ts

@@ -0,0 +1 @@
+// (function)

10.ts/4.面向对象/tsconfig.json

@@ -0,0 +1,16 @@
+{
+    "include": [
+        "./src/**/*"
+    ],
+    "compilerOptions": {
+        "moduleResolution": "Node",
+        "target": "ES6",
+        "module": "ES2015",
+        "lib": ["dom","ES2015"],
+        "outDir": "./dist",
+        "strict": true,
+        "noImplicitThis": false,
+        "noImplicitAny": false,
+        "noEmitOnError": true
+    }
+}