JavaScript

从零学习React技术栈: npm的安装配置和React开发环境配置

工欲善其事,必先利其器。在正式学习 React 技术栈之前,我们先来介绍一下之后经常要使用到的 npmnpm 是一个基于 Nodejs 的 JavaScript 包管理工具,全称叫做 Node Package Manager,所谓的包呢,其实就是可复用的代码,每个人都可以把自己编写的代码库发布到 npm 的源(英文叫做 registry)上面进行管理,你也可以下载别人开发好的包,在你自己的应用当中使用。

React.js小书:基本环境安装

React.js 单独使用基本上是不可能的事情。不要指望着类似于 jQuery 下载放到 <head /> 标签就开始使用。使用 React.js 不管在开发阶段生产阶段都需要一堆工具和库辅助,编译阶段你需要借助 Babel;需要 Redux 等第三方的状态管理工具来组织代码;如果你要写单页面应用那么你需要 React-router。这就是所谓的“React.js全家桶”。

浅谈前端状态管理

近两年前端技术的发展如火如荼,大量的前端项目都在使用或转向 Vue 和 React 的阵营,由前端渲染页面的单页应用占比也越来越高,这就代表前端工作的复杂度也在直线上升,前端页面上展示的信息越来越多也越来越复杂。我们知道,任何状态都需要进行管理,那么今天我们来聊聊前端状态管理。

Web前端的状态管理

我相信很多朋友跟我一样,初次听到什么Flux, ReduxVuex,状态管理的时候是一脸懵逼的。因为在外面之前前端大部分开发的时候,根本没有那么多的概念。自从ReactJS火爆后,什么Flux, Redux,React全家桶是一套一套接踵而来。搞的很多开发者甚是头大。所谓的ReactJS全家桶即ReactJS + Redux + Webpack,当然其中的Redux可以用其他例如Mobx之类的替换。原本可能只是很简单的一些数据展示需求,当想用尝试使用ReactJS时,去Google搜索了一些教程,突然发现怎么用个React需要这么多东西。正如今年比较有名的一篇文章里面描述的那样 — ”在2016年学习前端是怎样一种体验"。

如何遍历JavaScript中对象属性

在2016年6月发布的ECMAScript 2016的同一时期,令JavaScript开发人员开心的是知道另一组很棒的提案已经达到了第4阶段(完成)。当然,你不必等到ES2017发布,或者直到供应商(浏览器)实现了新功能!Babel已经包含了这些已完成的提案中的大部分特性。本文主要讨论如何改进对象属性的迭代:使用Object.values()获取对象属性和 使用Object.entries()获取属性key/value。乍一看,这些静态函数似乎并没有带来显著的价值。但是当它们与for...of循环配合使用,你会得到一种简而美的遍历对象的属性的方式。

让我们一探究竟吧。

JavaScript 核心概念之作用域和闭包

相信大家已经阅读了很多关于作用域和闭包文章,我也一样。作用域和闭包是 JavaScript 中的关键概念之一。当我阅读了《高性能的JavaScript》这本书后,我才完全理解这两个概念。所以今天强烈推荐这本书中的解释,并与其他开发人员分享。

JavaScript中的作用域和闭包

作用域和闭包在JavaScript中是两个很重要的概念。刚开始接触的时候,他们一直让我感到非常的困惑。下面是对作用域和闭名解释,以帮助你能更好的了解它们是什么?先从作用域开始。

理解JavaScript中的作用域

JavaScript有一个名为scope的特性。尽管对于许多新开发人员来说,scope的概念并不是那么容易理解,但我还是会尽我最大的努力,用最简单的内容向你们阐述scope。理解scope将使你的代码脱颖而出,减少错误,并帮助您使用它做出强大的设计模式。

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

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

Virtual DOM 的内部工作原理

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

页面

返回顶部