现代 CSS

JavaScript

深度剖析:如何实现一个 Virtual DOM 算法

本文会在教你怎么用 300~400 行代码实现一个基本的 Virtual DOM 算法,并且尝试尽量把 Virtual DOM 的算法思路阐述清楚。希望在阅读本文后,能让你深入理解 Virtual DOM 算法,给你现有前端的编程提供一些新的思考。本文所实现的完整代码存放在 Github

Virtual DOM 的内部工作原理

虚拟DOM (VDOM,也称为 VNode) 是非常神奇的,同时也是复杂难懂的。 ReactPreact 以及其他类似的 JS 库都使用了虚拟 DOM 技术作为内核。可惜我找不到任何靠谱的文章或者文档可以简单又清楚解释清虚拟DOM的内部细节。所以,我就想到自己动手写一篇。

理解 Virtual DOM

使用过React的同学对于Virtual DOM并不陌生,作为React的重要核心概念,Virtual DOM凭借其高效的diff算法,让我们不用关心应用的性能问题,毫无顾忌地修改各种数据状态。在实际的开发中,我们并不需要关注Virtual DOM在一个框架中是如何运行的,但是理解Virtual DOM的实现原理却是非常有必要的,同时也有助于我们更加深入React。

使用Vue.js 2创建To-Do App

Vue是一个简而小的渐进式JavaScript框架,可用于增量地构建强大的Web应用程序。Vue是其他JavaScript框架(如AngularJS)的轻量级替代品。通过对HTML、CSS和JS的理解,你应该准备好与Vue一起运行。在本文中,我们将使用Vue构建一个To-Do的应用程序,同时突出显示它能提供的优秀特能和功能。

JavaScript数组所有API全解密

数组是一种非常重要的数据类型,它语法简单、灵活、高效。 在多数编程语言中,数组都充当着至关重要的角色,以至于很难想象没有数组的编程语言会是什么模样。特别是JavaScript,它天生的灵活性,又进一步发挥了数组的特长,丰富了数组的使用场景。可以毫不夸张地说,不深入地了解数组,不足以写JavaScript。截止ES7规范,数组共包含33个标准的API方法和一个非标准的API方法,使用场景和使用方案纷繁复杂,其中有不少浅坑、深坑、甚至神坑。下面将从Array构造器及ES6新特性开始,逐步帮助你掌握数组。

使用ES2017的异步函数

ES2017在6月份已经定稿,随之而来的是我最喜欢的JavaScript特性将得到广泛的支持:async函数。如果你以前使用JavaScript的异步函数遇到过困难,那这个就是为您准备的。如果你没有,那么,你可能是这方面的高手。

学习JavaScript ES 2017: padStart & padEnd

ES 2017推出padStartpadEnd。学习如何使用他们你可能在三分钟内就能掌握。这两个方法都可以接受两个参数,第一个参数是指定结果字符串的length,第二个参数是将要给指定字符串中添加的字符。他们都有可能会重复添加。两者不同的是,padStart()是从一个字符串的左边开始填充(前置),padEnd()是从一个字符串的右边开始填充(后置)。

数组函数有哪些,什么时候用?

很多时候你可能很纠结,你应该使用reduce更多或者你不应该使用filter,更应该使用map;或者是for,为什么不使用forEach?是不是太纠结了。事实上呢?数组和数组的迭代函数对于初学者来说都会感到困惑,所以我将试着为每个简化问题,最后提出的问题是:你想要返回什么?

ES6: 模板字符串

ES6中引入了模板字符串(Template Literal),是创建字符串的一种新方法。有了这个新特性,我们就能更好地控制动态字符串。这将告别长串连接字符串的日子。要创建一个模板字符串,我们可以使用反引号(撇号)字符替找单引号'"。这将产生一个新的字符串,我们可以以任何方式使用它。

ES6学习笔记:块级作用域绑定

过去,JavaScript的变量声明机制不像C语言一样,在声明变量的同时也会创建变量(绑定)。在以前的JavaScript中何时创建变量要看怎么声明变量。在以前的变量作用域有全局作用域和局部作用域,但不像其他的程序语言有块作用域一说。在ES6中新引入的块级作用域绑定机制。

页面

返回顶部