鸿蒙开发者社区

WOT技术大会

公众号矩阵

移动端

短视频免费课程课程排行直播课软考学堂

全部课程厂商认证 IT技术 24年11月软考 PMP项目管理免费题库

文章资源问答课堂专栏直播

51CTO

鸿蒙开发者社区

51CTO技术栈

51CTO官微

51CTO学堂

51CTO博客

CTO训练营

鸿蒙开发者社区订阅号

51CTO软考

51CTO学堂APP

51CTO学堂企业版APP

鸿蒙开发者社区视频号

51CTO软考题库

账号设置退出

前端

2.6w内容

关注

分享前端领域的前沿热点、技术实战、框架应用和使用案例，为开发者学习前端技术提供参考。

文章博文帖子课程

共 2.6w 条

函数式编程术语解析

一个纯函数需要满足两个条件，第一是函数的返回值只能由输入值(函数接收的参数)决定，也就是说纯函数接收相同的参数会返回相同的值；第二是纯函数不会对自身作用域之外的运环境产生副作用(side effects)。

2016-10-31 20:46:22

函数式编程 Javascript

Gracejs : 全新的基于koa2的前后端分离框架

Gracejs(又称:koa-grace v2) 是全新的基于koa v2.x的MVC+RESTful架构的前后端分离框架。Gracejs完美支持koa v2，同时做了优化虚拟host匹配和路由匹配的性能、还完善了部分测试用例等诸多升级。当然，如果你正在使用koa-grace也不用担心，我们会把Gracejs中除了支持koa2的性能和功能特性移植到koa-grace的相应中间件中。

2016-10-31 14:16:33

node 前后端分离 koa

使用React + Redux + React-router构建可扩展的前端应用

本文最初来源于笔者在 StuQ 的一次同名课程直播，现在加以整理成文，希望能对更多的人有所启发。为了固化这种实践方式，当时还开发了一个名为 Rekit 的工具，用于确保项目能够始终遵循这种实践方式。现在工具也获得进一步完善，大家也可以结合 Rekit 来理解文中提到的实践方案。

2016-10-31 11:26:13

React Redux 前端应用

Docker上开发nodejs

Docker 是一个开源项目，诞生于 2013 年初，最初是 dotCloud 公司内部的一个业余项目。它基于 Google 公司推出的 Go 语言实现。项目后来加入了 Linux 基金会，遵从了 Apache 2.0 协议，项目代码在 GitHub上进行维护。

2016-10-28 22:22:35

node node.js docker

JS属性特性（属性描述符）

ECMAScript 5 中定义了一个名叫“属性描述符”的对象，用于描述了的各种特征。“属性描述符”对象只能在Object.defineProperty或Object.defineProperties中使用。

2016-10-28 21:55:28

Javascript 属性特性属性描述符

《JavaScript 闯关记》之基本包装类型

为了便于操作基本类型值，JavaScript 还提供了3个特殊的引用类型：Boolean、Number 和 String。实际上，每当读取一个基本类型值的时候，后台就会创建一个对应的基本包装类型的对象，从而让我们能够调用一些方法来操作这些数据。

2016-10-28 21:13:33

JavaScript 基本包装类型

Cookie在前端中的实践

每个 Cookie 都有一定的属性，如什么时候失效，要发送到哪个域名，哪个路径等等。在设置任一个 Cookie 时都可以设置相关的这些属性，当然也可以不设置，这时会使用这些属性的默认值。

2016-10-28 15:01:35

Cookie 前端实践

多层级理解闭包

闭包：有一个函数处理之后返回另一个函数，且只能执行一次。闭包的理解是需要一个循序渐进的过程，下面我也会循序渐进从各个角度来阐述对闭包的不同理解，以便方便大家深度理解闭包。

2016-10-27 19:26:47

Javascript 闭包

利用pushState, popState和location.hash等方法自己实现一个小型路由

这篇文章主要是记录下HTML5中history提供的pushState, replaceStateAPI。最后通过这些API自己实现小型的路由。

2016-10-27 15:49:38

pjax 路由 Javascript

深入理解react（源码分析）

首先理解ReactElement和ReactClass的概念。想要更好的利用react的虚拟DOM，diff算法的优势，我们需要正确的优化、组织react页面。

2016-10-26 20:49:24

React Javascript 前端

Promise & Generator——幸福地用同步方法写异步JavaScript

最近在写一个自己的网站的时候（可以观摩一下~Colors），在无意识中用callback写了一段嵌套了5重回调函数的可怕的代码。回过神来的时候被自己吓了一跳，这可不行啊，丑得没法看啊！于是打算尝试一下一些流行的异步的解决方案。经过一番折腾之后...我终于找到了一个令自己满意的方案了（爱不释手）。

2016-10-25 16:04:49

Generator Promise JavaScript

miniui datagrid的客户端分页解决方案

首先，是绑定一个 preload 事件，在这个事情中设置 event.cancel = true，阻止 datagrid 在翻页的时候向服务器请求加载数据。那么数据从哪来呢？当然只有在外部写一个 ajax 过程获取了。不过取得的数据并不直接交给 datagrid，而是缓存起来，放在 dataResult 中。

2016-10-25 14:18:59

分页 javascript miniui

H5打造3d场景不完全攻略（二）: Amazing CSS3D

本文着重介绍如何使用CSS3中的3D变换打造出H5中的3D效果。灵感来源于造物节团队的3d引擎，因为使用方法比较复杂，也没有开源的API文档，于是想自己另外造个轮子，便开始了相关内容的学习和实践。

2016-10-25 14:02:51

全景 css3 css

JavaScript异步编程之jsdeferred原理解析

最近在看司徒正美的《JavaScript框架设计》，看到异步编程的那一章介绍了jsdeferred这个库，觉得很有意思，花了几天的时间研究了一下代码，在此做一下分享。异步编程是编写js的一个很重要的理念，特别是在处理复杂应用的时候，异步编程的技巧就至关重要。

2016-10-21 11:04:07

JavaScript 异步编程原理解析

深入研究：http2的真正性能到底如何

http2的概念提出已经有相当长一段时间了，而网上关于关于http2的文章也一搜一大把。但是从搜索的结果来看，现有的文章多是偏向于对http2的介绍，鲜有真正从数据上具体分析的。这篇文章正是出于填补这块空缺内容的目的，通过一系列的实验以及数据分析，对http2的性能进行深入研究。

2016-10-21 10:36:54

http2 spdy node.js

css中的有趣的border

CSS 中的 border 属性，我想凡是了解一点 CSS 的都知道它是作用，可以在 MDN 上找到对它的详细介绍。简单来说，就是我们常用的边框，一个非常基础的用法,当然还可以定义很多奇形怪状的边框类型，比如圆角(radius，可能兼容性不是很好)，椭圆(其实只要懂了椭圆，边框就可以随意绘制了)。

2016-10-21 10:15:53

这些废弃的HTML标签不要用

HTML 已经发展了多年，现在 W3C 已经发布了 HTML 5.1 的提案推荐标准，一些陈旧废弃的标签已经在后继的标准中逐渐消失。这里为大家列出那些已经被废弃 HTML 标签，看看你是不是还在使用它们。

2016-10-21 10:00:01

HTML 标签 WEB

CSS实现1px以内的移动

之前的文章说过关于行内元素垂直方向对齐的方案。感兴趣的可以看我的往期文章。在上一篇文章里我们提到了 1px 内的移动问题。本文就一像素内的问题给出解决方案。

2016-10-20 19:21:46

transform css3 css

JS中的事件冒泡与捕获

事件冒泡与捕获是 DOM 中事件传播的两种方式，比如说对于注册了相同事件的两个 DOM 元素(简单点就是两个 div，一里一外)，当点击里层 div 的时候，这两个事件谁先执行。冒泡事件，由里向外，最里层的元素先执行，然后冒泡到外层。捕获事件，由外向里，最外层的元素先执行，然后传递到内部。

2016-10-20 19:07:10

Javascript 事件冒泡与捕获

客户端数据存储----Cookie From 《高程3》

首先先来一段总结：Cookie用于本地数据存储，出现在服务器和浏览器交互的响应Set-Cookie头部和请求Cookie头部中，受到单域名下Cookie的数量、单个Cookie大小、性能、安全限制。子Cookie技术的出现缓解了单域名下Cookie的数量限制，关于子Cookie有一整套工具函数可以使用。

2016-10-20 16:11:39

Html Javascript

《每周一点canvas动画》——差分函数的妙用

这次我们不涉及canvas 3D的内容，主要分享一个比较炫的动画效果，可以算是上一篇文章《每周一点canvas动画》——3D点线与水波动画的加强版。动画效果来自codePen点击预览。在这篇文章中我们就分析这种效果是如何实现的。

2016-10-20 15:54:12

Canvas Html5 Javascript

Python的数据序列化「Json & Pickle」

数据序列化就是将对象或者数据结构转化成特定的格式，使其可在网络中传输，或者可存储在内存或者文件中。反序列化则是相反的操作，将对象从序列化数据中还原出来。

2016-10-20 15:54:08

Python 数据序列化

WebRTC中的三角形和梯形

如果浏览器想和一个SIP客户端(例如SIP电话)进行视频通话，首先要做的少就是从Web服务器下载带有WebRTC代码的网页程序，在浏览器端向Web服务器发起音频通话请求对象M，Web服务器把M发给SIP服务器，SIP服务器把请求M发给SIP客户端(例如SIP电话)。

2016-10-20 13:36:28

WebRTC 浏览器服务器

Vue2移动端开发环境搭建

本文给出基于 Vue2 的移动端环境搭建，移动端大家更多想到的是响应布局，我们根据不同大小的屏幕进行适配，当然少不了我们的重头戏 rem，移动端相比 pc 端就没什么特别的了。

2016-10-19 20:47:55

vue vue-cli 移动端

React Native填坑之旅--class（番外篇）

无论React还是RN都已经迈入了ES6的时代，甚至凭借Babel的支持都进入了ES7。ES6内容很多，本文主要讲解类相关的内容。

2016-10-19 19:03:18

javascript es6 React Nativ

CSS行内对齐的黑魔法

本文和以前的文章类似，orange 尽量带给大家分享实际项目中的坑怎么填，当然只是提供思想，方法很多欢迎讨论，还有就是对于刚上手前端的新人不是特别友好，没关系，涉及到基础知识我会对应的进行指引，给出链接或给出提示，大家可以自行 Google(百度)。

2016-10-19 15:15:26

CSS css3 inline-bloc

CSS中一些利用伪类、伪元素和相邻元素选择器的技巧

如果用JS实现，需要监听输入框的change和focus事件，比较麻烦。但是用CSS中的伪类就可以实现相近效果。CSS3中的伪类和伪元素非常多，其中一些如果用的巧妙，可以实现很多原本需要JS才可以实现的效果。

2016-10-19 14:54:46

css选择器 css3 css

JavaScript函数式真正的浅析

最近两年你要说函数式编程不火的话, 那是不可能的, 是人都知道函数式编程很火.为什么函数式编程会火呢, 在于它的思想, 很强大, 很强势!尤其是前端的redux更是在reducer上完全使用纯函数, 函数式的好处渐渐被发掘出来, 笔者最近看了一些函数式方面的东东, 现在发出来给大家学习学习, 顺便我也学习学习怎么写文章。

2016-10-19 14:35:20

JavaScript 函数式编程

理解并运用CSS的负margin值

你的网页中，不可能没有使用过 margin。大多数情况下，我们采用的都是正数的 margin 值，可能有时候会用到负的 margin 值。在我们的印象中，负的 margin 值就类似于浏览器的 hack 一样，不被人接受。但是，本文要说明的就是，负的 margin 值并不是 hack，这是正常范围内的写法。

2016-10-19 10:46:14

HTML5，不只是看上去很美（第四弹：可交互地铁线路图）

最近特别忙，承蒙大伙关照，3D机房的项目一个接着一个，领了一帮小弟，搞搞传帮带，乌飞兔走，转眼已经菊黄蟹肥……有个小弟很不错，勤奋好学，很快就把API都摸透了，国庆几天自己折腾着做了个HTML5的魔都的地铁线路图，能拖能拽的，还和电子地图做了交互。哥决定把小弟的成果纳入“HTML5，不只是看上去很美”系列，以示鼓励。

2016-10-19 09:17:15

HTML5 Javascript 可视化

关于HTTP推送的一些问题

使用 HTTP 推送，CSS 和 JS 会在 HTML 请求到达之后尽快推送出去，发送它们需要 3 个 RTT(又一次因为慢启动)，它们将拥塞窗口增大至 128 KB 左右，将要发送 HTML 时，一个 RTT 就能可以了。

2016-10-18 22:10:02

HTTP 推送 HTML

Semantic-UI的React实现（四）：基本元素组件的共通处理（父类）实现

上一篇（Semantic-UI的React实现（三）：基本元素组件）已经提到过，基本元素组件的实现因为没有复杂的交互，仅仅是CSS类的编辑和组装，因此实现原理相对比较简单。

2016-10-18 21:45:53

Semantic-UI React Javascript

DOM事件深入浅出（二）

在DOM事件深入浅出（一）中，我主要给大家讲解了不同DOM级别下的事件处理程序，同时介绍了事件冒泡和捕获的触发原理和方法。本文将继续介绍DOM事件中的知识点，主要侧重于DOM事件中Event对象的属性和方法。

2016-10-14 14:32:58

Javascript DOM Web

DOM事件深入浅出（一）

在项目开发时，我们时常需要考虑用户在使用产品时产生的各种各样的交互事件，比如鼠标点击事件、敲击键盘事件等。这样的事件行为都是前端DOM事件的组成部分，不同的DOM事件会有不同的触发条件和触发效果。本文就将带大家深入浅出地了解DOM事件的那些属性和方法。

2016-10-14 13:53:05

Javascript DOM Web

JavaScript数组中的indexOf方法

最近项目遇到一个小问题代码我会简化成小例子展示给大家。用心看到最后会有收获哈，基础扎实的童鞋可以直接跳到数组类型使用。说到 indexOf 大家并不陌生，判断字符串是否包涵子字符串时特别常用(正则不熟练同学的利器)。

2016-10-13 19:33:10

javascript 数组 indexOf

《JavaScript 闯关记》之函数

函数是一段代码，它只定义一次，但可以被执行或调用任意次。在 JavaScript 里，函数即对象，程序可以随意操控它们。比如，可以把函数赋值给变量，或者作为参数传递给其他函数，也可以给它们设置属性，甚至调用它们的方法。如果函数挂载在一个对象上，作为对象的一个属性，就称它为对象的方法。

2016-10-13 19:11:27

JavaScript 函数 Web

WebP支持：超乎你想象

WebP 是 Google 发明的更小的替代 JPEG 和 PNG 的格式。最近有很多关于 WebP 支持的疑惑，细说来就是可以用它做什么，不能做什么，比如说浏览器支持，CMS 支持等等。今天我想清除你所有可能的疑虑。WebP 的支持程度实际上比你想的可能要好得多。

2016-10-13 13:43:04

WebP Google JPEG和PNG格式

JavaScript arguments对象全面介绍

arguments是一个类数组对象。代表传给一个function的参数列表。我们先用一个例子直观了解下 JavaScript 中的 arguments长什么样子。

2016-10-12 11:08:16

JavaScript arguments 数组

JavaScript中this绑定详解

this 可以说是 javascript 中最耐人寻味的一个特性，就像高中英语里各种时态，比如被动时态，过去时，现在时，过去进行时一样，无论弄错过多少次，下一次依然可能弄错。本文启发于《你不知道的JavaScript上卷》,对 javasript 中的 this 进行一个总结。

2016-10-11 20:33:17

JavaScript This Web

目前，我们有很多方案可以快速的接触到 WebGL 并绘制复杂的图形，但最后发现我们忽视了很多细节性的东西。当然，这对初学 WebGL 是有必要的，它能迅速提起我们对 WebGL 的学习兴趣。当学习到更加深入的阶段时，我们更想了解 WebGL 的工作机制，这也将对我们编程有极大的帮助。

2016-10-11 13:48:41

WebGL Javascript Web

函数式TypeScript

谈到函数式编程时，我们常提到机制、方法，而不是核心原则。函数式编程不是关于 Monad、Monoid 和 Zipper 这些概念的，虽然它们确实很有用。从根本上来说，函数式编程就是关于如使用通用的可复用函数进行组合编程。本文是我在重构 TypeScript 代码时使用函数式的一些思考的结果。

2016-10-11 13:32:50

函数式 TypeScript Javascript

jointJS(一）--关于jointJS的初认识

我们可以使用JointJS已提供的图元素绘图，也可根据需求自定义一些图元素。除此之外，JointJS创建的图表就是SVG图形，想改变图形样式，就去GoogleSVG相关语法就好啦。另外，它极易上手且操作简单，并且支持所有的现代浏览器。

2016-10-09 11:55:09

Javascript jointJS Web

模块化你的JS代码

因为在全局作用域中声明的变量和函数都自动成为全局对象Window的属性，这经常会导致命名冲突，还会导致一些非常重要的可维护性难题，全局变量越多，引入错误BUG的概率就越大！所以我们应当尽可能少地使用全局变量，模块化的目的之一就是为了解决该问题的！

2016-10-09 11:03:41

Javascript 模块化 Web

数百个HTML5例子学习HT图形组件 – 3D建模篇

《数百个 HTML5 例子学习 HT 图形组件 – WebGL 3D 篇》里提到 HT 很多情况下不需要借助 3Ds Max 和 Blender 等专业 3D 建模工具也能做出很多效果。

2016-10-09 09:57:41

Html5 拓扑图 3D

Javascript单例模式概念与实例

和其他编程语言一样，Javascript同样拥有着很多种设计模式，比如单例模式、代理模式、观察者模式等，熟练运用Javascript的设计模式可以使我们的代码逻辑更加清晰，并且更加易于维护和重构。本文将介绍Javascript模式中较为常见和实用的模式——单例模式，主要分为概念和实例部分。在介绍实例的同时也会对代码中额外的知识点进行讲解。

2016-10-09 09:37:49

javascript 单例模式

JavaScript浏览器事件解析

JavaScript 程序采用了异步事件驱动编程（Event-driven programming）模型，维基百科对它的解释是：事件驱动程序设计（英语：Event-driven programming）是一种电脑程序设计模型。这种模型的程序运行流程是由用户的动作（如鼠标的按键，键盘的按键动作）或者是由其他程序的消息来决定的。

2016-10-09 08:38:01

JavaScript 浏览器事件

温故js系列（16）-数组&数组方法使用详解

之前一直在温故js系列，希望能够知新，不过最近应业务要求，在做移动WEB，需求大，任务多。所以，只有像现在闲着的时候才能继续温故js了。在 JavaScript 中 Array 是一个用来构造数组的全局对象，它是一个高阶的类似有序列表的对象，是JavaScript内置对象里非常重要的一个。

2016-10-08 21:25:36

Javascript 数组 Web

400% 的飞跃－web 页面加载速度优化实战

正常来讲一个网页 4s 加载不完就会流失很大一部分用户，而博主的网站加载时间竟然达到了 8s 还是在电脑端，如果在移动端，加载时间会更久，体验会更差。这样的话网站做得再难看批判者进不来不是白搭嘛，于是针对 web 页面加载速度的优化迫在眉睫。基于博主以前优化过其他网站，于是博主准备把这次的优化过程记录下来分享给大家借鉴。

2016-09-30 13:11:31

前端后端网页速度

[译] 函数式TypeScript

谈到函数式编程时，我们常提到机制、方法，而不是核心原则。函数式编程不是关于 Monad、Monoid 和 Zipper 这些概念的，虽然它们确实很有用。从根本上来说，函数式编程就是关于如使用通用的可复用函数进行组合编程。本文是我在重构 TypeScript 代码时使用函数式的一些思考的结果。

2016-09-30 09:43:17

Javascript TypeScript 函数式编程

一个小时快速搭建微信小程序

这个划时代的产品发布快一周了，互联网技术人都在摩拳擦掌，跃跃欲试。可是小程序目前还在内测，首批只发放了 200 个内测资格（泪流满面）。本以为没有 AppID 这个月就与小程序无缘了，庆幸的是微信这两天发布了正式版开发者工具，无需内测邀请也可以尝鲜了。

2016-09-30 09:22:55

Javascript Html5 Web

上一页 1 ··· 389 390 391 392 393 ··· 523 下一页

51CTO技术栈公众号

业务
速览

媒体

51CTO CIOAge HC3i

社区

51CTO博客鸿蒙开发者社区 AI.x社区

教育

51CTO学堂精培企业培训 CTO训练营