分类：JavaScript

2018
05-16

[译]深入ES6之箭头函数

箭头一族缺少的家庭成员在JavaScript出现以来，箭头（Arrow）就一直是其语法的一部分。一般来说，JavaScript教程的第一篇就会讲如何在HTML中插入箭头括号来作为注释，这会阻止不支持JS的浏览器错误的将你的JS代码作为文字展现出来，比如这个：<scriptlanguage="javascript"><!--document.bgColor="brown";//red//--></script>老旧的浏览器只会看到两个不支持的tag以及一个注释，而现代... 继续阅读 >

2018
04-30

数组的遍历你都会用了，那Promise版本的呢

这里指的遍历方法包括：map、reduce、reduceRight、forEach、filter、some、every。因为最近要进行了一些数据汇总，node版本已经是8.11.1了，所以直接写了个async/await的脚本。但是在对数组进行一些遍历操作时，发现有些遍历方法对Promise的反馈并不是我们想要的结果。当然，有些严格来讲并不能算是遍历，比如说some，every这些的。但确实，这些都会根据我们数组的元素来进行多次的调用传入的回调。这些方法都是... 继续阅读 >

2018
04-11

使用让 JavaScript 安全且并发的 Web Workers

WebWorkers提供了一种在浏览器单线程执行外运行JS代码的方式。单线程处理了包括页面内容展示，通过键盘、鼠标点击和其他装置的用户交互，以及对于AJAX请求响应的一些请求。事件处理和AJAX请求是异步发生的，可以作为一种通用浏览器展示代码路径之外的运行代码的方式，但是它们仍然在这一单线程内运行，并且必须很快完成。否则，浏览器中的交互会失去作用。WebWorkers允许在一个单独的线程运行JS代码，... 继续阅读 >

2018
03-28

JavaScript：面试频繁出现的几个易错点

1.前言这段时间，金三银四，很多人面试，很多人分享面试题。在前段时间，我也临时担任面试官，为了大概了解面试者的水平，我也写了一份题目，面试了几个前端开发者。在这段时间里面，我在学，在写设计模式的一些知识，想不到的设计模式的这些知识，就是面试题里面，频繁让人掉坑的考点。所以，今天就总结一下，那些让人掉坑的考点。2.面向对象编程关于面向对象和面向过程，个人觉得这两者不是绝对独立的，而是相互... 继续阅读 >

2018
03-12

JavaScript中this的运行机制及爬坑指南

在JavaScript中，this这个特殊的变量是相对比较复杂的，因为this不仅仅用在面向对象环境中，在其他任何地方也是可用的。本篇博文中会解释this是如何工作的以及使用中可能导致问题的地方，最后奉上最佳实践。为了更好理解this，将this使用的场景分成三类：在函数内部this一个额外的，通常是隐含的参数。在函数外部（顶级作用域中）：这指的是浏览器中的全局对象或者Node.js中一个模块的输... 继续阅读 >

2018
02-22

来自1000多个项目的10大JavaScript错误浅析

作为对社区开发者的回馈，我们从我们的数据库里选出了10大来自数千个项目的JavaScript错误。我们将会给出产生这些错误的根源，以及如何避免再发生这些错误。如果能够避免这些错误，就可以成为更好的开发者。数据才是王道，我们通过收集和分析大量数据才选出了这10大JavaScript错误。我们收集每一个项目中出现的错误，并统计每一个错误发生的次数。我们根据错误代码的指纹（fingerprint）对它们进行分组，也就是说，如果第二... 继续阅读 >

2018
01-31

Javascript总结（常用工具类的封装）

前言因为工作中经常用到这些方法，所有便把这些方法进行了总结。JavaScript1.type类型判断isString (o) { //是否字符串      return Object.prototype.toString.call(o).slice(8, -1) === 'String'  }  isNumber (o) { //是否数字      return Object.prototy... 继续阅读 >

2018
01-23

从浏览器多进程到JS单线程，JS运行机制最全面的一次梳理

前言见解有限，如有描述不当之处，请帮忙及时指出，如有错误，会及时修正。———-超长文+多图预警，需要花费不少时间。———-如果看完本文后，还对进程线程傻傻分不清，不清楚浏览器多进程、浏览器内核多线程、JS单线程、JS运行机制的区别。那么请回复我，一定是我写的还不够清晰，我来改。。。———-正文开始———-最近发现有不少介绍JS单线程运行机制的文章，但是发现很多都仅仅是介绍某一部分的知识... 继续阅读 >

2018
01-16

JS设计模式入门和框架中的实践

在编写JS代码的过程中，运用一定的设计模式可以让我们的代码更加优雅、灵活。下面笔者就结合诸如redux的subscribe、ES6的class、vue里面的$dispatch、jquery里面的on/off来给大家简单介绍下设计模式在这些库、语法和框架中的使用。设计模式解决的问题设计模式并不是很玄乎的知识，很多同学在编写JS代码的时候已经在不经意间用了不少设计模式了。笔者认为把设计模式单独抽象出来探讨，就和算法中抽象出来冒泡、... 继续阅读 >

2017
12-28

深入浅出 JS 异步处理技术方案

为什么要异步"当我们在星巴克买咖啡时，假设有100个人在排队，也许咖啡的下单只要10S，但是咖啡的制作到客人领取咖啡要1000S。如果在同步的场景下，第一个客人下单到领取完咖啡要1010S才能轮到下一个客人，这在效率（某些场景）上来说会比较低下。如果我们异步处理这个流程，客人下单10S拿到凭证，客人就可以去做别的事情，并且10S后下一个客人可以继续下单，并不阻碍流程。反而可以通过凭证，让客人拿到自己的咖啡，也许时... 继续阅读 >

2017
12-20

老司机常用的几个JavaScript调试技巧

1.debugger除了console.log,debugger是我们最喜欢、快速且肮脏的调试工具。执行代码后，Chrome会在执行时自动停止。你甚至可以把它封装成条件，只在需要时才运行。if(thisThing){debugger;}2.用表格显示对象有时，有一组复杂的对象要查看。可以通过console.log查看并滚动浏览，亦或者使用console.table展开，更容易看到正在处理的内容！varanimals=[{animal:'Horse',name:'Henry',ag... 继续阅读 >

2017
12-17

Github分享：精心收集的48个JavaScript代码片段，仅需30秒就可理解！

该项目来自于Github用户Chalarangelo（文末有项目完整地址，原版为英文），目前已在Github上获得了3000多Star，精心收集了多达48个有用的JavaScript代码片段，该用户的代码可以让程序员在30秒甚至更少的时间内理解这些经常用到的基础算法，来看看这些JavaScript代码都传达出了什么吧！Anagramsofstring（带有重复项）使用递归。对于给定字符串中的每个字母，为字母创建字谜。使用map（）将字母与每部分字谜组合，... 继续阅读 >

2017
12-17

解读 JavaScript 之 V8 引擎及优化代码的 5 个技巧

几个星期前，我们开始了一系列旨在深入研究JavaScript及其实际工作方式的系列文章：我们认为通过了解JavaScript的构建块以及它们如何一起协作的，你将能够编写更好的代码和应用程序。本系列的第一篇文章重点介绍了引擎，运行时和调用堆栈的概述。第二篇文章将深入到GoogleV8JavaScript引擎的内部。我们还将提供一些关于如何编写更好的JavaScript代码的快速技巧-我们的 SessionStack开发团队在构建产品时... 继续阅读 >

2017
12-11

函数式编程中的 “函数们”

函数式编程中函数有三种不同的解读方式，分别为纯函数、高阶函数和一等函数。本文分别对这三者的概念、应用和联系进行详解。纯函数定义：1.相同的输入必定产生相同的输出2.在计算的过程中，不会产生副作用满足上述两个条件，我们就说该函数是纯函数。纯函数也即数学意义上的函数，表达的是数据之间的转换（映射）关系，而非计算步骤的详述。数学函数的定义：函数通常由定义域X、值域Y，以及... 继续阅读 >

2017
12-04

开发更好用的 JavaScript 模块

不少人都曾经在 npm 上发布过自己开发的JavaScript模块，而在使用一些模块的过程中，我经常产生“这个模块很有用，但如果能xxx就更好了”的想法。所以，本文将站在模块使用者的角度总结一下，如何能让模块变得更好用。提供ES6模块的入口webpack和rollup都支持对ES6模块做一些静态优化（例如 TreeShaking 和ScopeHoisting），它们都会优先读取package.json中的 module ... 继续阅读 >

2017
11-29

10个有趣的Javascript和CSS库-2017年11月

TailwindCSSTailwind是用于构建自定义用户界面的实用CSS框架。每个Tailwind小应用都有多种尺寸，这使得创建响应式界面变得非常简单。您可以自定义颜色，边框尺寸，字体，阴影等等，没有任何限制。PrettyCheckbox这是一个纯CSS库，用于创建漂亮的复选框和单选按钮。它提供了不同的形状（正方形，曲线，圆形），选择方式（默认，填充，thick），颜色（主要，成功，信息），颜色类型（实心，轮廓）和动画。... 继续阅读 >