Set和Map是ES6新增的2种集合类型，Set在前面已经讲过。这一篇我们主要来讲一下Map。我们先来看一些Map的基本定义和描述： {代码...} 废话不多说，我们来看看Map的基本用法：一：创建和初始化一个Map1：创建一个空Map {代码...} 以上，我们创建了一个没有元素的空Map。 2：用Array初始化Map {代码...} 得到打印结果： {代...

以上代码，我们存储了一个对象的引用key，但是随后我们通过key = null清楚了对象的引用，但是随后我们查看set.size依然得到1，且依然可以通过把set展开到数组取到原本已经被我们清除了引用的key。之所以会出现这样的结果是因为，Set存储的是对象的强引用，虽然在代码的其他地方已经不存在对此变量的引用，但是javaScript...

ES6之前，数组是javaScript里面的唯一一个集合对象。如果你接触过其他编程语言，可能会知道用来表示集合的数据结构往往还有两种：Set和Map。Set没有重复的元素的列表。而Map的元素是一个个的键值对。这一篇我们只说Set，Map会另起一篇文章。接下来我们就来看看Set的相关知识：一：创建Set1: 通过new Set()创建一个空列表

ECMAScript 6 通过在原型链上定义与Symbol相关的属性来暴露语言内部逻辑，使得开发者可以对一些语言的默认行为做配置。接下来我们来看看有哪些重要的Symbol属性可供我们使用：

ES6新增了一个基本数据类型：Symbol，至此ECMAScript的基本数据类型就有了6种：字符串，数字，布尔，null，undefined,Symbol。关于Symbol，我打算写2篇文章来提取一下比较重要的知识点，这篇是第一篇，主要讲Symbol的基本特性和使用场景。下一篇主要讲几个比较重要的Symbol属性。废话不多说，先进入第一篇的主题：一：Sy...

ES6的第一章便是讲新增了let和const这两个变量，可以用于定义块级作用域的变量。相对于于var定义的变量，由let和const定义的变量作用域不会被提升。但是值得注意的是，由let和const定义的变量还拥有一个会让人恨容易犯错的特性：临时死区（Temporal Dead Zone，下文以TDZ简称）。但是拥有TDZ的不仅是变量，函数的参数也...

1: 给迭代器的next()方法传参在前面2篇系列文章中我们使用的next()方法都是没有传参的，调用next()会依次返回迭代器里面的值。但是，实际上我们是可以给next()方法传参数的，那在这种情况下我们会得到什么样的结果呢？

所以我们可以给出一个可迭代对象的明确定义就是：一个对象，具有Symbol.iterator属性，Symbol.iterator是一个生成器函数，那么这个对象就是可迭代对象。

我个人认为迭代器和生成器是es6新增的特性里面，非常重要的部分，充分地掌握和使用迭代器和生成器，是十分必要和重要的，所以我会写关于二者的一系列文章。话不多说，先来了解一下基本概念：一：什么是迭代器

如果你的是用vue-cli生成你的vue项目，意味着生成的项目的默认webpack配置几乎不需要做什么修改，你通过npm run build就能得到可以用于发布的/dist文件夹，里面包含着一个index.html文件和build出来的output文件。如果打开/dist/index.html文件，大概你看到的是类似于这样：

Webpack里面有三种hash，分别是：hash, chunkhash, contenthash.在我们尝试去区分他们仨之前，先来看看为什么我们需要hash。

与正则表达式相关的API有以下7个： RegExp.prototype​.test() RegExp.prototype​.exec() String​.prototype​.search() String​.prototype​.match() String​.prototype​.matchAll() String​.prototype​.split() String​.prototype​.replace() 在我们展开到各个方法之前，先来看一下在JavaScript里面定义一个正则表达式的...

一：集合[abc]在正则表达式里表示一个包含a或者b或者c的集合，匹配三者之中的任意一个。注意元素之间不用空格和逗号隔开，因为在正则表达式里，[]里的空格或者逗号也会被判定为一个匹配元素。来看一个例子:

1：<script>...</script>之间嵌入js代码**2：<script src='xx.js'></script> 通过src引入外部js文件**3：加载js代码如workers（例如 web worker或者service worker）

3：export重命名有时候你也许不想用一个变量，方法，类的原本的名字，而是想换一个别的名字。那么你可以使用 as，而且在export和import的时候都可以，例如：

假如你烘焙过蛋糕（哪怕没有亲自做过，但是也应该听说过），除了基本的面粉，鸡蛋等原材料外，或许你还需要一个电动蛋白打发器，一个烤箱。这是现代的做法，那么在打发器和烤箱发明之前，人们怎么烤蛋糕呢？没有打发器，只能手动打发，这样的弊端是不仅花费时间长，而且你的手可能也要废掉。没有烤箱，用炭烤，这样就会...

读前须知：此篇文章基本上是Widget - State - Context - InheritedWidget的翻译并且删减了部分我个人觉得没有意义的文字，保留下来的部分也不会逐字逐句精确翻译，所以其实强烈推荐阅读英文原文。

上面是一个简单的路由配置代码，假设现在的APP有2个页面：home, profile。我们拿这个例子来讲一下flutter的routes配置一些注意的点：首先可以看到注掉的那2行代码，分别是MaterialApp的两个属性：initialRoute和home。

String作为JS里面最常用的数据类型，我好像没有好好地总结过，所以偶尔有些不常用的，细节的知识点还是不是100%的自信，希望写篇文章来巩固一下。文章主要分为一下几部分：

2:八进制语法：0xxxx;八进制的第一位必须是0，后面是数字序列。数字序列只能是0～7的数字，如果出现除此之外的数字，值这个八进制失效，会被当作十进制处理，例如：let x = 070; 等于十进制的56let y = 079; 无效的八进制，解析为十进制的79ps: 八进制在严格模式下无效，会抛出错误

1: 强缓存：不会向服务器发请求，直接从浏览器的缓存里面读取。状态码为200，size为from disk cache 或者 from memory cache。

当我们通过<script>元素引入外部js文件的时候，<script>元素本身的两个属性对整个页面的解析，js文件本身的下载和执行都会产生影响，这两个属性就是：defer, async接下来的文章对js所有可能的情况一一总结1: 通过<script>元素直接嵌入一段代码

凡是做SPA的项目，特别是移动端的SAP项目，首屏加载速度必定是一个绕不过去的话题。接下来我就我们项目里的一些实践来做一下总结。希望抛砖引玉，如果各位有更好的方案，不吝赐教。

[2: What's the difference between full standards mode, almost standards mode and quirks mode?]

flex的元素默会默认充满一行或者一列，但是当你给他们的contanier设置了flex-wrap之后情况就会不一样了。flex-wrap可以接受三个值：

flex是CSS的一个特性，通过它可以让在某一个区域内的多个元素灵活的布局，对移动端的布局特别有用。跟flex相关的css属性不止一个，而是很多个，而且有些还很复杂。所以，我们就一个一个的来。

1: CSSStyleDeclaration对象跟别的属性一样，style也是元素的一个属性，只是style属性是一个比较特殊的属性，它不是一个字符串，而是一个叫做CSSStyleDeclatation的对象：一个包含CSS属性的对象。比如：

window.scrollTo(x, y)和window.scroll(x, y)的参数x和y是某个文档坐标的值，这两个函数的效果完全一样。window.scrollBy(x, y)的x和y是一个相对值，滚动条相对当前位置向右边（x为正值）或者向左（x为负值）和向下（y为正值）或向上（y为负值）的偏移量

以上方法返回一个对象，包含六个元素，分别是此元素左上角和右下角的坐标，以及元素的宽和高。但是在原始的IE中并不返回width和height, 不过可以自己通过坐标计算出来。值得注意的是getBoundingClientRect()不是实时的，在调用此函数后，用户再滚动或者改变浏览器窗口大小，它返回的值并不会更新。

参考：[链接]在讲BFC之前，先来了解一下CSS2.1规范里面的一个关于元素的定位规则(positioning schemes),主要有三种：常规文档流，浮动，绝对定位。1: 常规文档流(Normal flow)：常规文档流包含三种情况：