移动端页面的 JavaScript 开销

现在我们建立网站时越来越依赖 JavaScript ,我们有时会在不经意间付出高昂的代价。如果您希望您的网站在移动设备上快速加载和交互,那么在这篇文章中,我将介绍为什么一些简单的规则可以帮你做到这一点。

简而言之:较少的代码=较少的解析/编译+较少的传输+较少的解压缩

网络

当大多数开发人员考虑 JavaScript 的开销时,他们会考虑下载和执行开销。 发送更多字节的 JavaScript 需要的时间越长,用户的连接越慢。 继续阅读

Airbnb JavaScript 编码规范(涵盖 ECMAScript 6+)

一份最合理的 JavasScript 编码规范。 翻译自:https://github.com/airbnb/javascript

注意:本指南假定您使用的是Babel,并要求您使用 babel-preset-airbnb 或相当的预设插件。它还假定您正在您的应用程序中安装 shims/polyfills,实用airbnb-browser-shims或相当的插件。

继续阅读

JavaScript术语:shim 和 polyfill

在学习和使用 JavaScript 的时候,我们会经常碰到两个术语:shim 和 polyfill。它们有许多定义和解释,意思相近又有差异。

Shim

Shim 指的是在一个旧的环境中模拟出一个新 API ,而且仅靠旧环境中已有的手段实现,以便所有的浏览器具有相同的行为。主要特征: 继续阅读

JavaScript 中的对象拷贝

对象是 JavaScript 的基本块。对象是属性的集合,属性是键值对。JavaScript 中的几乎所有对象都是位于原型链顶部 Object 的实例。

介绍

如你所知,赋值运算符不会创建一个对象的副本,它只分配一个引用,我们来看下面的代码:

let obj = {
  a: 1,
  b: 2,
};
let copy = obj;

obj.a = 5;
console.log(copy.a);
// 结果 
// copy.a = 5;

—> Edit on JS Bin

obj 变量是一个新对象初始化的容器。copy 变量指向同一个对象,是对该对象的引用。所以现在有两种方式可以访问这个 { a: 1, b: 2, } 对象。你必须通过 obj 变量或 copy 变量,无论你是通过何种方式对这个对象进行的任何操作都会影响该对象。 继续阅读

理解 JavaScript 中的 for…of 循环

什么是 for…of 循环

for...of 语句创建一个循环来迭代可迭代的对象。在 ES6 中引入的 for...of 循环,以替代 for...inforEach() ,并支持新的迭代协议。for...of 允许你遍历 Arrays(数组), Strings(字符串), Maps(映射), Sets(集合)等可迭代的数据结构等。 继续阅读

现代 JavaScript 参考

feiwen8772 / modern-js-reference

一份现代 JavaScript 参考,你在现代项目中会经常遇到,以及最新的代码示例

http://www.css88.com/archives/8244

简介

初心

本文档是一份 JavaScript 速查表,你在现代项目中会经常遇到,以及最新的代码示例。

本指南不是为了教你从头开始学习 JavaScript ,而是为了帮助那些可能不熟悉当前代码库(例如 React)所用到 JavaScript 概念的开发人员。

此外,我有时还会提供一些个人的建议,这些建议可能是有争议的,但我也会注意到,当我这么做的时候,这是我个人的建议。 继续阅读

JavaScript 中的不可变对象(Immutable Objects)

默认情况下,JavaScript 中的对象是可变的。我们可以更改原始值(字符串,数字等)和对象。我们来看看这个对象:

let obj = {
    num: 10,
    obj: {
        content: "mutable object"
    }
}

你可以轻松地改变它: 继续阅读

用 JavaScript 检测浏览器在线/离线状态(JavaScript API — navigator.onLine)

如今HTML5 移动应用或 Web app 中越来越普遍的使用了离线浏览技术,所以用 JavaScript 检测浏览器在线/离线状态非常常见。无论浏览器是否在线,navigator.onLine 属性都会提供一个布尔值。 如果浏览器在线,则设置为 true ,否则设置为 false继续阅读

JavaScript ECMAScript 2015 (ES6) 和 ECMAScript 2016 (ES7) 新特性速查

上图为 ES6 新特性速览

ES6 给 JavaScript 带来了很深刻的变化。 它完全改变了我们使用 JavaScript 的方式。 ES7是在ES6之上的一个微小更新。 让我们看看 ES6 更新中带来的变化。本文起初是我的学习笔记,现在我和大家分享一下。

支持UNICODE标准版本8

它将允许使用笑脸,一个可以使用 unicode 声明为转义字符的变量。 继续阅读

[回归基础] JavaScript 函数中默认参数

了解 JavaScript 中的默认参数以及如何使用它们。

默认参数定义

默认参数允许你设置参数的默认值。

默认情况下,JavaScript 函数的所有参数都是 undefined (未定义的)。默认参数允许你设置不同的默认值。

请考虑以下示例:


function logFirst(data){
  console.log(data[0]);
}

上面的例子是说,我们有一个简单的函数,打印数组中的第一个元素。该函数需要一个参数,data ,我们期望它是一个 Array 数组。但是如果没有数据传入,会发生什么? 继续阅读