57 热度

如何使用JavaScript构建模态框插件

作为一位Web开发人员而言,模态框(Modal)并不会陌生。就我个人而言,我更为熟悉的是怎么通过CSS来编写一个模态框以及怎么通过CSS给模态框添加一些动效。正好最近工作中也和Modal框杠上了。另外想更好的设计一个模态框用来满足业务需求的普遍性和实用性,甚至是达到可配置性。所以一直在探究模态框相关的知识,同时正好看到了@Ken Wheeler的教程,对于我这样的菜鸟,能很好的了角如何使用原生的J...

收录时间: 2019-01-20
分类: Javascript
贡献者: Rector
87 热度

从项目的 GitHub 星星数看2018年 JavaScript 生态圈

第三年 JavaScript Rising Stars 统计结果出来了,官方分析了 Best of JavaScript 上的项目,比较这些项目过去12个月,在 GitHub 上增加的星标数,将其排名并绘制成图表,呈现 JavaScript 社群的发展状况。Best of JavaScript是提供网页平台与Node.js相...

收录时间: 2019-01-20
分类: Javascript
贡献者: Rector
80 热度

JavaScript 是如何工作的:深入网络层 + 如何优化性能和安全

正如在上一篇关于 渲染引擎的博客文章中提到的,我们认为优秀的 JavaScript 开发人员和杰出的 JavaScript 开发人员之间的区别在于,后者不仅理解语言的具体细节,而且理解其内部结构和周遭环境。讲一点历史49年前,一种叫做 ARPAnet 的网诞生了。它是一个早期的 分组交换网络,也是第一个 实现TCP/IP套件的网络。20年后,蒂姆·伯纳斯-李提出了一种“网状结构”的建议,这种结...

收录时间: 2019-01-16
分类: Javascript
贡献者: Rector
120 热度

简约强大数组操作组合

在实际js开发中对数组操作频率非常高,看过一些小伙伴的一些用法,挺有意思,在这里小记(不全)一下,备忘。5个迭代方法:every、filter、forEach、map和some every():对数组中的每一项运行给定函数,如果该函数每一项都返回true,则返回true; filter():对数组中的每一项运行给定函数,返回该函数会返回true的项组成的数组; forEach():对数组中的每一项运行给定函数,这个方法没有返回值; map():对数组中的每一项运行给定函数,返回每次函数调用的结果组成的数组; some():对数组中的每一项运行给定函数,如果该函数任意一项返回true,则返回true;

收录时间: 2018-12-26
分类: Javascript
贡献者: Rector
145 热度

JavaScript开发的40+个经典技巧

JavaScript是一个绝冠全球的编程语言,可用于Web开发、移动应用开发(PhoneGap、Appcelerator)、服务器端开发(Node.js和Wakanda)等等。JavaScript还是很多新手踏入编程世界的第一个语言。既可以用来显示浏览器中的简单提示框,也可以通过nodebot或nodruino来控制机器人。能够编写结构清晰、性能高效的JavaScript代码的开发人员,现如今已成了招聘市场最受追捧的人。 在这篇文章里,将和大家分享一些JavaScript的技巧、秘诀和最佳实践,除了少数几个外,不管是浏览器的JavaScript引擎,还是服务器端JavaScript解释器,均适用。

收录时间: 2018-12-07
分类: Javascript
贡献者: Rector
192 热度

JavaScript线程机制与事件机制

一、进程与线程1.进程进程是指程序的一次执行,它占有一片独有的内存空间,可以通过windows任务管理器查看进程(如下图)。同一个时间里,同一个计算机系统中允许两个或两个以上的进程处于并行状态,这是多进程。比如电脑同时运行微信,QQ,以及各种浏览器等。浏览器运行是有些是单进程,如firefox和老版IE,有些是多进程,如chrome和新版IE。2.线程有些进程还不止同时干一件事,比如W...

收录时间: 2018-10-16
分类: Javascript
贡献者: Rector
AD 友情赞助
260 热度

原生js替换jQuery各种方法-中文版

原文https://github.com/nefe/You-D...You Don't Need jQuery前端发展很快,现代浏览器原生 API 已经足够好用。我们并不需要为了操作 DOM、Event 等再学习一下 jQuery 的 API。同时由于 React、Angular、Vue 等框架的流行,直接操作 DOM 不再是好的模式,jQuery 使用场景大大减少。本项目总结了大部分 jQu...

收录时间: 2018-10-08
分类: Javascript
贡献者: Rector
230 热度

JavaScript字符串操作方法大全,包含ES6方法

一、charAt()返回在指定位置的字符。var str="abc"console.log(str.charAt(1))//a二、charCodeAt()返回在指定的位置的字符的 Unicode 编码。var str="abc"console.log(str.charCodeAt(1))//98三、concat()连接字符串。var a = "abc";var b = "def";va...

收录时间: 2018-10-08
分类: Javascript
贡献者: Rector
292 热度

从0到1实现Promise

前言Promise大家一定都不陌生了,JavaScript异步流程从最初的Callback,到Promise,到Generator,再到目前使用最多的Async/Await(如果对于这些不熟悉的可以参考我另一篇文章《JavaScript异步编程》),这不仅仅是技术实现的发展,更是思想上对于如何控制异步的递进。Promise作为后续方案的基础,是重中之重,也是面试时候最常被问到的。今天我们就一起...

收录时间: 2018-09-30
分类: Javascript
贡献者: Rector
269 热度

JavaScript循环遍历你会用哪些?

总结JavaScript中的循环遍历定义一个数组和对象const arr = ['a', 'b', 'c', 'd', 'e', 'f'];const obj = {a: 1,b: 2,c: 3,d: 4}for()经常用来遍历数组元素遍历值为数组元素索引for (let i = 0, len = arr.length; i < len; i++) {console.log(i); ...

收录时间: 2018-09-30
分类: Javascript
贡献者: Rector
203 热度

SPA路由机制详解(看不懂不要钱~~)

前言总所周知,随着前端应用的业务功能起来越复杂,用户对于使用体验的要求越来越高,单面(SPA)成为前端应用的主流形式。而大型单页应用最显著特点之一就是采用的前端路由跳转子页面系统,通过改变页面的URL,在不重新请求页面的情况下,更新页面视图。更新视图但是浏览器不重新渲染整个页面,只是重新渲染部分子页面,加载速度快,页面反应灵活,这是 SPA 的优势,这也是前端路由原理的核心,这会给人一种仿佛在...

收录时间: 2018-09-22
分类: Javascript
贡献者: Rector
250 热度

[译] 我从没理解过 JavaScript 闭包

正如标题所说,JavaScript 闭包对我来说一直是个迷。我 看过 很多 文章,在工作中用过闭包,甚至有时候我都没有意识到我在使用闭包。 最近参加一个交流会,有人用某种方式向我解释了闭包,点醒了我。这篇文章我也将用这种方式来解释闭包。这里要称赞一下 CodeSmith 的优秀人才和他们的《JavaScript The Hard Parts》系列。

收录时间: 2018-09-09
分类: Javascript
贡献者: Rector
266 热度

高效遍历匹配Json数据,避免嵌套循环

工作中经常会遇到这样的需求:1.购物车列表中勾选某些,点击任意一项,前往详情页,再返回购物车依旧需要呈现勾选状态2.勾选人员后,前往别的页面,再次返回,人员依旧程勾选状态3.等等....数据结构如下:// 缓存数据var students = [{ id: 35, name: '小明', age: 25, address: '环球中心',checked:true},{ id: 36, name: ...

收录时间: 2018-09-06
分类: Javascript
贡献者: Rector
231 热度

[译] axios 内部设计分析

在前端开发过程中,我们经常遇到需要用到异步请求的场景。所以,一个功能齐全的 HTTP 请求库,可以极大的减少开发时间,提高开发效率。 axios 是近几年非常热门 HTTP 请求库。目前在 Github 已经有超过 40k 的 stars,也得到很多权威人士的推荐。 因此,有必要去了解一下 axios 是如何设计的、是如何实现 HTTP 请求库的。写这篇文章时 axios 的版本是 0.18.0,我们以此版本为例,来解读分析源码细节。axios 的源码是在 lib 目录下,以下涉及到的路径都是相对 lib 目录。

收录时间: 2018-09-05
分类: Javascript
贡献者: Rector
212 热度

JavaScript七种非常经典的创建对象方式

JavaScript创建对象的方式有很多,通过Object构造函数或对象字面量的方式也可以创建单个对象,显然这两种方式会产生大量的重复代码,并不适合量产。接下来介绍七种非常经典的创建对象的方式,他们也各有优缺点。(内容主要来自于《JavaScript高级程序设计》,还参考了一下别人写的文章)一、工厂模式function createPerson(name, job) {var o = new ...

收录时间: 2018-08-27
分类: Javascript
贡献者: Rector
201 热度

JavaScript系列 事件

一步,一步前進の一步事件是文档或者浏览器窗口中发生的一些交互瞬间。JS注册事件处理程序来预订事件,当事件发生的瞬间来执行相应的代码,进而实现 JS 和 HTML(即文档或者浏览器窗口) 的交互。事件流事件流描述的是从页面中接收事件的顺序。用手指戳一下屏幕上的同心圆的中心,先点到的是最外围的大圆,还是最核心的小圆呢?这个就是事件流要处理的本质问题。早起的 IE 和 Netscape 对此...

收录时间: 2018-08-27
分类: Javascript
贡献者: Rector
252 热度

【资源集合】 ES6 元编程(Proxy & Reflect & Symbol)

导读几年前 ES6 刚出来的时候接触过 元编程(Metaprogramming)的概念,不过当时还没有深究。今天在应用和学习中不断接触到这概念,比如 mobx 5中就用到了 Proxy 重写了 Observable 对象,觉得有必要梳理总结一下。本文不生产代码,只当代码、文档的搬运工。所以本文并非是一篇传统意义上的教程,更类似于 github awesome这样列表文章。1、理解元编程Sy...

收录时间: 2018-08-26
分类: Javascript
贡献者: Rector
222 热度

现代JS中的流程控制:详解Callbacks 、Promises 、Async/Await

JavaScript经常声称是_异步_。那是什么意思?它如何影响发展?近年来这种方法有何变化?请思考以下代码:result1 = doSomething1();result2 = doSomething2(result1);大多数语言都处理每一行同步。第一行运行并返回结果。第二行在第一行完成后运行无论需要多长时间。单线程处理JavaScript在单个处理线程上运行。在浏览器选项卡中执行...

收录时间: 2018-08-26
分类: Javascript
贡献者: Rector
204 热度

DOM系列:DOM事件的传播

通过前面的DOM事件模型和事件绑定的姿势两节的学习,我们对JavaScript中的DOM事件有了一定的基础。但忽略了有关事件如何被触发的重要细节。事件传播让我们从事件传播开始。事件传播是事件冒泡和事件捕获的总称。先来看一张图,这张图在前面的文章中有也出现过,但没有深入的介绍。先上图吧!W3C规范中定义了三个事件阶段,依次是捕获阶段、目标阶段和冒泡阶段。事件对象按照上图的传播路径依次完成...

收录时间: 2018-08-22
分类: Javascript
贡献者: Rector
299 热度

2018年你需要知道的13个JavaScript工具库

为了保证可读性,本文采用意译而非直译。另外,本文版权归原作者所有,翻译仅用于学习。JavaScript依然是2018年最受欢迎、最流行的编程语言,所以它的生态系统也十分完善。JavaScript小小的标准库不足以应付各种开发需求。在Github上,有许多流行的JavaScript库。在这里,我整理了一个列表推荐给大家:1. Lodash & Underscore也许大多数童鞋都已经...

收录时间: 2018-08-14
分类: Javascript
贡献者: Rector