随笔分类 - 前端开发组
1
前端开发的小伙伴分享时，将自己的文章放在这个分组中
摘要：准备工作 简介 Tampermonkey 是一款强大的浏览器扩展，它允许您定制网页的行为，改变和优化网页的展示方式或者功能以满足个人需求。通过编写自定义脚本，您可以实现许多有趣的功能，从自动化任务到改进网页界面，一切尽在掌握。 脚本一般指用户脚本(User Script)，他是一段 Javascri
阅读全文
摘要：## 一、 虚拟DOM ### 1. 什么是虚拟DOM？ 一个用来表示真实 DOM 节点 的 JS 对象，主要包含标签名 tag、属性 attrs 和子元素对象 children 属性等。 代码示例如下： ``` 标题 段落内容 { tag:'div', attrs:{ id:'baseNo', c
阅读全文
摘要：1.安装docker 1.1 在宝塔面板的软件商店中安装docker 1.2 通过终端安装docker 1）安装docker：sudo apt-get install -y docker.io 2）启动docker服务：systemctl start docker 3）设置开机启动：systemct
阅读全文
摘要：一、虚拟DOM中key的作用 key是虚拟DOM对象的标识，当数据发生变化时，Vue会根据新数据生成新的虚拟DOM，随后Vue会对新虚拟DOM与旧虚拟DOM的差异进行比较。 二、如何选择key 最好使用每条数据的唯一标识作为key，用一个简单的例子说明： 1.用index作为key时 点击按钮在列表
阅读全文
摘要：一、浏览器的渲染过程 1.根据HTML生成DOM树 浏览器在接收到服务器发来的HTML文件是字节形式的，首先要将字节形式的HTML组建成字符串，然后将字符串 转换成token，再将token组装成node节点，最后用node节点组成Dom。 所以DOM(Document Object Model)
阅读全文
摘要：定义 职责链模式的定义：使多个对象都有机会处理请求，从而避免了请求的发送者与多个接收者直接的耦合关系，将这些接收者连接成一条链，顺着这条链传递该请求，直到找到能处理该请求的对象。 应用 假设我们负责一个售卖手机的网站，需求的定义是：经过分别缴纳500元定金和200元定金的两轮预订，现在到了正式购买阶
阅读全文
摘要：1.Hooks 的定义 React ：Hooks 是一些可以在函数组件里“钩入” React state 及生命周期等特性的函数。 Vue ：Hooks 是组合式 API 中的一系列提供了组件复用、状态管理等开发能力的方法。 从定义上来看，React 与 Vue 描述相似，都对 Hooks 的使用范
阅读全文
摘要：“设计模式”这四个字大家都耳熟能详，那么今天我就来说说其中之一的备忘录模式。 顾名思义“备忘录”就是为了回到忘记之前记录的地方，专业一点就是：在不破坏对象的封装性的前提下，在对象之外捕获并保存该对象内部的状态以便日后对象使用或者对象恢复到以前的某个状态。 --> 三个角色： 发起人角色:记录当前时刻
阅读全文
摘要：组合模式 定义 组合模式又称之为部分-整体模式，将对象组合成树形结构，以表示 “部分-整体” 的层次结构。 通过对象的多态性表现，使得用户对单个对象和组合对象的使用具有一致性。 特点 表示 “部分-整体” 的层次结构，生成 "树叶型" 结构； 一致操作性，树叶对象对外接口保存一致； c.自上而下的的
阅读全文
摘要：定义 策略模式定义了一系列算法，并将每个算法封装起来，使它们可以相互替换，且算法的变化不会影响使用算法的客户。 策略模式属于对象行为模式，它通过对算法进行封装，把使用算法的责任和算法的实现分割开来，并委派给不同的对象对这些算法进行管理。 简而言之，就是策略模式准备了一组算法，并将每个算法进行封装，使
阅读全文
摘要：如何免费搭建一个酷炫的blog Hexo Hexo是什么？ Hexo 快速、简洁且高效的博客框架 使用Hexo搭建博客的优势 超快速度 Node.js 所带来的超快生成速度，让上百个页面在几秒内瞬间完成渲染。 支持 Markdown Hexo 支持 GitHub Flavored Markdown
阅读全文
摘要：1.工厂模式 工厂模式是用来创建对象的一种最常用的设计模式。在不暴露创建对象的具体逻辑下，将逻辑封装在一个函数中，这个函数就可以被视为一个工厂。工厂模式根据抽象程度的不同可以分为：简单工厂，工厂方法和抽象工厂。 如果只了解JavaScript的人也许不能很好的理解抽象这个词，因为JavaScript
阅读全文
摘要：观察者模式于发布订阅模式的关系 在《JavaScript设计模式》中，对观察者模式的定义：又被称作发布-订阅者模式或消息机制，定义了一中依赖关系，解决了主题于观察者之间功能的耦合。 这里的定义将观察者和发布-订阅者，两种模式称作同一中，但是实际上观察者模式和发布订阅模式还是有一些区别的。 下面是一段
阅读全文
摘要：原型模式 原型模式用于在创建对象时，通过共享某个对象原型的属性和方法，从而达到提高性能、降低内存占用、代码复用的效果。 示例一 function Person(name) { this.name = name; this.config = { a: "1", b: "2", }; this.hell
阅读全文
摘要：一、localStorage localStorage是一种在客户端浏览器本地化存储的机制，属性为只读，是绝大多数浏览器原生支持的属性，允许在浏览器中存储键值对数据。 （1）localStorage的使用 if(window.localStorage) { // 保存数据 localStorage.
阅读全文
摘要：适配器模式和装饰者模式 适配器模式 适配器模式是将一个类（对象）的接口（方法或者属性）转化成另外一个接口，使得原本由于接口不兼容而不能一起工作的那些类（对象）可以一起工作 举个例子： 飞机类和火车类，他们都是交通运输工具，都适用于中长途，但就行驶方式来说，火车是在地上跑的，飞机是在天上飞的。如果要让
阅读全文
摘要：外观模式 由于子系统或者程序组成比较复杂而提供一个高层面的接口，该模式对外有一个统一的接口，可以在使用的时候不用知道内部的详细逻辑，降低原有系统的使用复杂度。较多用在处理兼容不同平台的问题。 外观模式的一个经典实现：addEvent函数 function addEvent(dom, type, fn
阅读全文
摘要：设计模式 什么是设计模式 设计模式就是前人们总结出来的优秀的编程实践，应对不同场景为复杂的代码实现提供便捷的解决方案 常见的设计模式 创建型模式：处以创建对象为目标的设计模式 单例 工厂方法 抽象工厂 建造者 结构型模式：关注对象之间的组合结构的设计模式 装饰者 组合 外观 享元 代理 行为型模式：
阅读全文
摘要：1、变化侦测 vue.js会自动通过状态生成DOM，并显示在页面上，这个过程叫渲染。vue.js渲染过程是声明式的，我们通过模板来描述状态与DOM之间的映射关系。通常，在运行时应用内部会不断发生变化，需要不停的渲染，此时需要变化侦测来确定状态中发生了什么变化。 变化侦测一种是“推”，一种是“拉”。A
阅读全文
摘要：1. 认识闭包 闭包就是函数访问并操作函数外部的变量，只要被访问的变量存在于函数被声明时的作用域内。即函数可以记住并访问所在的词法作用域。 一个简单的闭包： 1 function fn() { 2 var a = 2 3 function fa() { 4 console.log(a) // 2 5
阅读全文
1
浙公网安备 33010602011771号