当然我们可以用一个通俗的说法：设计模式是解决某个特定场景下对某种问题的解决方案。因此，当我们遇到合适的场景时，我们可能会条件反射一样自然而然想到符合这种场景的设计模式。

我的书签 我的书签（谨慎导入，小心覆盖） 工具类 nvm: node版本管理 nrm: 快速切换npm源 shell: zsh+on-my-zsh配置教程指南 sourcetree: git可视化工具 前端工具集: WEB前端助手(FeHelper) 网络封包截取工具 charles(mac) 格式化工具 textLab(mac) 标注工具 markman 模拟请求 postman CSS类 深入浅出CSS布局 你所不知道...

这是《学习JavaScript数据结构与算法》的最后一篇博客，也是在面试中常常会被问到的一部分内容：排序和搜索。在这篇博客之前，我每每看到排序头就是大的，心里想着类似“冒泡排序，两层遍历啪啪啪“就完事了，然后再也无心去深入研究排序相关的问题了。如果你也有类似的经历，希望下面的内容对你有一定帮助

通俗的解释：年级主任需要知道某个年级的数学成绩的平均值，他没法直接得到结果；年级主任需要问每个班的数学老师，数学老师需要问班上每个同学；然后再沿着学生-->老师-->主任这条线反馈，才能得到结果。递归也是如此，自己无法直接解决问题，将问题给下一级，下一级若无法解决，再给下一级，直到有结果再依次向...

上一篇：JS数据结构与算法_链表 写在前面 说明：JS数据结构与算法 系列文章的代码和示例均可在此找到 一、集合Set 1.1 集合数据结构 集合set是一种包含不同元素的数据结构。集合中的元素成为成员。集合的两个最重要特性是：集合中的成员是无序的；集合中不允许相同成员存在 计算机中的集合与数学中集合的概念相同，有一...

上一篇博客发布以后，仅几天的时间竟然成为了我写博客以来点赞数最多的一篇博客。欢喜之余，不由得思考背后的原因，前端er离数据结构与算法太遥远了，论坛里也少有人去专门为数据结构与算法撰文，才使得这看似平平的文章收获如此。不过，这样也更加坚定了我继续学习数据结构与算法的决心（虽然只是入门级的）

原计划是把《你不知道的Javascript》三部全部看完的，偶然间朋友推荐了数据结构与算法的一套入门视频，学之。发现数据结构并没有想象中那么遥不可及，反而发觉挺有意思的。手头上恰好有《学习Javascript数据结构与算法》的书籍，便转而先把数据结构与算法学习。

这是2019年第一篇博客，回顾去年年初列的学习清单，发现仅有部分完成了。当然，这并不影响2018年是向上的一年：在新的城市稳定、连续坚持健身三个月、早睡早起、游戏时间大大缩减，学会生活。根据上一年目标完成情况，新一年的计划将采取【敏捷迭代】的方式：制定大方向，可临时更新小目标的策略。哈哈，话不多说..

this是在运行时进行绑定的，并不是在编写时绑定，它的上下文取决于函数调用时的各种条件this的绑定和函数声明的位置没有任何关系，只取决于函数的调用方式当一个函数被调用时，会创建一个活动记录(有时候也称为执行上下文)。这个记录会包含函数在哪里被调用(调用栈)、函数的调用方法、传入的参数等信息。this 就是记录的...

下一篇：《你不知道的javascript》笔记_this 写在前面 这一系列的笔记是在《javascript高级程序设计》读书笔记系列的升华版本，旨在将零碎未知的知识总结 一、基本概念 1.1 编译 在传统编译语言的流程中，程序中的一段源代码在执行之前会经历三个步骤，统称为编译： 1. 分词/词法分析(Tokenizing/Lexing) 这个过程会将由...

公司的系统中，产品经理在设计时经常要求对某个字段进行区间阈值设置或者作为筛选条件。但是苦于element中没有非常契合的组件（slider组件并不支持两端均能设定），于是自己动手造了一个。

《CSS世界》这本书还剩六章，但是这本书的精华部分主要是前面的内容，这里仅把后面章节相对重要的内容以博客展示，想着了解更多的小伙伴还是去阅读原文的好，毕竟三百多页的一本书并不是小小几篇博客能完全说清楚的。

原本博客名为“浮动与定位”，但是《CSS世界》第六章节的内容不仅有浮动定位，很大一部分篇幅都在讲BFC和overflow。更吸引人的是，作者将float/absolute/relative形容为“魔界三兄弟”，将原本枯燥的理论知识硬生生变成了玄幻小说。

在页面布局中，内联元素的垂直对齐是比较常见和基础的布局需求，但是我们往往会因为垂直对齐中的1px，2px而头疼不已。在这一篇博客（《css世界》第五章）中，张大大从深层次解释了垂直对齐的原理，并为内联元素的垂直对齐提供了最佳实践。

在读《CSS世界》第四章之前，粗浅的认为盒模型无非是margin/border/padding/content而已，再多无非在不同box-sizing下的表现不同而已；但是书中记录的替换元素与非替换元素、content的一些用法、margin合并等等，让我对“盒模型四大家族”有了全新的认识

初读《CSS世界》还是在深圳，属于换工作前的充能。那时候除了工作，其他时间基本都在这本书里了，因为它的确吸引人。之前看过《CSS揭密》，不过是对CSS3知识的讲解和一些应用，但是《CSS世界》这本书将CSS作为一个体系讲解，颠覆了以往对CSS的认知。这是“二进宫”了，想着我是应该写点什么的。

上一篇博客（Vue组件通信深入）中，介绍了多种方法来实现组件之间的通信，但是涉及到深层嵌套和非直接关联组件之间的通信时，都会遇到无法追踪数据和调试的问题，而vuex就是为解决此类问题而生的。

vue中，组件是带有一个名字、可复用的 Vue 实例。由于 Vue 是面向视图的MVVM框架，组件可以看做是对数据和方法的简单封装、具有独立的逻辑和功能的界面，多个组件按照一定规则的组合最终成为一个完整的应用

下一篇：Vue组件通信深入 这篇博客将会从下面四个常见的应用诠释组件的生命周期，以及各个生命周期应该干什么事 单组件的生命周期 父子组件的生命周期 兄弟组件的生命周期 宏mixin的生命周期 建议：博客中的例子都放在vue_blog_project工程中，推荐结合工程实例与博客一同学习 生命周期：Vue 实例从开始创建、初始化数据...

上篇文章中说到：（1）当执行流进入函数时，对应的执行环境就会生成（2）执行环境创建时会生成变量对象，确定作用域链，确定this指向（2）每个执行环境都有一个与之关联的变量对象，环境中定义的所有变量和函数都保存在这个对象中

由于javascript是一门具有自动垃圾收集机制的编程语言，开发者不必担心内存的分配和回收的问题。因此，内存一词在javascript编程中被开发者提及较少，更有一些非专业计算机相关专业出身的开发人员对javascript中内存的概念全无，但这丝毫不影响内存在编程中的重要程度

继承和前面两篇文章中的知识非常相关，如果对函数创建原理和原型链不熟悉，请猛戳：《javascript高级程序设计》笔记：创建对象《javascript高级程序设计》笔记：原型图解 继承，通俗的说，就是将自身不存在的属性或方法，通过某种方式为自己所用 文章分别介绍原型链继承、call/apply继承（借用构造函数继承）、组合继承...

这个图描述了构造函数，实例对象和原型三者之间的关系，是原型链的基础：（1）实例对象由构造函数new产生；（2）构造函数的原型属性与实例对象的原型对象均指向原型（3）原型对象中有一个属性constructor指向对应的构造函数

虽然Object构造函数或对象字面量都可以用来创建单个对象，但这些方式有个明显的缺点：使用同一个接口创建很多对象，会产生大量的重复代码，如上面的代码，每创建一个类似的person对象，就会重复上面的写法，代码较为冗余

1. 什么是对象 对象是无序属性的集合 创建自定义对象最简单的方式就是以字面量的形式创建对象（或创建一个Object实例），然后再为它添加属性和方法，如下所示： {代码...} 但是我们需要定义对象中的某个属性能否修改，能够重写等属性，那我们应该如何定义 2. 内置属性—数据属性 Object.defineProperty()方法介绍(摘自MDN...

在上一篇文章（《javascript高级程序设计》笔记：Function类型）中稍微提及了一下函数对象的属性—this，在这篇文章中有深入的说明： 函数的三种简单调用模式 1 函数模式 定义的函数，如果单独调用，不将其与任何对象关联，那么就是函数调用模式 {代码...} 函数模式this指向window 2 方法模式 定义的函数, 如果将函数作为...

这么长时间没有写博客，就是因为函数这部分比较麻烦，自己一直想抽出大把的时间来研究这个，可是结果却是一拖再拖，这样不好。有时间就写才是王道啊，不然这计划得一直卡在这里了..

RegExp 的每个实例都具有下列属性，通过这些属性可以取得有关模式的各种信息。 global:布尔值，表示是否设置了 g 标志。ignoreCase:布尔值，表示是否设置了 i 标志。lastIndex:整数，表示开始搜索下一个匹配项的字符位置，从 0 算起。multiline:布尔值，表示是否设置了 m 标志。source:正则表达式的字符串表示，按照字面...

1.参数: 要查找的项和(可选的)表示查找起点位置的索引。2.indexOf()方法从数组的开头(位置0)开始向后查找，lastIndexOf()方法则从数组的末尾开始向前查找3.两个方法都返回要查找的项在数组中的位置，或者在没找到的情况下返回-1。4.在比较第一个参数与数组中的每一项时，会使用全等操作符

结论：1.不给 join()方法传入任何值，或者给它传入 undefined，则使用逗号作为分隔符；2.join()会将传入的参数隐式转换成字符串形式3.如果数组中的某一项的值是 null 或者 undefined，那么返回的结果中以空字符串表示，toString()也遵循该准则 [1,2,undefined,3].join() ==> "1,2,,3"