new

Ts/tsconfig.json → Ts/初识Ts/tsconfig.json

@@ -14,7 +14,7 @@
     // "declarationMap": true,                      /* Generates a sourcemap for each corresponding '.d.ts' file. */
     // "sourceMap": true,                           /* Generates corresponding '.map' file. */
     // "outFile": "./",                             /* Concatenate and emit output to single file. */
-    "outDir": "./js",//指定的输出目录                              /* Redirect output structure to the directory. */
+    // "outDir": "./js",//指定的输出目录                              /* Redirect output structure to the directory. */
     // "rootDir": "./",//指定输出的文件目录 控制输出目录结构                             /* Specify the root directory of input files. Use to control the output directory structure with --outDir. */
     // "composite": true,                           /* Enable project compilation */
     // "tsBuildInfoFile": "./",                     /* Specify file to store incremental compilation information */

Ts基础/1_基本数据类型.ts

@@ -0,0 +1,99 @@
+(()=>{
+  //布尔类型
+  let isDone = false
+  // isDone = 10
+  // isDone = 'true'
+  // isDone = undefined
+  // isDone = null
+  console.log(isDone)
+
+  //数字类型
+  let a1 = 10 //二进制
+  let a2 = 10 //十进制
+  let a3 = 10 //八进制
+  let a4 = 0xa //十六进制
+  console.log(a1)
+  console.log(a2)
+  console.log(a3)
+  console.log(a4)
+
+  //字符串类型
+  let name = 'tom'
+  console.log(name)
+
+  //字符串和数字之间能够进行拼接么？
+  let str5 = '我有这么多钱'
+  let num = 10000000
+  console.log(str5 + num)
+  //可以进行拼接  js的方式
+
+  let und = undefined
+  let nll = null
+  console.log(und,nll)
+  //默认情况下  null和undefined是所有类型的子类型
+
+
+  //数组类型
+  //数组类型定义方式1 元素类型后面接上[]
+  let arr1: number[] = [1,2,3,4,5]
+  let arr2: string[] = ['1','2','3']
+  console.log(arr1)
+  console.log(arr2)
+  //数组类型定义方式2 使用数组泛型
+  var arr3: Array<number> = [1,2,3,4]
+  var arr4: Array<string> = ['1','2','3']
+  console.log(arr3)
+  console.log(arr4)
+  //注意： 数组定义后，里面的数据的类型必须和定义数组时候的类型完全一致
+
+  // var arr5: Array<number> = ['小明',123,true,null,undefined]
+  let arr6 = ['小明',123,true]
+  console.log(arr6)
+  // console.log(arr6[3].split(''))
+
+
+  //元组类型 (Tuple)
+  let t1:[string,number,string] = ['小明',123,'小红']
+  console.log(t1)
+  // console.log(t1[0].split(''))
+  // console.log(t1[1].split(''))
+
+
+  //枚举 
+  //枚举里面的每个数据值都可以叫做元素 每个元素都有自己的编号 从0开始
+  enum Color{
+    Red = 1,
+    Green = 3,
+    Blue =7
+  }
+  let myColor: Color = Color.Blue
+  let myColor1: string = Color[3]
+  console.log(Color)
+  console.log(myColor)
+  console.log(myColor1)
+
+  //any类型
+  //在编程阶段  可能我们还不知道这个变量最终为什么类型 这个时候 赋值一个any类型
+  let nnn: any = 100
+  // nnn = 'xiaohong'
+  nnn = true
+  console.log(nnn)
+  let xxx: any[] = [1,true,'xiaoming']
+  console.log(xxx)
+  //当一个数组种要存储多个数据类型 不确定的时候 可以使用any来定义数组
+
+  //这种时候  没有任何错误的提示信息 
+  // console.log(xxx[0].split(''))
+
+
+  //void 类型
+  //某种意义上来说 any类型的反面  表示没有任何类型
+
+  function showMsg(): void{
+    console.log('hello word')
+  }
+  console.log(showMsg())
+
+  //声明一个void变量没什么用 只能赋值 null undefined
+  let aaa: void = undefined
+})()

Ts基础/js/1_基本数据类型.js

@@ -0,0 +1,83 @@
+(function () {
+    //布尔类型
+    var isDone = false;
+    // isDone = 10
+    // isDone = 'true'
+    // isDone = undefined
+    // isDone = null
+    console.log(isDone);
+    //数字类型
+    var a1 = 10; //二进制
+    var a2 = 10; //十进制
+    var a3 = 10; //八进制
+    var a4 = 0xa; //十六进制
+    console.log(a1);
+    console.log(a2);
+    console.log(a3);
+    console.log(a4);
+    //字符串类型
+    var name = 'tom';
+    console.log(name);
+    //字符串和数字之间能够进行拼接么？
+    var str5 = '我有这么多钱';
+    var num = 10000000;
+    console.log(str5 + num);
+    //可以进行拼接  js的方式
+    var und = undefined;
+    var nll = null;
+    console.log(und, nll);
+    //默认情况下  null和undefined是所有类型的子类型
+    //数组类型
+    //数组类型定义方式1 元素类型后面接上[]
+    var arr1 = [1, 2, 3, 4, 5];
+    var arr2 = ['1', '2', '3'];
+    console.log(arr1);
+    console.log(arr2);
+    //数组类型定义方式2 使用数组泛型
+    var arr3 = [1, 2, 3, 4];
+    var arr4 = ['1', '2', '3'];
+    console.log(arr3);
+    console.log(arr4);
+    //注意： 数组定义后，里面的数据的类型必须和定义数组时候的类型完全一致
+    // var arr5: Array<number> = ['小明',123,true,null,undefined]
+    var arr6 = ['小明', 123, true];
+    console.log(arr6);
+    // console.log(arr6[3].split(''))
+    //元组类型 (Tuple)
+    var t1 = ['小明', 123, '小红'];
+    console.log(t1);
+    // console.log(t1[0].split(''))
+    // console.log(t1[1].split(''))
+    //枚举 
+    //枚举里面的每个数据值都可以叫做元素 每个元素都有自己的编号 从0开始
+    var Color;
+    (function (Color) {
+        Color[Color["Red"] = 1] = "Red";
+        Color[Color["Green"] = 3] = "Green";
+        Color[Color["Blue"] = 7] = "Blue";
+    })(Color || (Color = {}));
+    var myColor = Color.Blue;
+    var myColor1 = Color[3];
+    console.log(Color);
+    console.log(myColor);
+    console.log(myColor1);
+    //any类型
+    //在编程阶段  可能我们还不知道这个变量最终为什么类型 这个时候 赋值一个any类型
+    var nnn = 100;
+    // nnn = 'xiaohong'
+    nnn = true;
+    console.log(nnn);
+    var xxx = [1, true, 'xiaoming'];
+    console.log(xxx);
+    //当一个数组种要存储多个数据类型 不确定的时候 可以使用any来定义数组
+    //这种时候  没有任何错误的提示信息 
+    // console.log(xxx[0].split(''))
+    //void 类型
+    //某种意义上来说 any类型的反面  表示没有任何类型
+    function showMsg() {
+        console.log('hello word');
+    }
+    console.log(showMsg());
+    //声明一个void变量没什么用 只能赋值 null undefined
+    var aaa = undefined;
+})();

Ts基础/tsconfig.json

@@ -0,0 +1,72 @@
+{
+  "compilerOptions": {
+    /* Visit https://aka.ms/tsconfig.json to read more about this file */
+
+    /* Basic Options */
+    // "incremental": true,                         /* Enable incremental compilation */
+    "target": "es5",                                /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017', 'ES2018', 'ES2019', 'ES2020', 'ES2021', or 'ESNEXT'. */
+    "module": "commonjs",                           /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', 'es2020', or 'ESNext'. */
+    // "lib": [],                                   /* Specify library files to be included in the compilation. */
+    // "allowJs": true,                             /* Allow javascript files to be compiled. */
+    // "checkJs": true,                             /* Report errors in .js files. */
+    // "jsx": "preserve",                           /* Specify JSX code generation: 'preserve', 'react-native', 'react', 'react-jsx' or 'react-jsxdev'. */
+    // "declaration": true,                         /* Generates corresponding '.d.ts' file. */
+    // "declarationMap": true,                      /* Generates a sourcemap for each corresponding '.d.ts' file. */
+    // "sourceMap": true,                           /* Generates corresponding '.map' file. */
+    // "outFile": "./",                             /* Concatenate and emit output to single file. */
+    "outDir": "./js",                              /* Redirect output structure to the directory. */
+    // "rootDir": "./",                             /* Specify the root directory of input files. Use to control the output directory structure with --outDir. */
+    // "composite": true,                           /* Enable project compilation */
+    // "tsBuildInfoFile": "./",                     /* Specify file to store incremental compilation information */
+    // "removeComments": true,                      /* Do not emit comments to output. */
+    // "noEmit": true,                              /* Do not emit outputs. */
+    // "importHelpers": true,                       /* Import emit helpers from 'tslib'. */
+    // "downlevelIteration": true,                  /* Provide full support for iterables in 'for-of', spread, and destructuring when targeting 'ES5' or 'ES3'. */
+    // "isolatedModules": true,                     /* Transpile each file as a separate module (similar to 'ts.transpileModule'). */
+
+    /* Strict Type-Checking Options */
+    "strict": false,                                 /* Enable all strict type-checking options. */
+    // "noImplicitAny": true,                       /* Raise error on expressions and declarations with an implied 'any' type. */
+    // "strictNullChecks": true,                    /* Enable strict null checks. */
+    // "strictFunctionTypes": true,                 /* Enable strict checking of function types. */
+    // "strictBindCallApply": true,                 /* Enable strict 'bind', 'call', and 'apply' methods on functions. */
+    // "strictPropertyInitialization": true,        /* Enable strict checking of property initialization in classes. */
+    // "noImplicitThis": true,                      /* Raise error on 'this' expressions with an implied 'any' type. */
+    // "alwaysStrict": true,                        /* Parse in strict mode and emit "use strict" for each source file. */
+
+    /* Additional Checks */
+    // "noUnusedLocals": true,                      /* Report errors on unused locals. */
+    // "noUnusedParameters": true,                  /* Report errors on unused parameters. */
+    // "noImplicitReturns": true,                   /* Report error when not all code paths in function return a value. */
+    // "noFallthroughCasesInSwitch": true,          /* Report errors for fallthrough cases in switch statement. */
+    // "noUncheckedIndexedAccess": true,            /* Include 'undefined' in index signature results */
+    // "noImplicitOverride": true,                  /* Ensure overriding members in derived classes are marked with an 'override' modifier. */
+    // "noPropertyAccessFromIndexSignature": true,  /* Require undeclared properties from index signatures to use element accesses. */
+
+    /* Module Resolution Options */
+    // "moduleResolution": "node",                  /* Specify module resolution strategy: 'node' (Node.js) or 'classic' (TypeScript pre-1.6). */
+    // "baseUrl": "./",                             /* Base directory to resolve non-absolute module names. */
+    // "paths": {},                                 /* A series of entries which re-map imports to lookup locations relative to the 'baseUrl'. */
+    // "rootDirs": [],                              /* List of root folders whose combined content represents the structure of the project at runtime. */
+    // "typeRoots": [],                             /* List of folders to include type definitions from. */
+    // "types": [],                                 /* Type declaration files to be included in compilation. */
+    // "allowSyntheticDefaultImports": true,        /* Allow default imports from modules with no default export. This does not affect code emit, just typechecking. */
+    "esModuleInterop": true,                        /* Enables emit interoperability between CommonJS and ES Modules via creation of namespace objects for all imports. Implies 'allowSyntheticDefaultImports'. */
+    // "preserveSymlinks": true,                    /* Do not resolve the real path of symlinks. */
+    // "allowUmdGlobalAccess": true,                /* Allow accessing UMD globals from modules. */
+
+    /* Source Map Options */
+    // "sourceRoot": "",                            /* Specify the location where debugger should locate TypeScript files instead of source locations. */
+    // "mapRoot": "",                               /* Specify the location where debugger should locate map files instead of generated locations. */
+    // "inlineSourceMap": true,                     /* Emit a single file with source maps instead of having a separate file. */
+    // "inlineSources": true,                       /* Emit the source alongside the sourcemaps within a single file; requires '--inlineSourceMap' or '--sourceMap' to be set. */
+
+    /* Experimental Options */
+    // "experimentalDecorators": true,              /* Enables experimental support for ES7 decorators. */
+    // "emitDecoratorMetadata": true,               /* Enables experimental support for emitting type metadata for decorators. */
+
+    /* Advanced Options */
+    "skipLibCheck": true,                           /* Skip type checking of declaration files. */
+    "forceConsistentCasingInFileNames": true        /* Disallow inconsistently-cased references to the same file. */
+  }
+}

Ts基础/页面.html

@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Document</title>
+</head>
+<body>
+  <script src="./js/1_基本数据类型.js"></script>
+</body>
+</html>