0%

一、Network 面板介绍

其中:

  • Controls 控制 Network 的外观和功能。
  • Filters 控制 Requests Table 具体显示哪些内容。
  • Overview 显示获取到资源的时间轴信息。
  • Requests Table 按资源获取的前后顺序显示所有获取到的资源信息,点击资源名可以查看该资源的详细信息。
  • Summary 显示总的请求数、数据传输量、加载时间信息。
阅读全文 »

概述

console 的功能主要在于控制台打印,它可以打印任何字符、对象、甚至 DOM 元素和系统信息,下面一一介绍。

console.log( ) | info( ) | debug( ) | warn( ) | error( )

直接打印字符,区别在于展示形态的不同:

新版 chrome 控制台可以将打印信息分类:

阅读全文 »

简介

结构是一种打破数据结构,将其分拆为更小部分的过程。它可以方便我们有组织地从对象或数组中提取感兴趣的信息片段,是 ES6 新增加的特性。

对象解构

  • 解构声明

将对象解构用于变量声明的用法如下:

1
2
3
4
5
6
7
let node = {
type: "Identifier",
name: "foo"
};
let { type, name } = node;
console.log(type); // "Identifier"
console.log(name); // "foo"
  • 解构赋值

变量赋值使用解构语法:

阅读全文 »

介绍

JS 有两种计时器方法:

方法 描述
setTimeout(fun,millisec) 在指定的延迟时间之后调用一个函数或者执行一个代码片段。
clearTimeout(timerID) 方法可取消由 setTimeout() 方法设置的 timeout。
setInterval(fun,millisec) 周期性地调用一个函数(function)或者执行一段代码。
clearInterval(timerID) 取消掉用setInterval设置的重复执行动作。
  • setTimeout

用来指定某个函数或字符串在指定的毫秒数后执行一次;它返回一个整数,表示定时器的编号,这个编号可以传递给 clearTimeout() 用于取消这个函数的执行。

阅读全文 »

概述

ES6 之前,社区定制了一些模块加载方案,最主要的有 CommonJSAMD 两种。前者用于 node 服务器,后者用于浏览器。ES6 在语言标准的层面上实现了模块功能,而且相对简单,完全可以取代 CommonJSAMD 规范,成为浏览器和服务器的通用模块解决方案。

ES6 的模块设计思想是尽量的静态化,使得编译时就能嫩嫩个确定模块的依赖关系,以及输入输出的变量。而 CommonJSAMD 则都是在运行时确定这些东西,导致没办法在编译时做静态优化。

严格模式

ES6 的模块自动采用严格模式,不管有没有在模块头部加上 ‘use strict’。

详情见:严格模式和非严格模式

阅读全文 »

相等判断分类

  • 非严格比较 == 和 !=

比较若类型不同,先偿试转换类型,再作值比较,最后返回值比较结果 。

  • 严格比较 === 和 !==

只有在相同类型下,才会比较其值;类型不同直接返回 false。

Object.is 的行为方式与三等号相同,只在 NaN 以及 -0 和 +0 对比时有区别,详情见下面的对照表。

阅读全文 »

安装

通过以下步骤安装 docker:

  • 设置 docker repository

    1
    2
    3
    4
    $ sudo yum install -y yum-utils
    $ sudo yum-config-manager \
    --add-repo \
    https://download.docker.com/linux/centos/docker-ce.repo

    设置成功以后,后续就可以通过这个仓库安装或更新 docker 了。

阅读全文 »

font-size

下面这段代码 font-size 相同,不过 font-family 不一样:

1
2
3
4
5
<p>
<span class="a">Ba</span>
<span class="b">Ba</span>
<span class="c">Ba</span>
</p>
1
2
3
4
p  { font-size: 100px }
.a { font-family: Helvetica }
.b { font-family: Gruppo }
.c { font-family: Catamaran }

由此得到的 span 元素的实际高度各不相同:

阅读全文 »

简介

hexo 博客系统会将 md 文件转换成可以在浏览器里访问的 html 文件,如果将转换后的文件放在云服务器上,起一个 nginx 服务即可达自建博客的目的,从此告别龟速的 GitHub pages。

环境

本地:macOS Mojave 10.14.6

云服务器:腾讯云 Centos8

准备好 hexo 编译后文件

将 hexo 编译后的文件手动拷贝到云服务器的特定目录下,我的存放位置是:

1
2
su root
mkdir /home/hexo # 此目录为网站的根目录
阅读全文 »

普通对象的扩展运算符

理解对象的扩展运算符其实很简单,只要记住一句话就可以:

对象中的扩展运算符(…)用于取出参数对象中的所有可遍历属性,拷贝到当前对象之中

1
2
let bar = { a: 1, b: 2 };
let baz = { ...bar }; // { a: 1, b: 2 }

上述方法实际上等价于:

1
2
let bar = { a: 1, b: 2 };
let baz = Object.assign({}, bar); // { a: 1, b: 2 }
阅读全文 »