序言 这是一篇全面介绍 WebKit 和 Gecko 内部操作的入门文章，是以色列开发人员塔利·加希尔大量研究的成果。在过去的几年中，她查阅了所有公开发布的关于浏览器内部机制的数据（请参见资源），并花了很多时间来研读网络浏览器的源代码。她写道： 在 IE 占据 90% 市场份额的年代，我们除了把浏览器当成一个“黑箱”，什么也做不了。但是现在，开放源代码的浏览器拥有了过半的市场份额，因此，是时候来揭开神秘的面纱，一探网络浏览器的内幕了。呃，里面只有数以百万行计的 C++ 代码… 塔利在她的网站上公布了自己的研究成果，但是我们觉得它值得让更多的人来了解，所以我们在此重新整理并公布。 作为一名网络开发人员，学习浏览器的内部工作原理将有助于您作出更明智的决策，并理解那些最佳开发实践的个中缘由。尽管这是一篇相当长的文档，但是我们建议您花些时间来仔细阅读；读完之后，您肯定会觉得所费不虚。——保罗·爱丽诗 (Paul Irish)，Chrome 浏览器开发人员事务部 简介 网络浏览器很可能是使用最广的软件。在这篇入门文章中，我将会介绍它们的幕后工作原理。我们会了解到，从您在地址栏输入 googl ...

类与接口 之前学习过，接口（Interfaces）可以用于对「对象的形状（Shape）」进行描述。 这一章主要介绍接口的另一个用途，对类的一部分行为进行抽象。 类实现接口 实现（implements）是面向对象中的一个重要概念。一般来讲，一个类只能继承自另一个类，有时候不同类之间可以有一些共有的特性，这时候就可以把特性提取成接口（interfaces），用 implements 关键字来实现。这个特性大大提高了面向对象的灵活性。 举例来说，门是一个类，防盗门是门的子类。如果防盗门有一个报警器的功能，我们可以简单的给防盗门添加一个报警方法。这时候如果有另一个类，车，也有报警器的功能，就可以考虑把报警器提取出来，作为一个接口，防盗门和车都去实现它： 123456789101112131415161718interface Alarm { alert(): void;}class Door {}class SecurityDoor extends Door implements Alarm { alert() { ...

对象的类型——接口 在 TypeScript 中，我们使用接口（Interfaces）来定义对象的类型。 什么是接口 在面向对象语言中，接口（Interfaces）是一个很重要的概念，它是对行为的抽象，而具体如何行动需要由类（classes）去实现（implement）。 TypeScript 中的接口是一个非常灵活的概念，除了可用于对类的一部分行为进行抽象以外，也常用于对「对象的形状（Shape）」进行描述。 简单的例子 123456789interface Person { name: string; age: number;}let tom: Person = { name: 'Tom', age: 25}; 上面的例子中，我们定义了一个接口 Person，接着定义了一个变量 tom，它的类型是 Person。这样，我们就约束了 tom 的形状必须和接口 Person 一致。 接口一般首字母大写。有的编程语言中会建议接口的名称加上 I 前缀。 定义的变量比接口少了一些属性是不允许的： 12345 ...

联合类型 联合类型（Union Types）表示取值可以为多种类型中的一种。 简单的例子 123456789let myFavoriteNumber: string | number;myFavoriteNumber = 'seven';myFavoriteNumber = 7;``````let myFavoriteNumber: string | number;myFavoriteNumber = true;// index.ts(2,1): error TS2322: Type 'boolean' is not assignable to type 'string | number'.// Type 'boolean' is not assignable to type 'number'. 联合类型使用 | 分隔每个类型。 这里的 let myFavoriteNumber: string | number 的含义是，允许 myFavoriteNumber 的类型是 strin ...

类型推论 如果没有明确的指定类型，那么 TypeScript 会依照类型推论（Type Inference）的规则推断出一个类型。 什么是类型推论 以下代码虽然没有指定类型，但是会在编译的时候报错： 1234let myFavoriteNumber = 'seven';myFavoriteNumber = 7;// index.ts(2,1): error TS2322: Type 'number' is not assignable to type 'string'. 事实上，它等价于： 1234let myFavoriteNumber: string = 'seven';myFavoriteNumber = 7;// index.ts(2,1): error TS2322: Type 'number' is not assignable to type 'string'. TypeScript 会在没有明确的指定类型的时候推测出一个类型，这就是类型推论。 如果 ...

任意值 任意值（Any）用来表示允许赋值为任意类型。 什么是任意值类型 如果是一个普通类型，在赋值过程中改变类型是不被允许的： 1234let myFavoriteNumber: string = 'seven';myFavoriteNumber = 7;// index.ts(2,1): error TS2322: Type 'number' is not assignable to type 'string'. 但如果是 any 类型，则允许被赋值为任意类型。 12let myFavoriteNumber: any = 'seven';myFavoriteNumber = 7; 任意值的属性和方法 在任意值上访问任何属性都是允许的： 123let anyThing: any = 'hello';console.log(anyThing.myName);console.log(anyThing.myName.firstName); 也允许调用任何方法： 1234let anyTh ...

原始数据类型 JavaScript 的类型分为两种：原始数据类型（Primitive data types）和对象类型（Object types）。 原始数据类型包括：布尔值、数值、字符串、null、undefined 以及 ES6 中的新类型 Symbol 和 ES10 中的新类型 BigInt。 本节主要介绍前五种原始数据类型在 TypeScript 中的应用。 布尔值 布尔值是最基础的数据类型，在 TypeScript 中，使用 boolean 定义布尔值类型： 1234let isDone: boolean = false;// 编译通过// 后面约定，未强调编译错误的代码片段，默认为编译通过 注意，使用构造函数 Boolean 创造的对象不是布尔值： 1234let createdByNewBoolean: boolean = new Boolean(1);// Type 'Boolean' is not assignable to type 'boolean'.// 'boolean' is a primit ...

Hello TypeScript 我们从一个简单的例子开始。 将以下代码复制到 hello.ts 中： 123456function sayHello(person: string) { return 'Hello, ' + person;}let user = 'Tom';console.log(sayHello(user)); 然后执行 1tsc hello.ts 这时候会生成一个编译好的文件 hello.js： 12345function sayHello(person) { return 'Hello, ' + person;}var user = 'Tom';console.log(sayHello(user)); 在 TypeScript 中，我们使用 : 指定变量的类型，: 的前后有没有空格都可以。 上述例子中，我们用 : 指定 person 参数类型为 string。但是编译为 js 之后，并没有什么检查的代码被插入进来。 这是因为 ...

安装 TypeScript TypeScript 的命令行工具安装方法如下： 1npm install -g typescript 以上命令会在全局环境下安装 tsc 命令，安装完成之后，我们就可以在任何地方执行 tsc 命令了。 编译一个 TypeScript 文件很简单： 1tsc hello.ts 我们约定使用 TypeScript 编写的文件以 .ts 为后缀，用 TypeScript 编写 React 时，以 .tsx 为后缀。 编辑器 TypeScript 最大的优势之一便是增强了编辑器和 IDE 的功能，包括代码补全、接口提示、跳转到定义、重构等。 主流的编辑器都支持 TypeScript，这里我推荐使用 Visual Studio Code。 它是一款开源，跨终端的轻量级编辑器，内置了对 TypeScript 的支持。 另外它本身也是用 TypeScript 编写的。 下载安装：https://code.visualstudio.com/ 获取其他编辑器或 IDE 对 TypeScript 的支持： Sublime Text WebStorm Vim Emacs ...