<?xml version="1.0" encoding="utf-8" ?><rss version="2.0"><channel><title><![CDATA[xixi]]></title><description><![CDATA[]]></description><link>https://blog.youkuaiyun.com/u013055396</link><language>zh-cn</language><generator>https://blog.youkuaiyun.com/</generator><copyright><![CDATA[Copyright &copy; u013055396]]></copyright><item><title><![CDATA[前端工具之 souce map]]></title><link>https://blog.youkuaiyun.com/u013055396/article/details/79783097</link><guid>https://blog.youkuaiyun.com/u013055396/article/details/79783097</guid><author>u013055396</author><pubDate>Sun, 01 Apr 2018 22:51:07 +0800</pubDate><description><![CDATA[1、简介

一个最简单的优化网站方法就是合并、压缩 JS 和 CSS 文件。但是如果需要在这些压缩后的文件中进行调试，这个时候实际运行的代码不同于开发代码， 
debug 会变得很困难，这就是 Source Map 想要解决的问题。



2、什么是 Source Map

Source Map 提供了一个映射压缩文件到原文件初始位置的方法。这就意味着，使用浏览器或者其他软件可以轻松调试文件，即使...]]></description><category></category></item><item><title><![CDATA[ES6 之 Decorator]]></title><link>https://blog.youkuaiyun.com/u013055396/article/details/79780257</link><guid>https://blog.youkuaiyun.com/u013055396/article/details/79780257</guid><author>u013055396</author><pubDate>Sun, 01 Apr 2018 18:23:54 +0800</pubDate><description><![CDATA[1、简介

许多面向对象的语言都有修饰器（Decorator）函数，用来修改类的行为。目前，有一个提案将这项功能，引入了 ECMAScript。



// @testable 就是一个修饰器，修改了 MyTestableClass 这个类的行为，为它加上了静态属性 isTestable
@testable
class MyTestableClass {
  // ...
}
function t...]]></description><category></category></item><item><title><![CDATA[Node 之事件循环机制]]></title><link>https://blog.youkuaiyun.com/u013055396/article/details/79689706</link><guid>https://blog.youkuaiyun.com/u013055396/article/details/79689706</guid><author>u013055396</author><pubDate>Sun, 25 Mar 2018 19:37:19 +0800</pubDate><description><![CDATA[1、简介

我们都知道 JavaScript 是单线程运行，异步操作特别重要。只要用到引擎之外的功能，就需要跟外部交互，从而形成异步操作。Node 的异步语法比浏览器 
更复杂，因为它可以跟内核对话，不得不搞了一个专门的库 libuv 做这件事。这个库负责各种回调函数的执行时间，毕竟异步任务最后还是要回到主线程，一 
个个排队执行，这就是事件循环。



2、定时器

为了协调异步任务，Node ...]]></description><category></category></item><item><title><![CDATA[ES6 之 Set&Map]]></title><link>https://blog.youkuaiyun.com/u013055396/article/details/79683097</link><guid>https://blog.youkuaiyun.com/u013055396/article/details/79683097</guid><author>u013055396</author><pubDate>Sat, 24 Mar 2018 23:56:43 +0800</pubDate><description><![CDATA[1、简介

ES6 引入了新的数据结构 Set、WeakSet、Map 以及 WeakMap。



2、Set

ES6 提供了新的数据结构 Set。它类似于数组，但是成员的值都是唯一的，没有重复的值。



// Set 本身是一个构造函数，用来生成 Set 数据结构
const s = new Set();
[2, 3, 5, 4, 5, 2, 2].forEach(x =&amp;gt; s.ad...]]></description><category></category></item><item><title><![CDATA[ES6 之 Symbol]]></title><link>https://blog.youkuaiyun.com/u013055396/article/details/79657826</link><guid>https://blog.youkuaiyun.com/u013055396/article/details/79657826</guid><author>u013055396</author><pubDate>Thu, 22 Mar 2018 18:12:19 +0800</pubDate><description><![CDATA[1、简介

ES5 的对象属性名都是字符串，这容易造成属性名的冲突。比如，你使用了一个他人提供的对象，但又想为这个对象添加新的方法（mixin 模式），新方法的名 
字就有可能与现有方法产生冲突。如果有一种机制，保证每个属性的名字都是独一无二的就好了，这样就从根本上防止属性名的冲突。这就是 ES6 引入 Symbol 
的原因。ES6 引入了一种新的原始数据类型 Symbol，表示独一无二的值。它...]]></description><category></category></item><item><title><![CDATA[ES6 之 class 继承]]></title><link>https://blog.youkuaiyun.com/u013055396/article/details/79529736</link><guid>https://blog.youkuaiyun.com/u013055396/article/details/79529736</guid><author>u013055396</author><pubDate>Mon, 12 Mar 2018 17:05:50 +0800</pubDate><description><![CDATA[1、简介

Class 可以通过 extends 关键字实现继承，这比 ES5 的通过修改原型链实现继承，要清晰和方便很多。



// 通过 extends 关键字继承了 Point 类的所有属性和方法。但是由于没有部署任何代码，所以这两个类完全一样，等于复制了一个 Point 类
class Point {
}
class ColorPoint extends Point {
}

// co...]]></description><category></category></item><item><title><![CDATA[ES6 之 class]]></title><link>https://blog.youkuaiyun.com/u013055396/article/details/79524425</link><guid>https://blog.youkuaiyun.com/u013055396/article/details/79524425</guid><author>u013055396</author><pubDate>Mon, 12 Mar 2018 11:15:47 +0800</pubDate><description><![CDATA[1、简介

JavaScript 语言中，生成实例对象的传统方法是通过构造函数。这种写法跟传统的面向对象语言（比如 C++ 和 Java）差异很大，很容易让新学习这门语言 
的程序员感到困惑。ES6 提供了更接近传统语言的写法，引入了 Class（类）这个概念，作为对象的模板，通过 class 关键字可以定义类。基本上，ES6 的 
class 可以看作只是一个语法糖，它的绝大部分功能，ES5 都...]]></description><category></category></item><item><title><![CDATA[ES6 之 Generator 异步应用]]></title><link>https://blog.youkuaiyun.com/u013055396/article/details/79493836</link><guid>https://blog.youkuaiyun.com/u013055396/article/details/79493836</guid><author>u013055396</author><pubDate>Fri, 09 Mar 2018 10:21:25 +0800</pubDate><description><![CDATA[1、简介

异步编程对 JavaScript 语言太重要。Javascript 语言的执行环境是 “单线程” 的，如果没有异步编程，根本没法用，非卡死不可。现在主要介绍 Generator 函数如何完成异步操作。



// 异步编程：回调函数
fs.readFile('/etc/passwd', 'utf-8', function (err, data) {
  if (err) throw e...]]></description><category></category></item><item><title><![CDATA[ES6 之 async]]></title><link>https://blog.youkuaiyun.com/u013055396/article/details/79485975</link><guid>https://blog.youkuaiyun.com/u013055396/article/details/79485975</guid><author>u013055396</author><pubDate>Thu, 08 Mar 2018 16:13:33 +0800</pubDate><description><![CDATA[1、简介

ES2017 标准引入了 async 函数，使得异步操作变得更加方便。async 函数是什么？一句话，它就是 Generator 函数的语法糖。



const fs = require('fs');

const readFile = function (fileName) {
  return new Promise(function (resolve, reject) {
  ...]]></description><category></category></item><item><title><![CDATA[ES6 之 Generator]]></title><link>https://blog.youkuaiyun.com/u013055396/article/details/79479562</link><guid>https://blog.youkuaiyun.com/u013055396/article/details/79479562</guid><author>u013055396</author><pubDate>Thu, 08 Mar 2018 09:14:19 +0800</pubDate><description><![CDATA[1、简介

Generator 函数是 ES6 提供的一种异步编程解决方案，语法行为与传统函数完全不同。Generator 函数有多种理解角度，首先可以理解成 Generator 函 
数是一个状态机，封装了多个内部状态。执行 Generator 函数会返回一个遍历器对象，也就是说，Generator 函数除了状态机，还是一个遍历器对象生成函 
数。返回的遍历器对象，可以依次遍历 Generato...]]></description><category></category></item><item><title><![CDATA[ES6 之 Iterator]]></title><link>https://blog.youkuaiyun.com/u013055396/article/details/79461464</link><guid>https://blog.youkuaiyun.com/u013055396/article/details/79461464</guid><author>u013055396</author><pubDate>Tue, 06 Mar 2018 17:41:10 +0800</pubDate><description><![CDATA[1、简介

JavaScript 有四种表示 “集合” 数据集合：Array、Object、Map 以及 Set，用户可以组合使用它们，定义自己的数据结构，比如数组的成员是Map，Map 
的成员是对象。这样就需要一种统一的接口机制，来处理所有不同的数据结构。遍历器（Iterator）就是这样一种机制，它是一种接口，为各种不同的数据结构 
提供统一的访问机制。任何数据结构只要部署 Iterator...]]></description><category></category></item><item><title><![CDATA[ES6 之 module 加载]]></title><link>https://blog.youkuaiyun.com/u013055396/article/details/79436523</link><guid>https://blog.youkuaiyun.com/u013055396/article/details/79436523</guid><author>u013055396</author><pubDate>Sun, 04 Mar 2018 14:25:13 +0800</pubDate><description><![CDATA[1、简介

介绍浏览器和 Node 之中加载 ES6 模块，以及实际开发中经常遇到的一些问题（比如循环加载）。



2、浏览器加载

HTML 网页中，浏览器通过 &amp;lt;script&amp;gt; 标签加载 JavaScript 脚本。默认情况下，浏览器是同步加载 JavaScript 脚本，即渲染引擎遇到 &amp;lt;script&amp;gt; 标签 
就会停下来，等到执行完脚本，再继续向下渲染。如果是外部...]]></description><category></category></item><item><title><![CDATA[ES6 之 module]]></title><link>https://blog.youkuaiyun.com/u013055396/article/details/79418203</link><guid>https://blog.youkuaiyun.com/u013055396/article/details/79418203</guid><author>u013055396</author><pubDate>Thu, 01 Mar 2018 22:38:46 +0800</pubDate><description><![CDATA[1、简介

历史上，JavaScript 一直没有模块（module）体系，无法将一个大程序拆分成互相依赖的小文件，再用简单的方法拼装起来。在 ES6 之前，社区制定了一些 
模块加载方案，最主要的有 CommonJS 和 AMD 两种。前者用于服务器，后者用于浏览器。ES6 在语言标准的层面上，实现了模块功能，而且实现得相当简单， 
完全可以取代 CommonJS 和 AMD 规范，成为浏览器和...]]></description><category></category></item><item><title><![CDATA[ES6 之对象拓展]]></title><link>https://blog.youkuaiyun.com/u013055396/article/details/79227618</link><guid>https://blog.youkuaiyun.com/u013055396/article/details/79227618</guid><author>u013055396</author><pubDate>Thu, 01 Feb 2018 14:03:08 +0800</pubDate><description><![CDATA[1、简介

ES6 扩展了对象。



2、属性的简洁表示法

ES6 允许直接写入变量和函数，作为对象的属性和方法。这样的书写更加简洁。



// 属性简写
const foo = 'bar';
const baz = {foo};
baz // {foo: "bar"}
const baz = {foo: foo}; // 等同于

// 方法简写
const o = {
  method(]]></description><category></category></item><item><title><![CDATA[ES6 之数组拓展]]></title><link>https://blog.youkuaiyun.com/u013055396/article/details/79213564</link><guid>https://blog.youkuaiyun.com/u013055396/article/details/79213564</guid><author>u013055396</author><pubDate>Wed, 31 Jan 2018 09:56:22 +0800</pubDate><description><![CDATA[1、简介

ES6 扩展了数组。



2、扩展运算符

扩展运算符（spread）是三个点（…）。它好比 rest 参数的逆运算，将一个数组转为用逗号分隔的参数序列。



console.log(1, ...[2, 3, 4], 5)
// 1 2 3 4 5

[...document.querySelectorAll('div')]
// [, , ]

// 主要用于函数调用
funct]]></description><category></category></item><item><title><![CDATA[ES6 之函数拓展]]></title><link>https://blog.youkuaiyun.com/u013055396/article/details/79199217</link><guid>https://blog.youkuaiyun.com/u013055396/article/details/79199217</guid><author>u013055396</author><pubDate>Mon, 29 Jan 2018 19:56:45 +0800</pubDate><description><![CDATA[1、简介

ES6 扩展了函数。



2、函数参数的默认值

ES6 之前，不能直接为函数的参数指定默认值，只能采用变通的方法。



function log(x, y) {
  y = y || 'World';
  console.log(x, y);
}
log('Hello') // Hello World
log('Hello', 'China') // Hello China
//]]></description><category></category></item><item><title><![CDATA[ES6 之数值拓展]]></title><link>https://blog.youkuaiyun.com/u013055396/article/details/79194581</link><guid>https://blog.youkuaiyun.com/u013055396/article/details/79194581</guid><author>u013055396</author><pubDate>Mon, 29 Jan 2018 13:58:30 +0800</pubDate><description><![CDATA[1、简介

ES6 扩展了数值。



2、Number.isFinite(), Number.isNaN()

ES6 在 Number 对象上，新提供了 Number.isFinite() 和 Number.isNaN() 两个方法。 
Number.isFinite() 用来检查一个数值是否为有限的（finite），即不是 Infinity。注意，如果参数类型不是数值，Number.isFi]]></description><category></category></item><item><title><![CDATA[ES6 之字符串拓展]]></title><link>https://blog.youkuaiyun.com/u013055396/article/details/79186836</link><guid>https://blog.youkuaiyun.com/u013055396/article/details/79186836</guid><author>u013055396</author><pubDate>Sun, 28 Jan 2018 14:58:08 +0800</pubDate><description><![CDATA[1、简介

ES6 扩展了字符串对象。



2、codePointAt()

JavaScript 内部，字符以 UTF-16 的格式储存，每个字符固定为2个字节。对于那些需要4个字节储存的字符（Unicode 码点大于0xFFFF的字符）， 
JavaScript 会认为它们是两个字符。ES6 提供了codePointAt方法，能够正确处理 4 个字节储存的字符，返回一个字符的码点；对于那些两]]></description><category></category></item><item><title><![CDATA[ES6 之解构赋值]]></title><link>https://blog.youkuaiyun.com/u013055396/article/details/79179058</link><guid>https://blog.youkuaiyun.com/u013055396/article/details/79179058</guid><author>u013055396</author><pubDate>Sat, 27 Jan 2018 11:09:39 +0800</pubDate><description><![CDATA[1、简介

ES6 允许按照一定模式，从数组和对象中提取值，对变量进行赋值，这被称为解构（Destructuring）。



2、数组的解构赋值

可以从数组中提取值，按照对应位置，对变量赋值。本质上等号两边的模式相同，左边的变量就会被赋予对应的值。



let [a, b, c] = [1, 2, 3];
a // 1
b // 2
c // 3

let [foo, [[bar], baz]]></description><category></category></item><item><title><![CDATA[ES6 之 let&const]]></title><link>https://blog.youkuaiyun.com/u013055396/article/details/79160214</link><guid>https://blog.youkuaiyun.com/u013055396/article/details/79160214</guid><author>u013055396</author><pubDate>Thu, 25 Jan 2018 12:04:01 +0800</pubDate><description><![CDATA[1、简介

ES6 添加 let 和 const 两种声明变量的命令，现在简单介绍下。



2、let

用法类似于 var，但是所声明的变量，只在 let 命令所在的代码块内有效：



{
  let a = 10;
  var b = 1;
}

a // ReferenceError: a is not defined.
b // 1

再比如循环中的使用： 
使用 ES5 的 var]]></description><category></category></item></channel></rss>