继承的艺术: 探索JS中实现继承的多种方式

4 月 20 日
阅读 6 分钟
293
在JavaScript的世界中,继承不仅是面向对象编程中的基石,更是一门优雅的艺术。继承可以让我们构建出灵活、可扩展的代码结构,以及更好地复用以前的开发代码,缩短开发的周期、提升开发效率。

理解闭包与内存泄漏

2021-01-30
阅读 9 分钟
12.3k
闭包,是指有权访问另一个函数作用域中变量的函数。从定义上我们可以知道,闭包是函数,并且是被另一个函数包裹的函数。所以需要用一个函数去包裹另一个函数,即在函数内部定义函数。被包裹的函数则称为闭包函数,包裹的函数(外部的函数)则为闭包函数提供了一个闭包作用域,所以形成的闭包作用域的名称为外部函数的名称。

三种Loading制作方案

2020-12-28
阅读 6 分钟
12.2k
Loading几乎是每个应用都会用到的一个组件。很多组件库都会提供相应的Loading组件,但是有的时候我们可能需要自定义Loading效果,掌握Loading组件制作的基础知识将变得非常必要。Loading主要就是一个旋转的圆环,而旋转部分则比较简单,直接通过CSS动画即可实现,所以关键部分就是得到Loading的圆环。

常用布局简介

2020-12-10
阅读 12 分钟
4.5k
网页布局对于一个前端开发者而言至关重要,掌握好布局知识有助于我们更好的实现CSS界面的设计和开发。布局是有限空间内的元素排列方式,因为页面设计横向不滚动,纵向无限延伸,所以大多数时候讨论的布局都是对水平方向进行分割。常用的布局方式为单列布局、两列布局、三列布局、粘连布局等。

React基础与原理实现

2020-11-21
阅读 14 分钟
6.9k
React是用于构建用户界面的 JavaScript 库。其有着许多优秀的特性,使其受到大众的欢迎。① 声明式渲染:所谓声明式,就是关注结果,而不是关注过程。比如我们常用的html标记语言就是一种声明式的,我们只需要在.html文件上,写上声明式的标记如<h1>这是一个标题</h1>,浏览器就能自动帮我们渲染出一个标题元...

Fiber架构的简单理解与实现

2020-10-29
阅读 19 分钟
5.3k
本文主要理解fiber的基本原理。为了能够更好的理解fiber原理,我们会从零开始构建一个简单的react,并在其中引入fiber以及useState hook,DOM-DIFF等。

从零实现一个Promise

2020-09-22
阅读 13 分钟
3k
① Promise 是一个类或者函数,内部拥有3个状态,分别为pending(等待)、fulfilled(执行、完成)、rejected(拒绝、未完成)。默认为pending状态,即Promise对象刚创建的时候状态为pending,并且pending状态可以转换fulfilled或者rejected。fulfilled和rejected为最终的状态,一旦变为fulfilled或者rejected,那么将无法转变...

对象深浅拷贝与WeakMap

2020-09-17
阅读 6 分钟
4.4k
当我们进行数据拷贝的时候,如果该数据是一个引用类型,并且拷贝的时候仅仅传递的是该对象的指针,那么就属于浅拷贝。由于拷贝过程中只传递了指针,并没有重新创建一个新的引用类型对象,所以二者共享同一片内存空间,即通过指针指向同一片内存空间。

彻底弄懂script标签

2020-09-11
阅读 4 分钟
7.1k
<script> 标签主要用于从服务器端加载一段javascript脚本并在当前页面中执行。因为其需要从服务器端中加载,所以会在一定程度上影响到web的性能。在性能优化中,<script>标签的优化至关重要。

Vue2异步批量更新与computed、watcher原理实现

2020-08-07
阅读 12 分钟
6.9k
所以在实现生命周期前,我们需要实现Vue.mixin()这个全局的方法,将混入的所有生命周期钩子进行合并之后再到合适的时机去执行生命周期的各个钩子。我们可以将全局的api放到一个单独的模块中,如:

Vue2组件挂载与对象数组依赖收集

2020-08-06
阅读 12 分钟
5.5k
渲染的入口就是调用Vue实例的$mount()方法,其会接收一个选择器名作为参数,Vue进行模板渲染的时候,所使用的模板是有一定优先级的:① 如果用户传递的options对象中包含render属性,那么就会优先使用用户配置的render()函数中包含的模板进行渲染;② 如果用户传递的options对象中不包含render属性,但是包含template属性,...

Vue2响应式原理与实现

2020-08-04
阅读 6 分钟
3.5k
Vue本质上是一个暴露在全局的名为Vue的函数,在使用的时候通过new这个Vue函数来创建一个Vue实例,并且会传入一个配置对象。Vue函数内需要做的事情就是根据传入的配置对象进行初始化。如:

Vue3响应式原理与reactive、effect、computed实现

2020-07-26
阅读 14 分钟
11.2k
Vue响应式系统的核心依然是对数据进行劫持,只不过Vue3采样点是Proxy类,而Vue2采用的是Object.defineProperty()。Vue3之所以采用Proxy类主要有两个原因:

彻底弄懂XSS和CSRF

2020-06-28
阅读 9 分钟
6k
XSS 全称为(Cross Site Scripting),即 跨站脚本攻击。同时为了不和层叠式样式表CSS(Cascading Style Sheets)产生混淆,故将跨站脚本攻击缩写为XSS。其是Web应用中常见的一种漏洞,攻击者通过向网页中注入一段客户端脚本(通常为JavaScript),那么当用户浏览该网页的时候,脚本就会被执行,从而达到攻击的目的。

从零实现一个Sass预处理器

2020-06-09
阅读 16 分钟
2.1k
Sass 是一款强化 CSS 的辅助工具,它在 CSS 语法的基础上增加了变量 (variables)、嵌套 (nested rules)、混合 (mixins)、导入 (inline imports) 等高级功能,这些拓展令 CSS 更加强大与优雅。使用 Sass 以及 Sass 的样式库(如 Compass)有助于更好地组织管理样式文件,以及更高效地开发项目。

33行react简要分析

2020-06-02
阅读 5 分钟
2k
虽然代码总共才33行,但是写的非常简洁,可能不是一下就能看懂,我对此细细研读了一番,用更加明了的方式重新写了一下。主要就是对外暴露了React.createElement()和React.render()两个方法。① 实现代码基本框架

Flex布局与缩放比例计算

2020-05-28
阅读 8 分钟
11k
采用 Flex 布局的元素,称为 Flex 容器(flex container),简称"容器"。它的所有子元素自动成为容器成员,称为 Flex 项目(flex item),简称"项目"。

eval与new Function的区别

2020-05-24
阅读 3 分钟
10.9k
② new Function: JS中的每个函数都是 Function 类型的实例,即JS中所有的函数的proto都指向Function的prototype,或者说,JS中所有的函数都是由Function构造出来的。

rollup模块打包器入门

2020-05-16
阅读 5 分钟
9.2k
rollup 是一个 ES Module 模块打包器,可以将小块代码编译成大块复杂的代码,其源码中模块的导入导出采用的是ES6模块语法,即源码需要采用ES6语法进行编写。

express开启https服务器

2020-04-10
阅读 3 分钟
5.9k
客户端发起请求,服务器收到请求后将证书发送给客户端,证书中包含了服务器端的公钥,客户端收到证书后,生成一个对称密钥,并取出服务器公钥对这个对称密钥进行加密,服务端收到后用私钥进行解密,拿到客户端发送过来的对称密钥,之后客户端和服务端将采用这个对称密钥进行加密和解密数据。

Service Worker初探

2020-04-10
阅读 8 分钟
2.9k
Service workers 本质上充当Web应用程序与浏览器之间的代理服务器,比如拦截客户端的请求、向客户端发送消息、向服务器发起请求等等,其中最重要的作用之一就是离线资源缓存,先将网络请求进行拦截,然后判断网络是否可用,如果网络不可用,那么读取浏览器缓存并返回,从而实现离线应用。

从零开始实现一个react-router-dom插件

2020-04-03
阅读 11 分钟
2.9k
要想自己实现一个react-router-dom,就必须先了解一下react-router-dom的基本使用,react-router-dom与vue-router有点不同,react-router-dom采用的是去中心化路由,所以其不需要写一个单独的router.js来集中配置和管理路由,如:

从零实现redux和react-redux

2020-03-30
阅读 21 分钟
2.1k
redux本质是一个全局的状态管理器,主要用于跨级组件数据传递以及状态的统一管理。作为一个状态管理器,当其中的数据发生变化的时候,外部应该可以通过某种方式获取变化后的状态,其内部采用了发布订阅模式。外部通过调用其subscrible()方法,传递回调监听器函数,当调用dispatch()方法导致状态发生变化的时候,监听器执...

Docker基本使用以及实战部署Vue项目

2020-03-22
阅读 13 分钟
8.9k
Docker 是一个开源的应用容器引擎,基于Go 语言并遵从 Apache2.0 协议开源。Docker 可以让开发者打包他们的应用以及依赖包到一个轻量级、可移植的容器中,然后发布到任何流行的 Linux 机器上,也可以实现虚拟化。

从零开始实现一个简单的WebSocket协议

2020-03-19
阅读 14 分钟
5.5k
WebSocket是一种基于TCP连接的全双工通信的协议,其工作在应用层,建立连接的时候通过复用http握手通道,完成http协议的切换升级,即切换到WebSocket协议,协议切换成功后,将不再需要客户端发起请求,服务端就可以直接向客户端发送数据,实现双向通信。相对于Http协议而言,WebSocket有以下优点:

node进程与线程

2020-03-18
阅读 9 分钟
6.7k
进程是指正在进行中的程序,即正在运行的程序。进程是操作系统进行资源分配和调度的最小单位,所以每个进程都拥有自己独立的虚拟地址空间,一般情况下,包括文本区域(text region)、数据区域(data region)和堆栈区域(stack region)。文本区域存储处理器执行的代码;数据区域存储全局的变量和常量;堆栈区域其中栈...

vue-router相关问题整理

2020-03-18
阅读 4 分钟
2.5k
默认情况下,当页面中有滚动条的时候,我们通过vue-router进行页面的切换时,你会发现滚动条的位置就像会被缓存了一样,但是通过created钩子,我们可以看到在切换路由的过程中,组件是在不断创建和销毁的,但是滚动条位置会保持和上一个页面一致。但是有的时候我们想要在切换路由的时候,希望目标路由页面滚动条在最上面...

从零开始实现一个vuex插件

2020-03-16
阅读 6 分钟
2.4k
要想自己实现一个vuex插件,就必须先了解一下vuex插件的基本使用,我们在使用vuex的时候,通常会定义一个store.js文件,里面主要就是干了以下几件事:

axios的封装和api的管理

2020-03-14
阅读 11 分钟
8.6k
Content-Type 用于规定客户端通过http或https协议向服务器发起请求时,传递的请求体中数据的编码格式。因为get请求是直接将请求数据以键值对通过&号连接(key1=value1&key2=value2)的方式附加到url地址后面,不在请求体中,所以get请求中不需要设置Content-Type。通过浏览器抓取get请求数据可以发现其请求头中并...

使用react实现一个简版的印象笔记App

2020-01-13
阅读 17 分钟
3.2k
因为执行npm init命令的时候,会自动在init之后的包名加上create前缀,所以相当于安装并执行create-react-app包,所以我们再传入项目名称即可创建对应的react项目了。注意,react的项目名不能以大写字母开头。