TypeScript 简介TypeScript 作为 Javascript 语言的超集、为 JavaScript 添加可选择的类型标注,大大的增加了代码的可维护性和迭代性。同时会不断的发展 javascript 的新特性,是现在流行的前端技术 TypeScript 的特点 始于 JavaScript,归于 JavaScriptTypeScript 终归是通过编译形成 Javascript 可以运行在任何浏览器上和 nodejs 等运行时环境中 强大的工具构建大型应用程序 类型允许 JavaScript 开发者在开发 JavaScript 应用程序时使用高效的开发工具和常用操作比如静态检查和代码重构。 类型是可选的,类型推断让一些类型的注释使你的代码的静态验证有很大的不同。类型让你定义软件组件之间的接口和洞察现有 JavaScript 库的行为。 先进的 JavaScript TypeScript 提供最新的和不断发展的 JavaScript 特性,包括那些来自 2015 年的 ECMAScript 和未来的提案中的特性,比如异步功能和 Decorators,以帮助建立健壮的组件。 ...
应用题lodash 中的 get 函数123456789101112131415161718192021function _get( origin: Record<string, any>, path: string | string[], defualtValue: any = 'explosion') { // judge if (typeof path === 'string') { // match const reg = /[^\[\].]+/g path = path.match(reg) as string[] } let result = origin for (const key of path) { if (result && typeof result === 'object' && key in result) { result = result[key] ...
工程化配置momorepo 简介由于我们React库中有React-dom库,React-native库等等等,为了管理这些工程文件库可以使用momorepo来进行版本控制和管理 momorepo: 一种项目库的管理方式 可以很方便的协同管理不同独立的库的生命周期 一些简单的工具:npm-workspace、Yarn-workspace、pnpm-workspace 专业工具:nx、bit、turborepo、rush、lerna 包管理器选择 pnpm 作为我们项目的包管理器 安装依赖更快 解决了 npm 的一些疑难问题 pnpm 初始化 12npm install -g pnpmpnpm init pnpm 实验 momorepo:建立 pnpm-workspace.yaml文件去书写配置 1234567packages: # all packages in direct subdirs of packages/ - 'packages/*' # all packages in subdirs of components/ - 'co ...
new 操作符JavaScript中的 new 操作符是对一个构造函数创建实例的过程 如 12345function Person(name) { this.name = name}const yueyun = new Person('yueyun')console.log(yueyun) new 通过构造器创建的实例能访问构造函数中的属性 可以访问到构造属性原型链的属性 123456789function myNew (Func,...args) { // 创建一个新的对象 const obj = {} // 新对象的原型指向原型链 obj.__proto__ = Func.prototype // 绑定this const result = Func.apply(obj,..args) return result instanceof Object ? result : obj} 为什么要使用虚拟 DOM 虚拟 DOM 的性能一定比真实 DOM 差吗?虚拟 DO ...
Vue 认识渐进式的 JS 框架,关注视图层,数据驱动初始 vue 123456789101112<script src="./js/vue.js"></script><div id="root"> <h1>helloworld,{{name}}</h1></div><script> new Vue({ el: '#root', data: { name: 'vue' } })</script> 最后会在浏览器上打印 helloworld,vue 1.想让 vue 工作,就必须创建一个 vue 实例,且要传入一个配置对象2.root 里的容器依然符合 html 代码的规范,新加入了一些特殊的 vue 语法3.root 容器里面的代码称之为[vue 模板] (templete)4.Vue 实例和容器是 ...
React 脚手架搭建Create-react-app 基础操作当下前端开发的主流是组件化和模块化 有助于团队协作开发 便于组件的复用:提高开发效率、方便后期维护、减少冗余代码 划分组件: 业务组件:针对项目需求封装 普通业务组件:复用性低,只是单独拆选出来的一个模块 通用业务组件:具备复用性 功能组件:适用于多个项目「例如:UI 组件库中的组件」 通用功能组件 组件化开发必然会带来工程化,即基于 Webpack / Vite / Rollup / Turbopack 等工具实现组件的合并、压缩、打包等。 安装 create-react-app我们可以基于 webpack 自己去搭建一套工程化打包的脚手架,但是过程会非常麻烦和繁琐,因此可以利用官方提供的脚手架create-react-app创建 React 项目,基于该脚手架创建项目,默认就把 Webpack 的打包规则已经处理好了,把一些项目需要的基本文件也都创建好了。我们可以在其上面做修改 全局安装 create-react-app 脚手架: 1npm i create-react-ap ...
NestJS 简介Nestjs 是一个用于构建高效的可扩展的基于Nodejs服务端 应用程序开发框架 完全支持typescript 并结合的AOP面向切面编程的方式 Spring MVC 风格 其中有依赖注入和IOC控制反转 前置知识IOCInversion of Control 字面意思是控制反转,具体的定义是高层模块不应该依赖底层模块,二者都应该依赖其抽象,抽象不应该依赖细节 DI依赖注入(Dependency Injection)其实和IoC是同根生,这两个原本就是一个东西,只不过由于控制反转概念比较含糊(可能只是理解为容器控制对象这一个层面,很难让人想到谁来维护对象关系)。 类A依赖类B的常规表现是在A中使用B的instance。 未使用控制反转和依赖注入之前的代码 123456789101112131415161718192021class A { name: string constructor(name: string) { this.name = '月晕' }}//强耦合class B { ...
浏览器事件循环浏览器的进程模型何为进程程序运行需要它自己的专属的内存空间 可以简单的把这块内存空间理解为进程每个应用至少有一个进程,进程之间相互独立,即使通信 需要同意 何为线程有了进程之后,就可以运行程序代码了运行代码的 容器 称之为 线程一个进程至少有一个线程 所以在进程开启后会自动创建一个线程来运行代码 该线程称之为主线程如果程序需要同时执行多块代码,主线程就会开启更多的线程来执行代码,所以一个进程总可以包含多个线程 浏览器有哪些进程和线程浏览器内部工作复杂,为了避免相互影响,当启动浏览器后会自动开启多个进程(如:浏览器进程、网络进程、渲染进程) 其中主要的线程有: 浏览器进程主要负责界面显示、用户交互、子进程管理、浏览器进程内部会启动多个线程处理不同的任务 网络进程负责加载网络资源。网络进程内部会启动多个线程来处理不同的网络任务 渲染进程渲染进程启动后,会开启一个渲染主线程,主线程负责执行 HTML、css、JS代码,默认情况下,浏览器会为每个标签页开启一个新的渲染进程,以保证不同标签页之间的不相互影响 渲染主线程是如何工作的渲染主线程是浏览器中最繁忙的线程,需要处理的 ...
链表线性表 有限的序列 序列中的每个元素都有唯一的前驱和后继 除了开头和结尾两个节点 顺序表:分配一块连续的内存去存放这些元素 例如数组 链表:内存是不连续的 元素各自分配一块内存 内存和内存之间用指针进行相连 具体实现 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677package main// 定义类型type ListNode { data int next *ListNode}// 初始化func initList () *ListNode { list := &ListNode{ data: 0, next: nil, } return list}// 头插法func headInsert (list *Lis ...