git stash、原型链、初始Ts

DeepLemon
83 阅读6分钟

一.git stash 知识点

二.原型链知识点

三.初始Ts 知识点

1.Vscode中git stash 知识点

1.1克隆项目：

image.png

1.2添加到暂存区

image.png

1.3添加本地仓库

image.png

1.4提交到远程仓库：

image.png

2.原型链知识点：

2.1构造函数：

<script>
    console.log(this);//在全局作用域下this指向window
    声明的构造函数首字母大写
    构造函数的静态成员 和实例成员
    function Str(name, age) {
        this.name = name  实例成员就是通过给this上添加的属性和方法
        this.age = age
        this.sing=function() {
            console.log('我会跳舞');
        }
        console.log(this);  指向实例化出来的对象
    }
    let ldh = new Str('刘德华', 33)
    let zjl = new Str('周杰伦', 30)
    console.log(ldh);

![image.png](https://p6-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/1b96b3e13afe451d890dc2b83c86a40c~tplv-k3u1fbpfcp-watermark.image?)
![image.png](https://p6-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/b93b78c36e584ead9002f5823f3436e0~tplv-k3u1fbpfcp-watermark.image?)
![image.png](https://p6-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/ac665719c6f94a4691c22e06253670e3~tplv-k3u1fbpfcp-watermark.image?)
    Str.dance = '会跳舞' 构造函数的静态成员就是在构造函数本身添加属性和方法

    Str.prototype.hobby = function () {  在构造函数的原型上添加的属性和方法
        console.log('I am superstate');  在所有实例中都可以拿到
    }
    console.dir(Str); 
    挂载都实例上的方法
    console.log(ldh.sing===zjl.sing);  false 挂载到实例上的方法不相等
    console.log(ldh.hobby===zjl.hobby);  true 挂载到原型上的方法相等
    因此把属性和方法挂载到实例上是比较浪费资源的,所以建议把属性和方法都挂载到原型上
     挂载到原型上的属性和方法其他实例都能获取到
</script>

2.2三角关系：

<script>
    function PerSon(name, age) {

        this.name = name
        this.age = age
        this.sing=function() {
            return '大boos非常有钱'
        }
        console.log(this); PerSon {} this指向实例化出来的对象
    }
    let maYun = new PerSon('马云', '35')
    console.log(maYun); //PerSon {}
    let maHuaTeng=new PerSon('马化腾','38')
    PerSon.prototype.sex='男'
    PerSon.prototype.work=function() {
       return '搬砖'
    }
    在原型上挂载的方法和属性在实例化对象中都可以拿到
    console.log(maYun.sex);
    console.log(maHuaTeng.sex);
    console.log(maYun.work());
    console.log(maHuaTeng.work());
    ```三角链关系```
     1.每个实例化出来的隐士原型都指向构造函数自身的显示原型
    console.log(maYun.__proto__===PerSon.prototype);  //true
    2.每个实例化对象的隐士原型的constructor都指向构造函数本身
    console.log(maYun.__proto__.constructor==PerSon); //true
     3.每个构造函数的原型上的constructor都指向构造函数本身 
    console.log(PerSon.prototype.constructor===PerSon);  //true
</script>

image.png

三 .初始Ts 知识点

3.1TypeScript简介：

3.2TypeScript发展介绍

  1. 什么是TypeScript：
  • TypeScript简称 TS，可以理解为是 JavaScript 的扩展，扩展了 js 的语法，因此我们可以在 ts 中继续写 js 的代码而不会报错
  • TypeScript 又叫做静态的 JavaScript，不能直接引入到 html 中，不能直接被浏览器识别，需要经过 ts 转换器或者是 babel 转化后才能使用
  • Typed JavaScript at Any Scale (它强调了 TypeScript 的两个最重要的特性——类型系统、适用于任何规模)；也就是说：TypeScript 是添加了类型系统的 JavaScript，适用于任何规模的项目。
  1. 关于 TypeScript:
  • TypeScript 是 JavaScript 的一个超集，主要提供了类型系统和对 ES6 的支持，它由 Microsoft 开发，代码开源于 GitHub 上。

image.png image.png

  • 它的第一个版本发布于 2012 年 10 月，经历了多次更新后，现在已成为前端社区中不可忽视的力量，不仅在 Microsoft 内部得到广泛运用，而且 Google 开发的 Angular 从 2.0 开始就使用了 TypeScript 作为开发语言，Vue 3.0 也使用 TypeScript 进行了重构。
  1. 支持性、兼容性、扩展性、实用性介绍
  • TypeScript 的另一个重要的特性就是坚持与 ECMAScript 标准同步发展。
  • 除了实现 ECMAScript 标准之外，TypeScript 团队也推进了诸多语法提案，比如可选链操作符（?.）、空值合并操作符（??)、Throw 表达式、正则匹配索引等。

3.3 TS安装

image.png

3.4 弱类型语言：

  • js 弱类型语言
  • 区分强弱类型的关键就是他能不能发生隐式转换
  • console.log(1+'1') //打印出字符串11
  • TypeScript 是完全兼容JavaScript的，它不会修改JavaScript 运行时的特性，所以他们都是弱类型

4.Ts的数据类型：

  • ts中为了使编写的代码更规范，更有利于维护，增加了类型校验，在ts中主要提供了以下数据类型：

4.1布尔类型：

布尔值是最基础的数据类型，在 TypeScript 中，使用 boolean 定义布尔值类型：

let isDone: boolean = false;
编译通过后面约定，未强调编译错误的代码片段，默认为编译通过

4.2数字类型

image.png 使用 number 定义数值类型：

let decLiteral: number = 6;
let hexLiteral: number = 0xf00d;
// ES6 中的二进制表示法
let binaryLiteral: number = 0b1010;
// ES6 中的八进制表示法
let octalLiteral: number = 0o744;
let notANumber: number = NaN;
let infinityNumber: number = Infinity;

4.3字符串类型

使用 string 定义字符串类型：

let myName: string = 'Tom';
let myAge: number = 25;

模板字符串
let sentence: string = `Hello, my name is ${myName}.
I'll be ${myAge + 1} years old next month.`;

4.4void类型

JavaScript 没有空值（Void）的概念，在 TypeScript 中，可以用 void 表示没有任何返回值的函数

function alertName(): void {
    console.log('My name is Tom');
}
  • 声明一个 void 类型的变量没有什么用，因为你只能将它赋值为 undefined 和 null
  • let unusable: void = undefined;

4.5undefined 和null 类型

在 TypeScript 中，可以使用 null 和 undefined 来定义这两个原始数据类型：

let u: undefined = undefined;
let n: null = null;

与 void 的区别是，undefined 和 null 是所有类型的子类型。也就是说 undefined 类型的变量，可以赋值给 number 类型的变量：

 这样不会报错;注意需要提前关闭严格模式
let num: number = undefined;
​
这样也不会报错
let u: undefined;
let num: number = u;

4.6 never其他类型

  1. never类型表示的是那些永不存在的值的类型。 例如， never类型是那些总是会抛出异常或根本就不会有返回值的函数表达式或箭头函数表达式的返回值类型； 变量也可能是 never类型，当它们被永不为真的类型保护所约束时。
  2. never类型是任何类型的子类型，也可以赋值给任何类型；然而，没有类型是never的子类型或可以赋值给never类型（除了never本身之外）。 即使 any也不可以赋值给never。

5.Ts中的数组：

5.1 数组

5.1.1 声明数组的方法

  1. 类型 + 方括号」表示法

    let numArr:number[] = [1,2,3,4] // 声明一个数组，数组的元素只能是数字类型

let strArr:string
numArr.push(10) // 正常追加

//错误的写法，因为限制了 numArr这个数组只能有数字类型的元素
numArr.push('1') // 报错 类型“string”的参数不能赋给类型“number”的参数。


// 声明一个数组 元素只能是 布尔类型的
let boolArr:boolean[] = []

// 声明一个数组 元素只能是 字符串类型的
let boolArr:string[] = []

  2. 数组泛型

    // 使用泛型声明数组：
let numArr:Array<number> = [1,2] // 声明一个数组，只能包含数字类型的元素
let numArr:Array<string> = ['a','b'] // 声明一个数组，只能包含字符串类型的元素

5.2. 元组

​ 数组合并了相同类型的对象，而元组（Tuple）合并了不同类型的对象。

  1. 定义元组

    定义一对值分别为 string 和 number 的元组：

    let tom: [string, number] = ['Tom', 25];

    当赋值或访问一个已知索引的元素时，会得到正确的类型：

    let tom: [string, number];
tom[0] = 'Tom';
tom[1] = 25;

tom[0].slice(1);
tom[1].toFixed(2);

    也可以只赋值其中一项：

    let tom: [string, number];
tom[0] = 'Tom';

    注意：但是当直接对元组类型的变量进行初始化或者赋值的时候，需要提供所有元组类型中指定的项。

    // 正确的写法
let tom: [string, number];
tom = ['Tom', 25];

//错误的写法
let tom: [string, number];
tom = ['Tom']; // Property '1' is missing in type '[string]' but required in type '[string, number]'.

5.3 类型推论

​ 如果没有明确的指定类型，那么 TypeScript 会依照类型推论（Type Inference）的规则推断出一个类型。

  1. 什么是类型推论

    TypeScript 会在没有明确的指定类型的时候推测出一个类型，这就是类型推论。

    以下代码虽然没有指定类型，但是会在编译的时候报错：

    let str = 'seven';
str = 7;
// error TS2322: Type 'number' is not assignable to type 'string'.

    事实上，上面的代码等价于：

    let str: string = 'seven';
str = 7;
// error TS2322: Type 'number' is not assignable to type 'string'.

  2. 推论any类型

    如果定义的时候没有赋值，不管之后有没有赋值，都会被推断成 any 类型而完全不被类型检查：

    let str;
str = 'seven';
str = 7;

5.4 联合类型

联合类型表示取值可以为多种类型中的一种。

  1. 语法

    let numStr: string | number;
numStr = 'seven';
numStr = 7;

// 以下是错误的
let numStr: string | number;
numStr = true;

// Type 'boolean' is not assignable to type 'string | number'

    联合类型使用 | 分隔每个类型。

    这里的 let numStr: string | number 的含义是，允许 numStr 的类型是 string 或者 number，但是不能是其他类型。

  2. 访问联合类型的属性或方法

    当 TypeScript 不确定一个联合类型的变量到底是哪个类型的时候，我们只能访问此联合类型的所有类型里共有的属性或方法

    function getLength(something: string | number): number {
    return something.length;
}

// Property 'length' does not exist on type 'string | number'.
//  Property 'length' does not exist on type 'number'.

    上例中，length 不是 string 和 number 的共有属性，所以会报错。

    访问 string 和 number 的共有属性是没问题的：

    function getString(something: string | number): string {
    return something.toString();
}
avatar
文章
阅读
粉丝