ES6 中的 Symbol,Set 和 Map

在平常的开发当中,我们会经常用到 ES6 相关语法,大致总结一下,ES6 更新的内容可以分为以下几点

  • 表达式,声明、解构赋值
  • 内置对象,字符串扩展、数值扩展、对象扩展、数组扩展、函数扩展、正则扩展、SymbolSetMapProxyReflect
  • 语句与运算,ClassModuleIterator
  • 异步编程,PromiseGeneratorAsync

有一些是我们经常会遇到和用到的,比如 letconst,扩展运算,Promise 等,之前也单独整理过一些,比如 ClassIteratorAsync,AwaitReflect

今天我们就来看看剩下的几个可能是平常用的不太多的 SymbolSetMap,主要参考的是 ECMAScript 6 入门

正则表达式

今天我们就来简单的复习一下 JavaScript 当中的正则表达式的一些内容,顺便记录记录,关于正则表达式,官网的说法是,正则表达式(regular expression)描述了一种字符串匹配的模式(pattern),可以用来检查一个串是否含有某种子串、将匹配的子串替换或者从某个串中取出符合某个条件的子串等

IntersectionObserver

按照惯例,我们先来看看 IntersectionObserver 到底是个什么东西,MDN 上的介绍的是,IntersectionObserver 接口(从属于 Intersection Observer API),提供了一种异步观察目标元素与其祖先元素或顶级文档视窗(viewport)交叉状态的方法,祖先元素与视窗(viewport)被称为根(root

当一个 IntersectionObserver 对象被创建时,其被配置为监听根中一段给定比例的可见区域,一旦 IntersectionObserver 被创建,则无法更改其配置,所以一个给定的观察者对象只能用来监听可见区域的特定变化值,然而你可以在同一个观察者对象中配置监听多个目标元素

JavaScript 中一些常用方法的实现

算是一些手写 API,常用方法的一些汇总,反正就是面试可能涉及到的一些手写功能可能都会有所涉及,不仅仅只是为了面试所用,也算是在这里做下汇总记录,方便以后可以快速查询(可以直接参考左边目录)

迭代器与生成器

JavaScript 当中对集合中每个元素进行处理是很常见的操作,比如数组遍历、对象的属性遍历,以往这些操作是通过 for 循环、.forEach.map 等方式进行,借由迭代器机制为 MapArraystring 等对象提供了统一的遍历语法,以及更方便的相互转换

在最新的 ES6 当中为方便编写迭代器还提供了生成器(Generator)语法,迭代器和生成器将迭代的概念直接带入核心语言,并提供了一种机制来自定义 for-of 循环的行为,下面我们就来看看迭代器到底是一种怎样的语法

浏览器的渲染机制

在展开渲染机制相关内容之前,我们先来简单的了解一下常见的浏览器内核有哪些,浏览器的内核是指支持浏览器运行的最核心的程序,分为两个部分的,一是渲染引擎,另一个是 JavaScript 引擎(比如我们经常可以听到的 V8 引擎),渲染引擎在不同的浏览器中也不是都相同的,目前市面上常见的浏览器内核主要有以下这些

浏览器/RunTime 内核(渲染引擎) JavaScript 引擎
Chrome Blink(28~)Webkit(Chrome 27) V8
FireFox Gecko SpiderMonkey
Safari Webkit JavaScriptCore
Edge EdgeHTML Chakra(for JavaScript)
IE Trident Chakra(for JScript)
PhantomJS Webkit JavaScriptCore
Node.js - V8

这里面大家最耳熟能详的可能就是 Webkit 内核了,其中的 Blink 其实就是 Webkit 的一个分支,也就是说它也是基于 Webkit 的,所以本章也就以 Webkit 为例,来看看浏览器的渲染机制到底是一个什么样的过程,不过在此之前,我们先来简单的了解一下浏览器的主要组成部分和它包含的一些主要进程,这有助于我们下面更好的理解浏览器当中的渲染机制

遍历对象的几种方法

JavaScript 当中遍历对象方式有许多种,比如常见的 for-inObject.keys(obj) 等等,但是对于它们之间的区别一直有些模糊,所以今天就抽些时间将 JavaScript 当中涉及到遍历对象的 API 整体的梳理了一遍,看看它们的使用方式和之间的区别,先来小小的总结一下,大致有以下几种

Zepto 架构设计

最近看了 zepto 设计和源码分析 ,感觉有耳目一新的感觉,作者没有老套的去讲各个方法怎么实现的,能做些什么,而是讲了许多为什么源码要这样去设计,这样设计有什么好处,也分享了一些自己的看源码心得

一口气看完,收货良多,不光了解了 Zepto 的设计理念,同时也重温了 JavaScript 原型链的一些相关知识,在此记录一些笔记和涉及到的一些知识点,同时也感谢作者分享了加注版本的 zepto 源码,这样读起来也轻松不少,地址见 zepto-core-1.1.6 源码注视

为什么 Object.keys 的返回值会自动排序

我们先从一个示例开始看起,如下所示

JavaScript 中的事件轮询机制

最后更新于 2019-12-28

最近打算重新复习一下 JavaScript 中的事件轮询机制,而且刚好在之前也介绍过 Node.js 中的事件轮询机制,它与 JavaScript 中的事件轮询机制是有所区别的,所以在这里打算重新的梳理一下,也算是将之前博客当中关于事件轮询的相关内容做一个汇总,方便以后更为方便的复习和查看,下面我们就先从一些前置知识点开始看起

Your browser is out-of-date!

Update your browser to view this website correctly. Update my browser now

×