update

0.5.JS/TypeScript-learn/TS-使用经验.md

@@ -0,0 +1,208 @@
+# TS-使用经验
+
+TS for RN
+
+## type.d.ts
+
+[【TypeScript】类型定义文件(\*.d.ts)](https://blog.csdn.net/u013451157/article/details/79896290)
+
+类型定义文件的以 .d.ts 结尾，里面主要用来**定义类型**。
+
+### TS 中的 export declare interface 和 export interface 到底有什么不同
+
+1. declare interface Global，全局类型声明，全局可使用；
+2. export interface，局部声明，使用的时候，需要主动引入。
+
+### declare module，声明文件或模块的语法格式，在被引入的时候可以被找到
+
+就是说，虽然 TypeScript 本身不支持**导入非 JavaScript 内容**，但是为了支持其他工具接下来的工作，所以做了这么个语法支持。
+
+```ts
+// 如下声明是个什么意思？
+declare global {
+  interface Global {
+    realm: Realm
+  }
+}
+// 这里是声明合并，与interface的声明合并类似
+// You can also add declarations to the global scope from inside a module
+// 在如下的声明基础上添加类型声明
+declare interface Global {
+  HermesInternal: any
+}
+
+declare const global: Global
+```
+
+## type 和 interface
+
+1. interface 和 type(或者说 class) 很像。
+2. type 的含义是**定义自定义类型**，**当 TS 提供给你的基础类型都不满足的时候，可以使用 type 自由组合出你的新类型**。
+3. 而 interface 应该是对外输出的接口。
+
+### type，使用 type 用来定义类型变量，一般用于基础类型不能实现的情况，或者组合基础类型
+
+```ts
+// 基本类型
+type UserName = string
+// 对象
+type User = {
+  name: string
+  age: number
+  website: WebSite
+}
+// 方法
+type say = (age: number) => string
+
+// 定义可以是string与number的类型
+
+type Type = string | number
+```
+
+### interface，定义接口，可以被继承
+
+```ts
+interface BaseApplication {
+  appId: number
+}
+
+// 属性会被合并，合并接口
+interface BaseApplication {
+  age: number
+}
+
+// 属性被挤成
+export interface Application extends BaseApplication {
+  init(): void
+  get(key: string): object
+}
+```
+
+## declare，declare 可以创建 \*.d.ts 文件中的变量，declare 只能作用域最外层
+
+```ts
+// 定义 jQuery 需要用到的类型命名空间
+declare namespace JQuery {
+  // 定义基本使用的类型
+  type Selector = string
+  type TypeOrArray<T> = T | T[]
+  type htmlString = string
+}
+
+// 对模块 jquery 输出接口
+declare module 'jquery' {
+  // module 中要使用 export = 而不是 export default
+  export = jQuery
+}
+```
+
+## namespace
+
+为防止类型重复，使用 namespace **用于划分区域块**，**分离重复的类型**，顶层的 namespace 需要 declare 输出到外部环境，子命名空间不需要 declare。
+
+## 动态属性
+
+```ts
+interface ChinaMobile {
+  name: string
+  website: string
+}
+
+interface ChinaMobileList {
+  // 动态属性
+  [phone: string]: ChinaMobile
+}
+
+// 定义如下的类型
+// {
+//     '10086': {
+//         name: '中国移动',
+//         website: 'http://www.10086.cn',
+//     },
+//     '10010': {
+//         name: '中国联通',
+//         website: 'http://www.10010.com',
+//     },
+//     '10000': {
+//         name: '中国电信',
+//         website: 'http://www.189.cn'
+//     }
+// }
+```
+
+## 类型遍历，in ｜ keyof
+
+当你已知某个类型范围的时候，可以使用 in 和 keyof 来遍历类型，这里相对于上边，又更进了一层。
+
+```ts
+type ChinaMobilePhones = '10086' | '10010' | '10000'
+
+interface ChinaMobile {
+  name: string
+  website: string
+}
+
+// 只能 type 使用， interface 无法使用
+type ChinaMobileList = {
+  // 遍历属性
+  [phone in ChinaMobilePhones]: ChinaMobile
+}
+
+// keyof
+export type keys = {
+  name: string
+  appId: number
+  config: object
+}
+
+class Application {
+  // 参数和值约束范围，这里的T就标识了name/appId/object
+  // 设置参数的时候，需要key和val，两个参数，参数的类型与范型的取值要对应
+  set<T extends keyof keys>(key: T, val: keys[T])
+  // 获取对象的属性的时候，需要传入key，返回的类型是keys[T]
+  get<T extends keyof keys>(key: T): keys[T]
+}
+```
+
+### keyof，索引类型（Index types）
+
+[官方文档](https://www.tslang.cn/docs/handbook/advanced-types.html)
+
+TypeScript 允许我们遍历某种类型的属性，并通过 keyof 操作符提取其属性的名称。
+
+```ts
+// function pluck(o, names) {
+//   return names.map(n => o[n]);
+// }
+// T，K，变量代指参数
+// keyof Person是完全可以与 'name' | 'age'互相替换的。
+function pluck<T, K extends keyof T>(o: T, names: K[]): T[K][] {
+  return names.map(n => o[n])
+}
+
+interface Person {
+  name: string
+  age: number
+}
+let person: Person = {
+  name: 'Jarid',
+  age: 35,
+}
+let strings: string[] = pluck(person, ['name']) // ok, string[]
+```
+
+```ts
+interface Person {
+  name: string
+  age: number
+  location: string
+}
+
+type K1 = keyof Person // "name" | "age" | "location"
+type K2 = keyof Person[] // number | "length" | "push" | "concat" | ...
+type K3 = keyof { [x: string]: Person } // string | number
+```
+
+## 范型 T
+
+可以使用泛型来**创建可重用的组件**，**一个组件可以支持多种类型的数据**。

15.运维操作及环境配置/docker/Docker.md

@@ -2,7 +2,15 @@
 
 [docker-tutorial](https://www.runoob.com/docker/docker-tutorial.html)
 
-docker 使用的时候，客户端必须开着。
+1. **docker 使用的时候，客户端必须开着**。
+2. docker 有自己的远端同步工具；
+   1. 通常我们需要本地开发好后同步到线上；
+   2. 在运行的机器上安装 docker 并同步过去，然后运行就可以了；
+3. 也就是说我们每个容器都可以被多次运行在多个地方；
+   1. 这也就是**创建镜像**；
+   2. 每次运行还可以更新一下依赖的镜像；
+4. 直接安装一个 node，会在默认的系统上；
+   1. cat /proc/version
 
 ## 是什么
 
@@ -16,6 +24,7 @@ docker 使用的时候，客户端必须开着。
 5. 主要是为了解决：在我的机器上是正常的，为什么到你的机器上就不正常了的问题。
 6. build -》share -》run。
 7. 类似于虚拟机，但是比虚拟机更加的效率、稳定、节省空间。
+8. 由于不同的机器有不同的操作系统，以及不同的库和组件，在将一个应用部署到多台机器上需要进行大量的环境配置操作。Docker 主要解决环境配置问题，它是一种虚拟化技术，对进程进行隔离，被隔离的进程独立于宿主操作系统和其它隔离的进程。使用 Docker 可以不修改应用程序代码，不需要开发人员学习特定环境下的技术，就能够将现有的应用程序部署在其它机器上。
 
 ### Docker 架构/Docker 的一些概念
 
@@ -45,8 +54,8 @@ Docker 使用**客户端-服务器 (C/S) 架构模式**，使用远程 API 来
 
 #### 主要概念
 
-1. 镜像 => 类
-2. 容器 => 对象
+1. 镜像 => 类（Image）
+2. 容器 => 对象实例（Container）
 3. Docker 主机(Host): 一个物理或者虚拟的机器**用于执行 Docker 守护进程和容器**。
 4. Docker Registry: Docker 仓库用来保存镜像，可以理解为**代码控制中的代码仓库**。
    1. 一个 Docker Registry 中可以包含**多个仓库（Repository）**；**每个仓库可以包含多个标签（Tag）；每个标签对应一个镜像**。
@@ -57,6 +66,12 @@ Docker 使用**客户端-服务器 (C/S) 架构模式**，使用远程 API 来
    3. 由于 image 被某个 container 引用（拿来运行），**如果不将这个引用的 container 销毁（删除），那 image 肯定是不能被删除。**
    4. 所以想要删除运行过的 images 必须首先删除它的 container。
 
+##### 镜像与容器
+
+1. 镜像（）是一种静态的结构，**可以看成面向对象里面的类**，**而容器（）是镜像的一个实例**。
+
+镜像包含着容器运行时所需要的代码以及其它组件，它是一种分层结构，每一层都是只读的（read-only layers）。构建镜像时，会一层一层构建，前一层是后一层的基础。镜像的这种分层存储结构很适合镜像的复用以及定制。
+
 ## 为什么
 
 ### Docker 的应用场景
@@ -220,6 +235,32 @@ Dockerfile 是一个**用来构建镜像的文本文件**，文本内容包含
 
 [Docker 命令大全](https://www.runoob.com/docker/docker-command-manual.html)
 
+1. FROM：定制的镜像都是基于 FROM 的镜像，这里的 nginx 就是定制需要的基础镜像。后续的操作都是基于 nginx。
+   1. FROM 指定基础镜像，用于后续的指令构建。
+2. RUN：用于执行后面跟着的命令行命令。
+3. MAINTAINER **指定 Dockerfile 的作者/维护者**。（已弃用，推荐使用 LABEL 指令）
+4. LABEL 添加镜像的元数据，使用键值对的形式。
+5. **RUN 在构建过程中在镜像中执行命令**。
+6. CMD 指定容器创建时的默认命令。（可以被覆盖）
+7. **ENTRYPOINT 设置容器创建时的主要命令。（不可被覆盖）**
+   1. 比如 yarn；
+8. EXPOSE 声明容器运行时监听的特定网络端口。
+9. ENV 在容器内部设置环境变量。
+10. **ADD 将文件、目录或远程 URL 复制到镜像中。**
+    1. 添加本地文件；
+11. **COPY 将文件或目录复制到镜像中。**
+    1. 复制 docker 所在目录外的文件到某个地方；
+       1. 目标地址看 FROM 的系统的目录情况；
+    2. <目标路径>：容器内的指定路径，该路径不用事先建好，路径不存在的话，会自动创建。
+12. VOLUME 为容器创建挂载点或声明卷。
+13. **WORKDIR 设置后续指令的工作目录。**
+14. USER 指定后续指令的用户上下文。
+15. ARG 定义在构建过程中传递给构建器的变量，可使用 "docker build" 命令设置。
+16. ONBUILD 当该镜像被用作另一个构建过程的基础时，添加触发器。
+17. STOPSIGNAL 设置发送给容器以退出的系统调用信号。
+18. HEALTHCHECK 定义周期性检查容器健康状态的命令。
+19. SHELL 覆盖 Docker 中默认的 shell，用于 RUN、CMD 和 ENTRYPOINT 指令。
+
 ### Dockerfile，文件配置
 
 1. COPY：
@@ -247,6 +288,12 @@ Dockerfile 是一个**用来构建镜像的文本文件**，文本内容包含
    1. 而 dockerfile 的作用是从无到有的构建镜像。
 2. Dockerfile - 为 docker build 命令准备的，用于建立一个独立的 image ，在 docker-compose 里也可以用来实时 build
    1. docker-compose.yml - 为 docker-compose 准备的脚本，可以同时管理多个 container ，包括他们之间的关系、用官方 image 还是自己 build（自定义镜像）、各种网络端口定义、储存空间定义等
+3. 相当于多个 FROM，而不是只能有一个基础，别的东西都需要自己安装；
+4. 用于处理多个镜像的运行；
+
+### [compose](https://www.runoob.com/docker/docker-compose.html)
+
+1. Compose 是用于定义和运行多容器 Docker 应用程序的工具。通过 Compose，您可以使用 YML 文件来配置应用程序需要的所有服务。然后，使用一个命令，就可以从 YML 文件配置中创建并启动所有服务。
 
 ## 构建 docker 镜像
 
@@ -322,6 +369,64 @@ $ docker logs
 $ docker stop amazing_cori
 ```
 
+## docker 常用命令解释
+
+1. `runoob@runoob:~$ docker run ubuntu:15.10 /bin/echo "Hello world"`；
+   1. docker: Docker 的二进制执行文件。
+   2. run: 与前面的 docker 组合来运行一个容器。
+   3. ubuntu:15.10 指定要运行的镜像，Docker 首先从本地主机上查找镜像是否存在，如果不存在，Docker 就会从镜像仓库 Docker Hub 下载公共镜像。
+   4. /bin/echo "Hello world": 在启动的容器里执行的命令
+2. `docker run -i -t ubuntu:15.10 /bin/bash`，我们通过 docker 的两个参数 -i -t，让 docker 运行的容器实现"对话"的能力；
+   1. 交互式终端退出: exit ;
+3. `docker run -d -p 5000:5000 training/webapp python app.py`
+   1. 运行了一个应用 training/webapp，端口映射内部到外部 5000;
+
+## docker 常用命令
+
+1. 通过 docker ps 查看
+2. 输入 docker 命令来查看到 Docker 客户端的所有命令选项；
+   1. docker
+3. 我们可以使用 docker pull 命令来载入 ubuntu 镜像；
+4. 以下命令使用 ubuntu 镜像启动一个容器，参数为以命令行模式进入该容器：
+   1. `docker run -it ubuntu /bin/bash`；
+5. 使用 docker start 启动一个已停止的容器: `docker start b750bbbcfd88`；
+6. 在大部分的场景下，我们希望 docker 的服务是在后台运行的，我们可以过 -d 指定容器的运行模式。
+
+## 搜索并 pull 一个可用镜像
+
+1. docker search centos
+2. docker pull centos
+3. 打开 bash：`docker run -i -t centos /bin/bash`
+   1. 指定名称：`docker run -i -t --name test-bash centos /bin/bash`
+
+## 如何运行当前文件内的 docker，比如当前的前端项目
+
+## 导出和导入容器
+
+1. 如果要导出本地某个容器，可以使用 docker export 命令。
+   1. docker export 1e560fca3906 > ubuntu.tar
+2. 导入容器快照：
+   1. cat docker/ubuntu.tar | docker import - test/ubuntu:v1
+
+## 如果我们需要用 docker 来做日常的开发
+
+1. 使用 docker 启动一个项目；
+2. 端口做好映射；
+
+## 构建镜像
+
+1. 使用 Dockerfile 指令来创建一个新的镜像；
+2. **构建镜像**；
+   1. 我们使用命令 docker build ， 从零开始来创建一个新的镜像。为此，我们需要创建一个 Dockerfile 文件，其中包含一组指令来告诉 Docker 如何构建我们的镜像。
+   2. 这里构建出来的镜像就可以哪里都能使用了；
+      1. 所以发布的过程也是一个构建与运行的过程；
+   3. 这里的 dockerfile 包含了所有需要的依赖配置；
+   4. [Docker Dockerfile](https://www.runoob.com/docker/docker-dockerfile.html)；
+      1. Dockerfile 是一个文本文件，包含了构建 Docker 镜像的所有指令。
+      2. Dockerfile 是一个用来构建镜像的文本文件，文本内容包含了一条条构建镜像所需的指令和说明。
+      3. 通过定义一系列命令和参数，Dockerfile 指导 Docker 构建一个自定义的镜像。
+3. 用户登录后，可以通过 docker push 命令将自己的镜像推送到 Docker Hub。
+
 ## 部署实操
 
 1. 后端代码部署；

15.运维操作及环境配置/docker/docker-demo1/README.md

@@ -0,0 +1,14 @@
+# docker-demo1
+
+1. 生成镜像：docker build -t docker-demo1-image:v1 .
+   1. nginx:v3（镜像名称:镜像标签）
+   2. docker build -t docker-demo1-image .
+2. 查看生成的镜像
+   1. docker images
+3. 创建容器并运行：
+   1. docker run -p 127.0.0.1:3001:3000 -d --name docker-demo1-container docker-demo1-image:v1
+      1. 运行的是 v1 版本；
+      2. docker run -p 127.0.0.1:3001:3000 -d --name docker-demo1-container docker-demo1-image
+      3. 绑定容器的 80 端口，并将其映射到本地主机 127.0.0.1 的 8111 端口上；
+
+这里每次都需要 build 然后 run。本地开发不太合适，适合部署；

15.运维操作及环境配置/docker/docker-demo1/dockerfile

@@ -1,4 +1,4 @@
-FROM node:12.18.4
+FROM node:18.17.1
 
 WORKDIR /app
 

15.运维操作及环境配置/docker/docker-demo1/index.js

@@ -2,7 +2,7 @@ const Koa = require('koa');
 const app = new Koa();
 
 app.use(async (ctx) => {
-  ctx.body = 'Hello World';
+  ctx.body = 'Hello World!!';
 });
 
 app.listen(3000);