- 博客(418)
- 收藏
- 关注
RSS订阅转载 判断浏览器（微信、微博、QQ）、操作系统、横竖屏等
一、根据浏览器判断URL跳转var browserOfMobile = { wapUrl: 'http://m.baidu.com', versions:function(){ var u = navigator.userAgent; return { //mobile: !!u.match(/AppleWebKit....
2018-03-08 14:54:07
1519
原创 LeetCode -- 515、654 题解
515：Find Largest Value in Each Tree Row/** * Definition for a binary tree node. * function TreeNode(val) { * this.val = val; * this.left = this.right = null; * } *//** * @param {Tree...
2018-03-04 23:47:49
807
翻译 几个有趣的 JS 特性
标记语句foo: { console.log('one'); break foo; console.log('这句打印不会被执行');}console.log('two');/* * # 输出 * one * two */另外，标记也可以给 for 循环命名。“void” 运算符这个运算符其实早就存在了，所有的浏览器都支持！ void 运算符...
2018-02-23 16:09:55
1122
翻译 Python & 区块链
一个完整的区块栗子每个区块都有其索引，时间戳（Unix 时间），交易列表，证明 proof（稍后解释），以及前序区块的哈希值。block = { 'index': 1, 'timestamp': 1506057125.900785, 'transactions': [ { 'sender': "8527147fe1f542...
2018-02-23 15:29:04
953
原创 ES2017 （ES8）
本文主要讲解 ES8 ( ES2017 ) 新增的几个常用功能、特性字符串填充，两个新函数：padStart 和 padEndpadStart 和 padEnd 一共接受两个参数 第一个参数用来指定结果字符串的最小长度，第二个参数是指用来补全的字符串。 注意：如果第一个参数的值小于或等于原字符串的长度，则返回原字符串。如果省略第二个参数，默认使用空格补全长度。几个栗子：
2018-02-05 17:11:48
680
翻译 Parcel -- 快速的 Web 打包工具
特点零配置：当 webpack 以高复杂性的代价给我们带来了很多配置的时候 —— Parcel 却很简单。它号称“零配置”。开箱即用的代码拆分，热模块更新，css预处理，开发服务器，缓存等等！快速打包：Parcel 比 Webpack，Rollup 和 Browserify 打包更快。支持 JS，CSS，HTML，文件资源等 —— 无需插件 —— 对用户更加友好更友好的错误日志。
2018-01-25 17:42:37
522
翻译 Parcel 实现代码分割 -- 初识 Parcel
代码分割使用 JavaScript 进行前端开发，如果不进行代码分割，最后会打包成一个很大的 JS 文件。大文件的下载时间就会比较长，而用户有可能并不需要一次性加载所有的功能，完全没有必要下载这么大的文件。所以，很有必要将较大的 JS 包拆分成多个更小的包，也就是代码分割。这些小包可以按需或一步加载。之前我们使用 webpack 就能做到，parcel 使用起来则更加简单。Parcel
2018-01-25 16:43:31
800
转载 RxJS
第一个栗子var button = document.querySelector('button');button.addEventListener('click', () => console.log('Clicked!'));// With RxJSvar button = document.querySelector('button');Rx.Observable.from
2018-01-19 13:58:04
367
转载 一种 reducer state 的写法
import {Map, List} from 'immutable';export default (state = Map(), action) => { if (action.type === 'jenkins_list') { return state.set('jobs', List(action.list)); } if (action.type === '
2018-01-18 16:56:57
1127
原创 React-Router 高级用法
使用对象而非 JSX 来配置路由曾经的写法：Router> Route path="/" component={App}> IndexRoute component={Dashboard} /> Route path="about" component={About} /> Route path="inbox" component={Inbox}>
2018-01-18 16:45:20
4902
转载 requestAnimationFrame
requestAnimationFrame是浏览器用于定时循环操作的一个接口，类似于setTimeout，主要用途是按帧对网页进行重绘。设置这个API的目的是为了让各种网页动画效果（DOM动画、Canvas动画、SVG动画、WebGL动画）能够有一个统一的刷新机制，从而节省系统资源，提高系统性能，改善视觉效果。代码中使用这个API，就是告诉浏览器希望执行一个动画，让浏览器在下一个动画帧安排一次
2018-01-18 14:35:37
849
翻译 【翻译&摘抄】CSS 特征查询
CSS 中的 @supports 规则，也被称为 Feature Queries（特征查询），是一个很强大的工具。通过使用 @supports，你可以在 CSS 中看是否支持某个“特性”（CSS 属性或值），并根据其返回的结果决定是否调用代码块。例如：@supports (display: grid) { // 只有在浏览器支持 CSS 网格时才会运行代码}如果浏览器支持 d
2018-01-17 18:06:45
369
翻译 [翻译&摘抄] 在大型应用中使用 Redux 的五个技巧
Redux，用于管理应用程序状态，它的特点包括： 1、单向数据流 2、不可变数据 3、状态变化由 action 触发，导致 reducer 函数返回一个新状态以下的几点讨论应该可以帮助到任何在大型、数据密集型应用中使用 Redux 的开发者：第一点: 在存储和访问状态时使用索引和选择器 第二点: 把数据对象，对数据对象的修改以及其它 UI 状态区分开 第三点: 在单页应用的不同页
2018-01-17 16:11:51
351
翻译 [翻译&摘抄] ES6 中的元编程：代理（Proxies）
前面几篇博客已经写过了有关 Symbols 和 Reflect 相关的知识，首先来重复看一下：元编程是什么：元编程（笼统地说）是所有关于一门语言的底层机制，而不是数据建模或者业务逻辑那些高级抽象。如果程序可以被描述为 “制作程序”，元编程就能被描述为 “让程序来制作程序”。例如，反射就是元编程中非常酷的一部分，因为它允许你改变应用程序的内部工作机制。Symbols 是实现了的反射（Refl
2018-01-16 14:45:04
448
翻译 【翻译&摘抄】React 应用性能调优
compression页面加载一个很大的瓶颈就是 JS bundle 提及太大，下载它话费了很多时间。我们应该使用 Gzip 来压缩一下：通过 Node/Express 的服务端很容易实现 Gzip；只需要安装 compression 模块并将它作为一个 Express 中间件使用就可以了。const express = require('express');const compre
2018-01-15 17:51:29
380
翻译 [翻译&摘抄] Node.js v6 LTS 中几个 ES6 特性
原文地址：6 of the Most Exciting ES6 Features in Node.js v6 LTS 原文作者：Tierney Coren给函数设置默认参数function testDefault(value, test = 2) { // 内部代码略}testDefault(1) // test 默认设置为 2用解构的方式提取数组和对象的数据
2018-01-11 21:13:05
348
翻译 [翻译&摘抄] 在 Chrome 开发者工具中调试 Node.js
原文链接 : Debugging Node.js in Chrome DevToolsdevtool命令行工具 DevTool 可以让你在 Chrome 的开发者工具中运行 Node.js 程序。安装方法超简单啦，命令行运行npm install -g devtool即可完成安装，再运行：devtool将启动一个带有 Node.js 特性支持的 Chrome 开
2018-01-11 17:33:09
471
翻译 [翻译&摘抄]ES6 中的元编程：Reflect
原文地址：Metaprogramming in ES6: Part 2 - Reflect 原文作者：Keith Cirkel 译文出自：掘金翻译计划 转自：https://juejin.im/post/5a0e66386fb9a04523417418 作者：吴晓军 译者：yoyoyohamapi 校对者：IridescentMia ParadeToReflect 是通过自省（intro
2018-01-04 14:44:36
427
翻译 [翻译&摘抄]ES6 中的元编程：Symbol
原文地址：Metaprogramming in ES6: Symbols and why they’re awesome 原文作者：Keith Cirkel 译文出自：掘金翻译计划 转自：https://juejin.im/post/5a0e65c1f265da430702d6b9 译者：yoyoyohamapi 校对者：Usey95 IridescentMia什么是元编程元编程（笼统地说
2018-01-03 20:22:40
538
翻译 【译文&摘抄】ECMAScript 6 里面的私有变量
原文链接 : Private members in ES6 classes 本文已获得原作者Greg Reimer的授权 译文出自 : 掘金翻译计划 转自：https://juejin.im/entry/572c0b2d2e958a00667a081d?utm_source=gold-miner&utm_medium=readme&utm_campaign=github 译者 : XRene
2018-01-03 15:58:58
330
翻译 [翻译&摘抄] React 未来之函数式 setState
原文地址：Functional setState is the future of React 原文作者：Justice Mba 译文出自：掘金翻译计划 原文链接：https://juejin.im/post/58cfcf6e44d9040068478fc6/ 译者：reid3290 校对者：sunui，imink温故知新1、React 是一个基于组件的 UI 库，组件基本上可以看作是一个
2018-01-03 13:47:18
685
翻译 [译文&摘抄] 前端 Console 调试小技巧
原文地址：How to debug Front-end: Console 原文作者：Michał Witkowski 译文出自：掘金翻译计划 转自：https://juejin.im/post/5a08087f6fb9a04529363d71 译者：lsvih 校对者：Raoul1996ConsoleConsole.log不说了Console.assert(expression, mess
2018-01-02 17:22:47
560
翻译 [译文&摘抄]在 React & Redux 中使用 AJAX 轮询
原文地址：AJAX POLLING IN REACT WITH REDUX 原文作者：Josh M 译文出自：掘金翻译计划 转自：https://juejin.im/post/5a43b6da5188257d167a7aef 译者：刘嘉一 校对者：yoyoyohamapi，FateZeros目标：把一些有时序依赖的状态从服务端同步到客户端方式：结合 React 组件的生命周期方法、 Red
2018-01-02 16:32:22
2209
翻译 【译文&摘抄】Angular、React、Vue的2017
原文地址：https://medium.com/unicorn-supplies/angular-vs-react-vs-vue-a-2017-comparison-c5c52d620176 作者：Jens NeuhausWeb 三剑客：Angular、React、Vue一些历史：Angular：源自 Google，是基于 TypeScript 的 Javascript 框架。被描述为：“超级厉害
2017-12-29 23:12:46
371
原创 JavaScript -- ES6 迭代器和生成器
使用迭代器的目的：更高效的操作数据。使用迭代器可以使访问数据和操作数据的过程中，不需要追踪索引。传统的for循环：for (let I=0; I<10; I++){ ... // 访问数据的过程中，需要追踪索引 i 的值。并不方便且容易出错。}学习了迭代器后，就会发现数据访问会变的简洁很多。什么是迭代器迭代器是一种特殊的对象，所有的迭代器对象都有一个 next 方法，调用 next
2017-12-15 11:47:32
339
原创 JS & ES6 -- 语法糖：类
类的声明举个栗子：class Cat{ constructor(name){ this.name = name // 这是私有属性 } eatFish() { // 不需要 function 关键字 console.log('MiaoMiao') }}需要说明的是，类的声明仅仅是个语法糖而已，尝到了甜头就不好戒的那种。233使用ES6的
2017-12-12 21:59:36
1211
原创 异步JS -- 异步控制台解惑
在使用console的时候有时候会有这样的疑惑： 使用console打印出的结果和使用debugger看到的结果并不一样？！ What a f*ck? 今天，原因终于找到～因为，（划重点）： 并没有什么规范或者一组需求指定console.*方法簇如何工作——它们并不是JS正式的一部分，而是由宿主环境添加到JS中的。因此，不同的浏览器和JS环境可以按照自己的意愿来实现，这样有时候就会引起混淆。
2017-12-12 16:48:35
401
原创 JS -- Immutable.js & React & Redux
乱入的DockerDocker是一个开源工具，能将一个WEB应用封装在一个轻量级，便携且独立的容器里，然后可以运行在几乎任何服务环境下。Docker的容器能使应用跑在任何服务器上并且表现一致。一个开发者在笔记本上建立的一个容器，能跑在很多环境下，如：测试环境，生产环境，虚拟机上，VPS，OpenStack集群，公用的电脑等等。Docker的一般使用在以下几点： 1 自动化打包和部署应用 2 创造
2017-11-15 17:26:36
430
原创 JS复习 -- 递归
两个很常见的递归函数：// 阶乘function factorial(n) { if (n == 1) return n; return n * factorial(n - 1)}console.log(factorial(5)) // 5 * 4 * 3 * 2 * 1 = 120// 斐波那契数列function fibonacci(n){ return n < 2
2017-11-01 11:56:11
373
原创 JS -- 函数组合
什么是函数组合？就是将需要嵌套执行的函数平铺。嵌套执行指的是，一个函数的返回值将作为另一个函数的参数。一个简单的栗子：var compose = function(f,g) { return function(x) { return f(g(x)); };};这个函数可以完成两个函数的嵌套转平铺。那么如果是支持多个参数的呢？也就是说，后一个函数的返回值总是作为前一个
2017-10-31 21:42:51
1097
翻译 JS 如何判断两个对象相等
前提条件： 1、NaN 和 NaN 相等 2、[1, 2] 和 [1, 2] 相等 3、{value: 1} 和 {value: 1} 相等 4、1 和 new Number(1) 相等 5、’Curly’ 和 new String(‘Curly’) 相等 6、true 和 new Boolean(true) 相等下面我们来一步一步的讨论+0 & -0在很多情况下，+0 -0
2017-10-30 21:12:39
8133
原创 JS复习 -- 作用域链
作用域链属于执行上下文的属性之一。咦？你问我执行上下文是什么： 当JS代码执行一段可执行代码的时候，就会创建对应的可执行上下文。每个执行上下文都有三个重要属性： 1、变量对象 2、作用域链（后面我们就会了解，作用域链其实就是变量对象组成的链） 3、this好了，言归正传了。当js执行过程中，需要查找一个变量的时候，会先从当前上下文的变量对象中查找。但是如果没找到，就会从词法层面上（一定注意这
2017-10-30 16:51:08
431
原创 JS复习 -- 类型判断
typeof注意，虽然我们可以写：console.log(typeof('miao~')) // string但是，typeof却是一个运算符，就像加减一样！它的真实身份是一个一元操作符。因此，人家的正经写法是：console.log(typeof 'miao~') // string当我们使用typeof来判断JS的六种基本数据类型的时候，返回的值分别是：Undefined -- undefine
2017-10-29 10:12:30
880
原创 JS复习 -- 函数柯里化
柯里化，该词来源于英文单词Currying，感觉是好深奥的一个词。 我记住它的方式是：柯里化 –> 颗粒化。也就是将使用多个参数的函数转化成一系列使用一个参数的函数的方法。颗粒化嘛。例子：function add(a, b) { return a + b;}// 执行 add 函数，一次传入两个参数即可add(1, 2) // 3// 假设有一个 curry 函数可以做到柯里化var
2017-10-28 10:39:03
755
原创 JS复习 -- 执行上下文栈
思考题：下面两段代码有何不同：var scope = "global scope";function checkscope(){ var scope = "local scope"; function f(){ return scope; } return f();}checkscope();var scope = "global scope";
2017-10-27 16:02:51
402
原创 JS 防抖
没有防抖：var count = 1;var container = document.getElementById('container');function getUserAction() { container.innerHTML = count++;};container.onmousemove = getUserAction;此时，鼠标移动，getUserAction方法就会频
2017-10-27 11:05:06
610
原创 Mongoose populate方法
最近好忙啊，好久没有来写博客了～ 干巴蝶！ 还是那句话，写一遍真的比看一遍要好很多！populate方法提供外键填充的功能。由于Mongoose是极具JavaScript特点的程序库，提供了极其简单和强大的填充功能，因此，populate不止可以填充单个文档，也支持多文档，甚至直接填充对象！外键引用在定义Schema字段时，可以添加ref属性来指向另一个Schema。 该ref属性在此后被填充（
2017-10-26 16:20:34
1667
翻译 Mongoose -- Schemas Models Documents
SchemasMongoose中，所有的东西都由Schemas开始。schema相当于是MongoDB的collection，并且定义了文档的结构。var mongoose = require('mongoose');var Schema = mongoose.Schema;var blogSchema = new Schema({ title: String, author: Stri
2017-09-05 18:35:44
487
翻译 Mongoose -- quick start
使用mongoose之前，首先要确保你的电脑安装了MongoDB和Node。安装MongoDB的教程可见： http://www.jianshu.com/p/1bb663918cfd然后，我们可以用npm指令来安装mongoose:$ npm install mongoose接下来，我们就可以使用mongoose来连接MongoDB了，连接方法如下：// getting-started.jsva
2017-09-05 15:15:14
390
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人