前言 本站基于Hexo搭建，用的 🦋 hexo-theme-butterfly 主题，已经升级到 v4.7.0 。 请注意最新的🦋 hexo-theme-butterfly 版本已经更新到 v4.8.1 。如果你是 v3.7.1 的版本，请移步 v3.7.1 站点进行浏览。 注意：我的博客根目录路径为 【G:/hexo-blog/blog-demo】，下文所说的根目 ...

概述历史上，JavaScript 一直没有模块（module）体系，无法将一个大程序拆分成互相依赖的小文件，再用简单的方法拼装起来。其他语言都有这项功能，比如 Ruby 的require、Python 的import，甚至就连 CSS 都有@import，但是 JavaScript 任何这方面的支持都没有，这对开发大型的、复杂的项目形成了巨大障碍。 在 ES6 之前，社区制定了一些模块加载方案，最 ...

变量声明方式 let/const与 var 不同，新的变量声明方式带来了一些不一样的特性，其中最重要的两个特性就是提供了块级作用域与不再具备变量提升。通过 2 个简单的例子来说明这两点。 12345{ let a = 20;}console.log(a); // a is not defined 而这个简单的例子，会被编译为： 12345{ ...

前言文章的开头，主要分析一下，为什么会有 Promise 出现。 在实际的使用中，有非常多的应用场景我们不能立即知道应该如何继续往下执行。最常见的一个场景就是 ajax 请求。通俗来说，由于网速的不同，可能你得到返回值的时间也是不同的，这个时候我们就需要等待，结果出来了之后才知道怎么样继续下去。 1234567891011121314// 简单的ajax原生实现var url = 'ht ...

推荐阅读 这个前端面试在搞事 80% 应聘者都不及格的 JS 面试题 熟悉事件循环？那谈谈为什么会分为宏任务和微任务 学习事件循环机制之前，希望你已经懂得了如下概念： 执行上下文(Execution context) 函数调用栈(call stack) 队列数据结构(queue) Promise(将在下一篇文章专门总结Promise的详细使用) 因为chrome浏览器中新标准中的事件 ...

jQuery在前端史上有它非常超然的历史地位，许多从中学到的技巧在实践开发中仍然非常好用。简单的了解它有助于我们更加深入的理解JavaScript。如果你能够从中看明白jquery是如何一步步被取代的，那么，我想你的收益远不止学会使用了一个库那么简单。 因此，我的态度是，项目中你可以不用，但是我建议你了解了解jQuery的思想。 这篇文章的主要目的，是从面向对象的角度，跟大家分享jquery对象 ...

前几篇文章，跟大家分享了JavaScript的一些基础知识，这篇文章，将会进入第一个实战环节：利用前面几章的所涉及到的知识，封装一个拖拽对象。为了能够帮助大家了解更多的方式与进行对比，在这里将使用三种不同的方式来实现拖拽。 不封装对象直接实现； 利用原生JavaScript封装拖拽对象； 通过扩展jQuery来实现拖拽对象。 本文的例子将会放置于codepen.io中，供大家在阅读时直接查看 ...

对象的定义在ECMAScript-262中，对象被定义为“ 无序属性的集合，其属性可以包含基本值，对象或者函数 ”。 也就是说，在JavaScript中，对象无非就是由一些列无序的key-value对组成。其中value可以是基本值，对象或者函数。 1234567// 这里的person就是一个对象var person = { name: 'Tom', a ...

柯里化是函数的一个高级应用，通过上一个章节的学习我们知道，接收函数作为参数的函数，都可以叫做高阶函数。这一章我们要学习的柯里化，其实就是高阶函数的一种特殊用法。 柯里化是指这样一个函数(假设叫做createCurry)，他接收函数A作为参数，运行后能够返回一个新的函数。并且这个新的函数能够处理函数A的剩余参数。 这样的定义可能不太好理解，我们可以通过下面的例子配合解释。 有一个接收三个参数的函 ...

函数声明、函数表达式、匿名函数与自执行函数函数声明JavaScript中，有两种声明方式，一个是使用var/let/const的变量声明，另一个是使用function的函数声明。 在 前端基础进阶（三）：变量对象详解 一文中有提到过，变量对象的创建过程中，函数声明比变量声明具有更为优先的执行顺序，即常常提到的函数声明提前。因此在执行上下文中，无论在什么位置声明了函数，都可以在同一个执行上下文中直接 ...

前端开发中，有一个重要的技能，叫做 断点调试 。 利用chrome开发者工具中的断点调试，能够一步步观察JavaScript的执行过程，直观感知函数调用栈、作用域链、变量对象、闭包、this等关键信息的变化。因此，断点调试对于快速定位代码错误，以及快速了解代码的执行过程有着非常重要的作用，这也是前端开发必不可少的一个高级技能。 这篇文章的另一个目的在于借助对于断点调试的学习，进一步加深对闭包的理解 ...

在这之前，先回顾一下执行上下文的生命周期。 执行上下文生命周期 执行上下文的创建阶段，会分别生成变量对象，建立作用域链，确定this指向。本文的关键，就是确定this指向。this的指向，是在函数被调用的时候确定的。也就是执行上下文被创建时确定的 。 一个函数中的this指向，可以非常灵活。比如下面的例子中，同一个函数由于调用方式的不同，this指向了不一样的对象。 1234567891011v ...

在上文 前端基础进阶（五）：闭包 中的结尾留下了一个关于setTimeout与循环闭包的思考题。 利用闭包，修改下面的代码，让循环输出的结果依次为1， 2， 3， 4， 5 12345for (var i = 1; i <= 5; i++) { setTimeout(function timer() { console.log(i); }, i * ...

闭包闭包是一种特殊的对象。它由两部分组成。执行上下文(代号A)，以及在该执行上下文中创建的函数（代号B）。 当B执行时，如果访问了A中变量对象中的值，那么闭包就会产生。 在大多数理解中，包括许多著名的书籍，文章里都以函数B的名字代指这里生成的闭包。而在chrome中，则以执行上下文A的函数名代指闭包 。 一个闭包对象，由A、B共同组成，在以后的篇幅中，我将以chrome的标准来称呼。 ...