从零打造组件库

2021-02-02
阅读 16 分钟
7k
答案肯定是不容易,当你去做这件事的时候,会发现它其实是一套体系。从开发、编译、测试,到最后发布,每一个流程都需要大量的知识积累。但是当你真正完成了一个组件库的搭建后,会发现收获的也许比想象中更多。

如何自己实现 JavaScript 的 new 操作符?

2020-03-25
阅读 2 分钟
7.5k
new 大家肯定都不陌生,单身没有对象的时候就 new 一个,很方便。那么它在创建实例的时候,具体做了哪些操作呢?今天我们就来一起分析一下。

浏览器 & HTTP 缓存策略

2020-03-20
阅读 4 分钟
5.3k
缓存策略 浏览器的缓存策略是依靠 HTTP Header 来实现的,共分为两种: 强缓存 协商缓存 强缓存 强缓存是指在缓存期间,请求不会发送到服务器,浏览器直接返回缓存结果,需要设置 Header: expires Cache-Control expires {代码...} expires 是 HTTP/1.0 中用于控制网页缓存的字段,其值代表服务器返回该请求结果的缓存...

JavaScript设计模式第3篇:抽象工厂模式

2019-12-11
阅读 4 分钟
2.4k
作者:leocoder 仓库:Github 博客:掘金、思否 公众号:学如登山 接着上一篇《JavaScript设计模式第2篇:工厂模式》),今天我们来看工厂模式的最后一种:抽象工厂。 定义 有了前一节工厂方法模式的基础,抽象工厂其实很类似,只不过工厂方法针对的是一个产品等级结构,而抽象工厂针对的是多个产品等级结构。 我们先来解...

JavaScript设计模式第2篇:工厂模式

2019-12-10
阅读 5 分钟
2.3k
分类 这里工厂模式分为2类:简单工厂 和 工厂方法,下一节会介绍第3类工厂模式:抽象工厂。 简单工厂 定义 简单工厂:定义一个类来创建其他类的实例,根据参数的不同返回不同类的实例,通常这些类拥有相同的父类。 例子 假设现在有 3 款车,Benz、Audi 和 BMW,他们都继承自父类 Car,并且重写了父类方法 drive: {代码....

JavaScript设计模式第1篇:单例模式

2019-11-24
阅读 4 分钟
4k
类Class是ES6新增的语法,在之前我们想要新建一个对象实例,是通过new构造函数的方式来实现的。我们每次调用new的时候,都会生成一个新的实例对象,每个实例对象之间是完全独立的。

JavaScript设计模式第0篇:前言

2019-11-18
阅读 2 分钟
1.7k
我们写代码的时候,实现一个需求,方式有很多种,但是哪种方式的可维护性,可扩展性更好,就需要我们具有一些设计模式的思想,这都是前人留下来的智慧,要好好继承呀······

带你五步学会Vue SSR

2018-10-10
阅读 24 分钟
51.3k
SSR大家肯定都不陌生,通过服务端渲染,可以优化SEO抓取,提升首页加载速度等,我在学习SSR的时候,看过很多文章,有些对我有很大的启发作用,有些就只是照搬官网文档。通过几天的学习,我对SSR有了一些了解,也从头开始完整的配置出了SSR的开发环境,所以想通过这篇文章,总结一些经验,同时希望能够对学习SSR的朋友起...

带你彻底弄懂Event Loop

2018-09-05
阅读 12 分钟
93.6k
我在学习浏览器和NodeJS的Event Loop时看了大量的文章,那些文章都写的很好,但是往往是每篇文章有那么几个关键的点,很多篇文章凑在一起综合来看,才可以对这些概念有较为深入的理解。

JavaScript实现函数重载

2018-08-29
阅读 4 分钟
9.5k
概念 重载是指函数或者方法有相同的名称,但是参数个数或类型不相同的情形,这样的同名不同参的函数或者方法之间,互相称之为重载函数或方法。 我们知道,JavaScript函数可以随意传递任意数量、任意类型的参数,那么它有没有重载呢? 答案是有的,下面我们通过3种方法来实现JavaScript的函数重载。 实现 0. 目标 我们有...

JavaScript实现继承

2018-08-28
阅读 9 分钟
3.5k
本文不准备深入细节,主要是对《JavaScript高级程序设计中》介绍的JS如何实现继承做一个总结,毕竟好记性不如烂笔头。文末会附带一张神图,搞清楚这张图,原型链也就没有什么问题了。

JavaScript数据结构04 - 链表

2018-08-03
阅读 10 分钟
2.6k
前面我们学习了数组这种数据结构。数组(或者也可以称为列表)是一种非常简单的存储数据序列的数据结构。在这一节,我们要学习如何实现和使用链表这种动态的数据结构,这意味着我们可以从中任意添加或移除项,它会按需进行扩容。

JavaScript数据结构03 - 队列

2018-07-26
阅读 6 分钟
5.8k
队列是遵循FIFO(First In First Out,先进先出)原则的一组有序的项。队列在尾部添加新元素,并从顶部移除元素。最新添加的元素必须排在队列的末尾。

JavaScript数据结构02 - 栈

2018-07-25
阅读 2 分钟
2.6k
一、定义 1.1 背景 通过前面一节《JavaScript数据结构01 - 数组》我们知道,可以在数组的任意位置上删除或添加元素。然而,有时候我们还需要一种在添加或删除元素时有更多控制的数据结构。 有两种数据结构类似于数组,但在添加和删除元素时更为可控。 它们就是栈和队列。 1.2 概念 栈是一种遵循后进先出(LIFO)原则的有...

JavaScript数据结构01 - 数组

2018-07-25
阅读 15 分钟
2.9k
一、创建数组 1.1 使用Array构造函数 {代码...} 1.2 使用数组字面量表示法 {代码...} 二、常用数组方法 方法名 描述 join 把数组的所有元素放入一个字符串,元素通过指定的分隔符进行分隔 pop 删除并返回数组的最后一个元素 push 向数组的末尾添加一个或更多元素,并返回新的长度 shift 删除并返回数组的第一个元素 unsh...

JavaScript异步编程

2018-07-20
阅读 13 分钟
14.1k
从我们一开始学习JavaScript的时候就听到过一段话:JS是单线程的,天生异步,适合IO密集型,不适合CPU密集型。但是,多数JavaScript开发者从来没有认真思考过自己程序中的异步到底是怎么出现的,以及为什么会出现,也没有探索过处理异步的其他方法。到目前为止,还有很多人坚持认为回调函数就完全够用了。

JS学习系列08 - 内存分配

2018-05-30
阅读 2 分钟
2.3k
本文会同步到我的个人网站中。 在ECMAScript中,变量可以存放两种类型的值 原始值 引用类型值 原始值指的是代表原始数据类型的值,例如:undefined null number string boolean引用类型指的是复合类型值,例如:object function array 自定义对象 堆和栈 栈是一种LIFO的数据结构,即后进先出,队列是一种FIFO的数据结构...

git 常用操作总结

2018-05-30
阅读 5 分钟
3.2k
本文是对常用git操作做一个总结,后续也会同步到我的个人网站。 1. 初始化 用户 {代码...} 2. 秘钥 查看是否存在秘钥 {代码...} id_rsa 是私钥,id_rsa.pub 是公钥 id_rsa.pub 是你需要上传到 github 的 SSH KEY 生成秘钥 {代码...} 3. 本地库和远程库 已创建有远程库,未创建本地库 {代码...} 已创建本地库,未创建远程...

CSS3 - 清除浮动

2018-05-30
阅读 4 分钟
3k
一、 目的 通过本文,让大家可以明白清除浮动的原理和几种方法,最后得出一种本文认为最好用的方法。本文也会同步到我的个人网站。 二、 内容简介 {代码...} 三、 正文 1、 浮动本来的意义浮动的意义原本仅是用来让文字环绕在图片周围而已。 通过上图可以看到,设置图片左浮动可以将图片从正常文档流中抽取出来,后面的...

看图学HTTPS

2018-05-21
阅读 4 分钟
9.4k
之前说到HTTPS,在我的概念中就是更安全,需要服务器配置证书,但是到底什么是HTTPS,为什么会更安全,整套流程又是如何实现的,在脑子里没有具体的概念。所以,我花了几天的时间,通过参考一些文章,学习了HTTPS整套机制的实现,想要通过一篇文章把我学习到的东西总结出来,让更多之前不清楚HTTPS到底是什么的同学有一...

聊聊V8引擎的垃圾回收

2018-04-14
阅读 8 分钟
14.3k
我们知道,JavaScript之所以能在浏览器环境和NodeJS环境运行,都是因为有V8引擎在幕后保驾护航。从编译、内存分配、运行以及垃圾回收等整个过程,都离不开它。

尾调用和尾递归

2018-04-10
阅读 6 分钟
8.7k
尾调用 1. 定义 尾调用是函数式编程中一个很重要的概念,当一个函数执行时的最后一个步骤是返回另一个函数的调用,这就叫做尾调用。 注意这里函数的调用方式是无所谓的,以下方式均可: {代码...} 并且只有下列表达式会包含尾调用: {代码...} 依次举例: {代码...} {代码...} {代码...} {代码...} 2. 尾调用优化 函数在...

JS学习系列 07 - 标签声明(Label Statement)

2018-04-02
阅读 3 分钟
2.8k
1. 引言 假设有这么一道题: {代码...} 我想要当 j = 2 的时候就退出所有的for语句,打印最后的 done ,你会怎么做? 可能有的同学会想到这样: {代码...} 这样可以实现,但是又多写了一个函数,那么有没有别的办法呢? 再看一个例子,你也一定见到过这样的写法: {代码...} 那么,你有没有想过 eval 里面为什么要加上括...

搭建 karma + jasmine 测试环境

2018-03-27
阅读 3 分钟
3.3k
在前端开发的过程中,我们会写很多的功能函数,这样就会涉及到对这些功能函数进行单元测试,而karma就是一个很好用的可以在浏览器环境中进行测试的集成工具。

JS学习系列 06 - 变量对象

2017-03-06
阅读 6 分钟
1.6k
上一节我们讨论了执行上下文,那么在上下文中到底有什么内容,为什么它会和作用域链扯上关系,JS 解释器又是怎么找到我们声明的函数和变量,看完这一节,相信大家就不会再迷惑了。

HTML - 移动端 meta viewport

2017-02-28
阅读 3 分钟
10.3k
添加了这段代码以后,我们在移动端看到的显示效果就非常好,整个页面不会缩成一团。但是很多时候我们只是拿来用了,没有去理解这段代码究竟干了什么,为什么会影响移动端页面的布局效果,它又是怎么起作用的。今天我们就花点时间来彻底搞明白 viewport 到底是什么。

JS学习系列 05 - 执行上下文

2017-02-27
阅读 2 分钟
2.1k
在我们前面理解了作用域之后,“作用域链”这个概念就产生了。那么作用域链是什么意思,它又是怎么形成的,跟哪些概念有关系,这就是我接下来几章想和大家探讨的内容:执行上下文、变量对象和作用域链。根据顺序我们也可以看出来,想要理解作用域链,执行上下文是我们碰到的第一个坎。

JS学习系列 04 - 提升

2017-02-22
阅读 3 分钟
2.2k
到目前为止,大家应该很熟悉作用域的概念了,以及根据声明的位置和方式将变量分配给作用域的相关原理了。函数作用域和块作用域的行为是一样的,可以总结为:任何声明在某个作用域内的变量,都将属于这个作用域。

JS学习系列 03 - 函数作用域和块作用域

2017-02-22
阅读 7 分钟
2.2k
在 ES5 及之前版本,JavaScript 只拥有函数作用域,没有块作用域(with 和 try...catch 除外)。在 ES6 中,JS 引入了块作用域,{ } 内是单独的一个作用域。采用 let 或者 const 声明的变量会挟持所在块的作用域,也就是说,这声明关键字会将变量绑定到所在的任意作用域中(通常是 {...} 内部)。

JS学习系列 02 - 词法作用域

2017-02-20
阅读 3 分钟
1.9k
大部分标准语言编译器的第一个工作阶段叫作词法化。简单地说,词法作用域是由你在写代码时将变量和函数(块)作用域写在哪里来决定的。当然,也会有一些方法来动态修改作用域,后边我会介绍。