- 博客(24)
- 收藏
- 关注
RSS订阅原创 陌笛-node.js基础
Node.js 是⼀个基于Chrome V8引擎的JavaScript运⾏环境。Node.js使⽤了⼀个事件驱动、⾮阻塞式I/O的模型
2022-06-27 23:28:30
350
原创 陌笛-react.js路由
web应⽤的路由路由的概念https://news.163.com/world/index.htmlhttps://xxx.163.com/xx/index.php...访问过程为浏览器发出请求服务器监听到80端⼝（或443）有请求过来，并解析url路径根据服务器的路由配置，返回相应信息（可以是 html 字串，也可以是 json 数据，图⽚等）浏览器根据数据包的Content-Type来决定如何解析数据简单来说路由就是⽤来跟后端服务器进⾏交互的⼀种⽅式，通过不同的路径，来请求不
2022-05-30 21:15:33
239
原创 路白-react.js 服务端渲染&同构
React服务端渲染示例代码地址，需要自行下载背景创建一个服务端渲染的应用同构流程总结路由路由同构示例代码地址，需要自行下载背景第一阶段很久以前, 一个网站的开发还是前端和服务端在一个项目来维护, 可能是用php+jquery.那时候的页面渲染是放在服务端的, 也就是用户访问一个页面a的时候, 会直接访问服务端路由, 由服务端来渲染页面然后返回给浏览器。也就是说网页的所有内容都会一次性被写在html里, 一起送给浏览器。这时候你右键点击查看网页源代码, 可以看到所有的代码; 或者你去查看h
2022-05-29 16:11:33
235
原创 云隐-设计模式解析与实战
目录什么是设计模式设计模式的优点五大原则1.开闭原则2.单一职责原则3.依赖倒置原则4.接口隔离原则5.里氏替换原则模式分类创建型(创建元素)结构型(代码结构)行为型(模式行为总结)什么是设计模式针对设计问题的通用解决方案设计模式的优点有利于代码复用有利于代码稳定可扩展有利于代码的可读性的提升五大原则1.开闭原则对扩展开放，对修改关闭。已有的场景下，对于需要拓展的功能进行开放、拒绝直接的功能修改2.单一职责原则岗位职责单一，互不重叠，通过解耦让每一个职责更加独立，一个功能模块只做一
2022-05-21 20:59:56
226
原创 奥利奥-react.js高级用法
目录1. 高阶组件定义优点使用案例HOC 知名的应⽤案例：2. react hooks(v16.8新加的特性)增加hook的原因useStateuseEffectHook规则自定义hookuseRef[其他Hook API索引](https://react.docschina.org/docs/hooks-reference.html)3. 异步组件示例(异步组件+展位)实现一个异步组件lazy1. 高阶组件定义把组件作为参数，并返回（高阶）组件的函数，称为高阶组件优点代码复⽤，状态/逻辑抽象
2022-05-21 20:54:49
494
原创 路白-react.js基础
目录1. 简介2. JSX3. State4. Props5. 组件类型(之前版本，之后版本会有hook)6. 条件渲染和循环 & 绑定事件7. react使用箭头函数和普通函数的区别8. 生命周期9. react生命周期的改变及原因React生命周期演变的原因:10. hook11. 实现一个高阶组件1. 简介React 是一个用于构建用户界面的 JAVASCRIPT 库，主要用于构建 UI，很多人认为 React 是 MVC 中的 V，起源于 Facebook 的内部项目，用来架设 Inst
2022-05-21 20:45:20
386
原创 云隐-工程化开发小程序
小程序演变小程序最初的样子 - wxml wxss wxs => js原生部分支持npm => 类webpack配置&打包 => miniprogram_dist跨平台的需求 + babel + plugin + ut => 统一走webpack工程化环境……CICD 集成布署目标利用webpack，搭建远程小程序的工程化环境理解小程序能工程化的基础提炼小程序工程化与web工程化区别开始准备工作新建项目新建小程序项目初始化npm部分npm
2022-05-12 23:08:26
189
原创 云隐-vue.js项目实战
1.怎么搭建一个前端项目总体搭建流程图Vue脚手架初始化一个项目初始化依赖并规划场景安装必要的依赖，规划引用的场景。例：设计业务模块和架构分站区：根据业务需求或者技术需求进行分站通用模块抽离：抽离通用模块进行复用设计业务&功能模块设计一致性B端(Business)和C端(Consumer、Client)C端产品服务于个人，B端产品服务于组织。C端产品解决的是用户在生活场景中的某一需求痛点，如百度地图、高德地图解决人们出行导航的需求，饿了么、美团解决人们点外卖的需
2022-05-12 23:08:08
226
原创 陌笛-微前端
微前端是什么？一种类似于微服务的架构，是一种由独立交付的多个前端应用组成整体的架构风格,将前端应用分解成一些更小、更简单的能够独立开发、测试、部署的应用，而在用户看来仍然是内聚的单个产品。简而言之，就是将一个复杂的应用分解成几个子应用，这几个子应用能独立开发、测试、部署，再由这些子应用构成一个总应用微前端(Micro-Frontends)背景随着时间的推移以及应用功能的不断丰富，我们的应用变得越来越庞大且越来越难以维护。所以我们就不得不对应用进行拆分，从最开始的前后端分离到后面的微服务都是对应用进
2022-05-12 23:07:25
195
原创 云隐-低代码平台
什么地方会用到低代码平台现在的软件开发根据复杂度和定制化程度可划分为以下四个区域，定制化程度比较低的项目都可以使用低代码传统开发模式和低代码开发模式的对比低代码平台开发在概念架构和产品逻辑之后进行的是一些通用配置和个性配置低代码平台的布局低代码平台一般都是以这种三栏形式的，左边是物料区，放置的是一些通用组件，中间是渲染区域，右边是编辑面板，用于编辑对应组件的属性附：阿里的宜搭低代码平台物料区物料区展示的元组件和布局组件，我们的每一个页面可以看做是元组件和布局组件组合而成的复合组件，多
2022-05-12 23:07:02
294
1
原创 云隐-算法
一、数据结构数组or链表查找：数组连续，效率高。可以迅速定位到数组中某一个节点位置。而链表则需要通过前一个元素指向下一个元素地址，需要前后依赖，效率较低插入：数组中元素插入会引起被插入位后所有元素索引的改变，而链表只需要改变某一个节点的next实现链表class LinkList { constructor() { this.length = 0; this.head = null; // 可以用作链表是否为空的判断 } getElementAt(positio
2022-05-12 23:06:08
118
原创 路白-闭包和作用域
一、闭包的概念及应用场景定义闭包是指那些能够访问自由变量的函数。自由变量是指在函数中使用的，但既不是函数参数也不是函数局部变量的变量。从理论角度：所有的函数都是闭包。因为它们都在创建的时候就将上层上下文的数据保存起来了。哪怕是简单的全局变量也是如此，因为函数中访问全局变量就相当于是在访问自由变量，这个时候使用最外层的作用域。从实践角度：以下函数才算是闭包：即使创建它的上下文已经销毁，它仍然存在（比如，内部函数从父函数中返回）在代码中引用了自由变量应用场景柯里化函数柯里化的目的
2022-05-12 23:05:43
130
原创 路白-this指针
一、this指针概念可以认为this是当前函数/当前模块的运行环境的上下文, 是一个指针型变量, 可以理解为一个动态的对象, 普通函数中的this是在调用时才被绑定确认指向的.二、this的绑定规则1. 默认绑定指函数独立调用的时候，不带任何修饰的函数引用（看如下代码）。非严格模式下 this 指向全局对象(浏览器下指向 Window，Node.js 环境是 Global ）严格模式下，this 绑定到 undefined ,严格模式不允许this指向全局对象。比如如下代码, 如果在浏览器
2022-05-12 23:05:23
266
原创 路白-面向对象编程/原型及原型链
一、创建对象有哪些方式？1. 普通方式每一个新对象都要重新写一遍 color 和 start 的赋值const Player = new Object();Player.color = "white";Player.start = function () { console.log("white下棋");};或者工厂模式，这两种方式都无法识别对象类型，比如 Player 的类型只是 Objectfunction createObject() { const Player = new
2022-05-11 22:17:11
216
原创 路白-Typescript
基础基础类型: number string boolean array object: string,可以使用这种冒号加类型的形式声明变量、对象的类型？表示可选类型enum: 枚举enum Color {Red, Green, Blue}let c: Color = Color.Green;type: 用于定义一个类型interface: 接口，定义一个对象参数类型，使用该类型的对象必须完全符合该对象类型的格式interface a { name: strin
2022-05-11 22:13:54
588
原创 钰溪-vue.js前端路由及异步组件
hashhashchange事件：可以监听hash路由的变化history1.方法pushState(data, title, ?url)：不会触发popstatereplaceState(data, title, ?url)：不会触发popstatebackforwardgopopstate事件：可以监听浏览器的前进回退按钮和js的back、forward、go方法hash和history的区别形式上hash会在域名后面加上‘#’，history不会事件上，监听hash用的是
2022-05-11 22:12:39
440
原创 波比-vue.js状态管理及ssr
1.中心化和去中心化中心化：一些需要共享的状态，抽离出来放到一个统一的地方进行管理去中心化：就是各个组件的本地状态，各个组件管理各个组件中的状态2.实现状态管理的思路首先要有一个全局的对象要对外暴露出api，也就是修改状态的方法与底层框架视图结合起来，状态更新了 -> 视图要更新3.实现代码Step1 - store 注册/*** store.js - store 注册*/let Vue// vue 插件必须要这个 install 函数export funct
2022-05-11 22:10:06
3200
原创 路白-vue.js高级
插槽-Slot默认插槽：子组件用来slot标签确定渲染的位置，标签内可以正常写dom结构，当时父组件没有往插槽中插入内容时默认展示slot标签内的内容Vue.component('button-counter', { template: '<div> <slot>我是默认内容</slot></div>'})new Vue({ el: '#app', template: '<button-counter><span>我是s
2022-05-11 22:08:08
132
原创 止水-vue.js基础
一.基础语法插值操作Mustache语法(也就是双大括号)v-once:该指令后面不需要跟任何表达式(比如之前的v-for后面是由跟表达式的)，该指令表示元素和组件(组件后面才会学习)只渲染一次，不会随着 数据的改变而改变。v-html=" "该指令后面往往会跟上一个string类型(变量）,会将string的html解析出来并且进行渲染v-text=" "作用和Mustache比较相似：都是用于将数据显示在界面中，v-text通常情况下，接受一个string类型v-pre用于跳过这个元素和它
2022-05-11 22:07:00
92
原创 波比-浏览器相关
目录一、首先需明确一个概念二、浏览器进程Browser进程（主进程）第三方插件进程GPU进程浏览器渲染进程三、浏览器线程GUI渲染线程JS引擎线程事件触发线程定时触发器线程异步http请求线程四、常见问题浏览器渲染过程3中渲染线程做了啥构建DOM渲染过程中遇到js怎么处理浏览器地址栏输入URL，按下回车后究竟发生了什么？重排(回流）和重绘async和defer的作用是什么？有什么区别?DomContentLoaded 和 load的触发为什么操作dom慢优化渲染效率的建议强缓存和协商缓存事件相关一、首先需
2022-05-11 22:05:58
158
原创 波比-JS模块化详解
1.什么是模块化模块化是一种代码管理、组织和通信的模式2.为什么要用模块化？随着项目复杂度的提高，项目变得越来越难以维护，js模块化也油然而生，所有的模块都处于全局域下，容易造成命名冲突的问题，而且依赖关系不明显。引入js模块化的作用是：为了将复杂的问题分解成更小的子问题（关注点分离）更好地进行代码管理，方便代码替换、复用、拓展方便多人协同开发3.模块化发展最开始模块化混沌时期，靠经验组织代码使用闭包当前阶段，CommonJS、ES64.循环引用当a模块引用了b模块，b模块又
2022-05-11 22:04:44
166
原创 路白-Promise规范及应用
一.什么是promisepromise是一种异步编程的解决方案，可以用来解决回调地狱的问题，采用链式调用的方式能让代码的编写更加优雅，有条理二.promise的基本语法结构new Promise((resolve, reject) => { // 这里执行异步的操作，然后将异步操作的结果value/reson通过resolve或者reject传入then的回调函数中 resolve(value)/reject(reason) }).then((res) .
2022-05-11 22:03:13
203
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人