-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathsearch.xml
35 lines (23 loc) · 24 KB
/
search.xml
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
<?xml version="1.0" encoding="utf-8"?>
<search>
<entry>
<title><![CDATA[宽松相等和严格相等]]></title>
<url>%2F2017%2F05%2F18%2F%E5%AE%BD%E6%9D%BE%E7%9B%B8%E7%AD%89%E5%92%8C%E4%B8%A5%E6%A0%BC%E7%9B%B8%E7%AD%89%2F</url>
<content type="text"><![CDATA[常见的误区是：“== 检查值是否相等，=== 检查值和类型是否相等” 正确的解释是：“== 允许在相等比较中进行强制类型转换，而=== 不允许。” 抽象相等比较算法ES5规范11.9.3节对抽象相等比较算法定义如下： ES5规范 以 x 和 y 为值进行 x == y 比较会产生的结果可为 true 或 false。比较的执行步骤如下： 1234567891011121314151617181920212223242526272829303132331. 若 Type(x) 与 Type(y) 相同， 则 1. 若 Type(x) 为 Undefined， 返回 true。 2. 若 Type(x)为 Null， 返回 true。 3. 若 Type(x)为 Number，则 1. 若 x 为 NaN，返回 false。 2. 若 y 为 NaN，返回 false。 3. 若 x 与 y 为相等数值，返回 true。 4. 若 x 为 +0 且 y 为 −0，返回 true。 5. 若 x 为 −0 且 y 为 +0，返回 true。 6. 返回 false。 4. 若 Type(x) 为 String，则当 x 和 y 为完全相同的字符序列（长度相等且相同字符在相同位置）时返回 true。否则，返回 false。 5. 若 Type(x) 为 Boolean，当 x 和 y 为同为 true 或者同为 false 时返回 true。否则，返回 false。 当 x 和 y 为引用同一对象时返回 true。否则，返回 false。2. 若 x 为 null 且 y 为 undefined，返回 true。3. 若 x 为 undefined 且 y 为 null，返回 true。4. 若 Type(x) 为 Number 且 Type(y) 为 String，返回 x == ToNumber(y) 的结果。5. 若 Type(x) 为 String 且 Type(y) 为 Number，返回比较 ToNumber(x) == y 的结果。6. 若 Type(x) 为 Boolean，返回比较 ToNumber(x) == y 的结果。7. 若 Type(y) 为 Boolean，返回比较 x == ToNumber(y) 的结果。8. 若 Type(x) 为 String 或 Number，且 Type(y) 为 Object，返回比较 x == ToPrimitive(y) 的结果。9. 若 Type(x) 为 Object 且 Type(y) 为 String 或 Number，返回比较 ToPrimitive(x) == y 的结果。10. 返回 false。 注：根据上述等于的定义：- 字符串比较可以以："" + a == "" + b 硬性触发。- 数值比较可以以：+a == +b 硬性触发。- 布尔比较可以以：!a == !b 硬性触发。注：等于运算符有以下的不变量：- A != B 与 !(A == B) 相等。- 除了 A 与 B 的执行顺序以外，A == B 与 B == A 相等。注：等于运算符不总是可传递。举例来说，两个代表相同 String 值但是不同的 String 对象会分别与 String 值 ==，但是两个对象间不相等。 字符串和数字之间的相等：调用ToNumber(),将字符串转换为数字类型 其他类型和布尔类型之间的相等：调用ToNumber(),将布尔类型转换为数字类型 12345678910111213141516171819202122var a = "42";强制类型转换 ｜ 81// 不要这样用，条件判断不成立：if (a == true) {// ..}// 也不要这样用，条件判断不成立：if (a === true) {// ..}// 这样的显式用法没问题：if (a) {// ..}// 这样的显式用法更好：if (!!a) {// ..}// 这样的显式用法也很好：if (Boolean( a )) {// ..} null 和undefined 之间的相等：null==undefined 返回true 对象和非对象之间的相等：调用ToPrimitive()方法，将对象转为标量基本类型。 为了将值转换为相应的基本类型值，抽象操作ToPrimitive会首先检查该值是否有valueOf() 方法。如果有并且返回基本类型值，就使用该值进行强制类型转换。如果没有就使用toString()的返回值（如果存在）来进行强制类型转换。如果valueOf() 和toString() 均不返回基本类型值，会产生TypeError 错误。 Object valueOf()返回值 toString()返回值 数组Array 返回数组实例 将Array的元素转为字符串，用逗号分隔 布尔值Boolean 布尔值 转换为”true”或”false” 日期Date 从1970年到目前的时间（毫秒） 返回日期的文本表示形式。 函数Function 函数本身 返回如下格式字符串:function Name(){[native code]} 数字Number 数字值 返回数字文本形式 对象Object 对象本身，默认值 返回”[object objectname]”,objectname为对象类型的名称 字符串String 字符串值 返回String对象的值 严格等于比较算法123456789101112131415比较 x === y，x 和 y 为值，需要产出 true 或 false。比较过程如下：1. 如果 Type(x) 与 Type(y) 的结果不一致，返回 false。2. 如果 Type(x) 结果为 Undefined，返回 true。3. 如果 Type(x) 结果为 Null，返回 true。4. 如果 Type(x) 结果为 Number，则 a. 如果 x 为 NaN，返回 false。 b. 如果 y 为 NaN，返回 false。 c. 如果 x 与 y 为同一个数字，返回 true。 d. 如果 x 为 +0，y 为 -0，返回 true。 e. 如果 x 为 -0，y 为 +0，返回 true。 f. 返回 false。5. 如果 Type(x) 结果为 String，如果 x 与 y 为完全相同的字符序列（相同的长度和相同的字符对应相同的位置），返回 true，否则，返回 false。6. 如果 Type(x) 结果为 Boolean，如果 x 与 y 都为 true 或 false，则返回 true，否则，返回 false。7. 如果 x 和 y 引用到同一个 Object 对象，返回 true，否则，返回 false。]]></content>
</entry>
<entry>
<title><![CDATA[CommonJS与ES6模块规范]]></title>
<url>%2F2017%2F03%2F28%2FCommonJS%E4%B8%8EES6%E6%A8%A1%E5%9D%97%E8%A7%84%E8%8C%83%2F</url>
<content type="text"><![CDATA[在ES6之前，模块规范最主要的有CommonJS和AMD两种。前者用于服务器，后者用于浏览器。ES6在语言规格的层面上，实现了模块功能，而且实现得相当简单，完全可以取代现有的CommonJS和AMD规范，成为浏览器和服务器通用的模块解决方案。ES6模块的设计思想，是尽量的静态化，使得编译时就能确定模块的依赖关系，以及输入和输出的变量。 –《ES6标准入门》 以上大体说明了ES6的模块规范和其他主流的规范剑的区别，接下来结合这几天的学习，总结下CommonJS和ES6这两种规范，以及它们的差异和优缺点，纯属个人学习总结，不喜勿喷哦！ CommonJS模块规范一个文件就是一个模块，每个模块内部都有一些默认定义好的变量和方法。CommonJS模块的特点如下： 所有代码都运行在模块作用域，不会污染全局作用域。 模块可以多次加载，但是只会在第一次加载时运行一次，然后运行结果就被缓存了，以后再加载，就直接读取缓存结果。要想让模块再次运行，必须清除缓存。 模块加载的顺序，按照其在代码中出现的顺序。 1.module对象module变量代表当前模块，是一个对象。它有以下属性： module.id 模块的识别符，通常是带有绝对路径的模块文件名。 module.filename 模块的文件名，带有绝对路径。 module.loaded 返回一个布尔值，表示模块是否已经完成加载。 module.parent 返回一个对象，表示调用该模块的模块。 在命令行下调用某个模块，比如node something.js，那么module.parent就是undefined， 在脚本之中调用，比如require(‘./something.js’)，那么module.parent就是调用它的模块。 利用这一点，可以判断当前模块是否为入口脚本。 module.children 返回一个数组，表示该模块要用到的其他模块。 module.exports 表示模块对外输出的值，加载某个模块，其实是加载该属性。 下面是一个示例文件，最后一行输出module变量1234// example.jsvar jquery = require('jquery');exports.$ = jquery;console.log(module); 执行这个文件，命令行会输出如下信息：12345678910111213141516171819{ id: '.', exports: { '$': [Function] }, parent: null, filename: '/path/to/example.js', loaded: false, children: [ { id: '/path/to/node_modules/jquery/dist/jquery.js', exports: [Function], parent: [Circular], filename: '/path/to/node_modules/jquery/dist/jquery.js', loaded: true, children: [], paths: [Object] } ], paths: [ '/home/user/deleted/node_modules', '/home/user/node_modules', '/home/node_modules', '/node_modules' ]} 2.require命令2.1.require命令的基本功能是，读入并执行一个JavaScript文件，然后返回该模块的exports对象。如果没有发现指定模块，会报错2.2.require命令调用自身，等于是执行module.exports12345module.exports = function () { console.log("hello world")}require('./example2.js')() //输出 hello world。 2.3 加载规则 如果参数字符串以“/”开头，则表示加载的是一个位于绝对路径的模块文件。比如，require(‘/home/marco/foo.js’)将加载/home/marco/foo.js。 如果参数字符串以“./”开头，则表示加载的是一个位于相对路径（跟当前执行脚本的位置相比）的模块文件。比如，require(‘./circle’)将加载当前脚本同一目录的circle.js。 如果参数字符串不以“./“或”/“开头，则表示加载的是一个默认提供的核心模块（位于Node的系统安装目录中），或者一个位于各级node_modules目录的已安装模块（全局安装或局部安装）。 如果参数字符串不以“./“或”/“开头，而且是一个路径，比如require(‘example-module/path/to/file’)，则将先找到example-module的位置，然后再以它为参数，找到后续路径。 如果指定的模块文件没有发现，Node会尝试为文件名添加.js、.json、.node后，再去搜索。.js件会以文本格式的JavaScript脚本文件解析，.json文件会以JSON格式的文本文件解析，.node文件会以编译后的二进制文件解析。 如果想得到require命令加载的确切文件名，使用require.resolve()方法。 举例来说，脚本/home/user/projects/foo.js执行了require(‘bar.js’)命令，Node会依次搜索以下文件.12345/usr/local/lib/node/bar.js/home/user/projects/node_modules/bar.js/home/user/node_modules/bar.js/home/node_modules/bar.js/node_modules/bar.js 2.4 模块的缓存第一次加载某个模块时，Node会缓存该模块。以后再加载该模块，就直接从缓存取出该模块的module.exports属性。 2.5 require.mainrequire方法有一个main属性，可以用来判断模块是直接执行，还是被调用执行。 直接执行的时候（node module.js），require.main属性指向模块本身。 12require.main === module// true 调用执行的时候（通过require加载该脚本执行），上面的表达式返回false。 ES6模块规范以上主要阐述了CommonJS的规范，接下来将从ES6模块的规范和CommonJS规范的差异处进入，一点点剖析二者的不同。1. 加载方式ES6模块的设计思想，是尽量的静态化，使得编译时就能确定模块的依赖关系，以及输入和输出的变量。CommonJS和AMD模块，都只能在运行时确定这些东西。 12345// CommonJS模块let { stat, exists, readFile } = require('fs');// 等同于let _fs = require('fs');let stat = _fs.stat, exists = _fs.exists, readfile = _fs.readfile; 上面代码的实质是整体加载fs模块**（即加载fs的所有方法），生成一个对象（_fs），然后再从这个对象上面读取3个方法。这种加载称为“运行时加载”，因为只有运行时才能得到这个对象，导致完全没办法在编译时做“静态优化”。 123// ES6模块import { stat, exists, readFile } from 'fs';上 上面代码的实质是从fs模块加载3个方法，其他方法不加载。这种加载称为“编译时加载”，即ES6可以在编译时就完成模块加载，效率要比CommonJS模块的加载方式高。当然，这也导致了没法引用ES6模块本身，因为它不是对象。 2.ES6模块加载的实质ES6模块加载的机制，与CommonJS模块完全不同。CommonJS模块输出的是一个值的拷贝，也就是说，一旦输出一个值，模块内部的变化就影响不到这个值。，而ES6模块输出的是值的引用。 CommonJS的例子123456789101112131415// lib.jsvar counter = 3;function incCounter() {counter++;}module.exports = {counter: counter,incCounter: incCounter,};上面代码输出内部变量counter和改写这个变量的内部方法incCounter。然后，在main.js里面加载这个模块。// main.jsvar mod = require('./lib');console.log(mod.counter); // 3mod.incCounter();console.log(mod.counter); // 3 上面代码说明，lib.js模块加载以后，它的内部变化就影响不到输出的mod.counter了。这是因为mod.counter是一个原始类型的值，会被缓存。除非写成一个函数，才能得到内部变动后的值。 123456789101112131415// lib.jsvar counter = 3;function incCounter() {counter++;}module.exports = {get counter() {return counter},incCounter: incCounter,};//$ node main.js//3//4 上面代码中，输出的counter属性实际上是一个取值器函数。现在再执行main.js，就可以正确读取内部变量counter的变动了。 ES6模块的运行机制与CommonJS不一样，它遇到模块加载命令import时，不会去执行模块，而是只生成一个动态的只读引用。等到真的需要用到时，再到模块里面去取值，换句话说，ES6的输入有点像Unix系统的“符号连接”，原始值变了，import输入的值也会跟着变。因此，ES6模块是动态引用，并且不会缓存值，模块里面的变量绑定其所在的模块。 ES6模块的例子 12345678910// lib.jsexport let counter = 3;export function incCounter() {counter++;}// main.jsimport { counter, incCounter } from './lib';console.log(counter); // 3incCounter();console.log(counter); // 4 2. 循环加载2.1 CommonJS模块的加载原理CommonJS的一个模块，就是一个脚本文件。require命令第一次加载该脚本，就会执行整个脚本，然后在内存生成一个对象。 require命其实不是一个全局命令，而是指向当前模块的module.require命令，而后者又调用Node的内部命令Module._load。 123456789Module._load = function(request, parent, isMain) { // 1. 检查 Module._cache，是否缓存之中有指定模块 // 2. 如果缓存之中没有，就创建一个新的Module实例 // 3. 将它保存到缓存 // 4. 使用 module.load() 加载指定的模块文件， // 读取文件内容之后，使用 module.compile() 执行文件代码 // 5. 如果加载/解析过程报错，就从缓存删除该模块 // 6. 返回该模块的 module.exports}; 上面的第4步，采用module.compile()执行指定模块的脚本，逻辑如下。 123456Module.prototype._compile = function(content, filename) { // 1. 生成一个require函数，指向module.require // 2. 加载其他辅助方法到require // 3. 将文件内容放到一个函数之中，该函数可调用 require // 4. 执行该函数}; 上面的第1步和第2步，require函数及其辅助方法主要如下。 12345require(): 加载外部模块require.resolve()：将模块名解析到一个绝对路径require.main：指向主模块require.cache：指向所有缓存的模块require.extensions：根据文件的后缀名，调用不同的执行函数 循环加载 CommonJS CommonJS模块的重要特性是加载时执行，即脚本代码在require的时候，就会全部执行。一旦出现某个模块被”循环加载”，就只输出已经执行的部分，还未执行的部分不会输出。 让我们来看，Node官方文档里面的例子。脚本文件a.js代码如下。 12345exports.done = false;var b = require('./b.js');console.log('在 a.js 之中，b.done = %j', b.done);exports.done = true;console.log('a.js 执行完毕'); 上面代码之中，a.js脚本先输出一个done变量，然后加载另一个脚本文件b.js。注意，此时a.js代码就停在这里，等待b.js执行完毕，再往下执行。 再看b.js的代码。 12345exports.done = false;var a = require('./a.js');console.log('在 b.js 之中，a.done = %j', a.done);exports.done = true;console.log('b.js 执行完毕'); 上面代码之中，b.js执行到第二行，就会去加载a.js，这时，就发生了“循环加载”。系统会去a.js模块对应对象的exports属性取值，可是因为a.js还没有执行完，从exports属性只能取回已经执行的部分，而不是最后的值。 a.js已经执行的部分，只有一行。 1exports.done = false; 然后，b.js接着往下执行，等到全部执行完毕，再把执行权交还给a.js。于是，a.js接着往下执行，直到执行完毕。我们写一个脚本main.js，验证这个过程。 123var a = require('./a.js');var b = require('./b.js');console.log('在 main.js 之中, a.done=%j, b.done=%j', a.done, b.done); 执行main.js，运行结果如下。 123456$ node main.js在 b.js 之中，a.done = falseb.js 执行完毕在 a.js 之中，b.done = truea.js 执行完毕在 main.js 之中, a.done=true, b.done=true 上面的代码证明了两件事。一是，在b.js之中，a.js没有执行完毕，只执行了第一行。二是，main.js执行到第二行时，不会再次执行b.js，而是输出缓存的b.js的执行结果，即它的第四行。 1exports.done = true; ES6 ES6模块是动态引用，如果使用import从一个模块加载变量（即import foo from ‘foo’），那些变量不会被缓存，而是成为一个指向被加载模块的引用，需要开发者自己保证，真正取值的时候能够取到值。 请看下面这个例子。 12345678910// a.js如下import {bar} from './b.js';console.log('a.js');console.log(bar);export let foo = 'foo';// b.jsimport {foo} from './a.js';console.log('b.js');console.log(foo);export let bar = 'bar'; 上面代码中，a.js加载b.js，b.js又加载a.js，构成循环加载。执行a.js，结果如下。 12345$ babel-node a.jsb.jsundefineda.jsbar 上面代码中，由于a.js的第一行是加载b.js，所以先执行的是b.js。而b.js的第一行又是加载a.js，这时由于a.js已经开始执行了，所以不会重复执行，而是继续往下执行b.js，所以第一行输出的是b.js。接着，b.js要打印变量foo，这时a.js还没执行完，取不到foo的值，导致打印出来是undefined。b.js执行完，开始执行a.js，这时就一切正常了。]]></content>
</entry>
<entry>
<title><![CDATA[解析this的四种绑定规则]]></title>
<url>%2F2017%2F03%2F25%2F%E8%A7%A3%E6%9E%90this%E7%9A%84%E5%9B%9B%E7%A7%8D%E7%BB%91%E5%AE%9A%E8%A7%84%E5%88%99%2F</url>
<content type="text"><![CDATA[导语： 本文主要归纳总结自《你不知道的JavaScript上卷》中的关于this的解析。 this既不指向函数自身也不止像函数的词法作用域； this是在函数被调用时发生的绑定，它指向什么完全取决于函数在哪里被调用。 this的绑定和函数声明的位置没有任何关系，只取决于函数的调用。 this的四种绑定规则1.默认绑定function foo(){ console.log(this.a); } var a=2; foo(); // 输出2，原因：foo在全局作用域里被调用，所以this绑定的是全局作用域。 function foo(){ "use strict" console.log(this.a); } var a=2; foo(); // TypeError:this is undefined. 若使用严格模式，则不能将全局对象用于默认绑定，因此this会绑定到undefined。 function foo(){ console.log(this.a); } var a=2; (function(){ "use strict" foo(); //输出2。 })(); 在严格模式下调用foo()则不影响默认绑定。 function foo(){ console.log(this.a); } var a=2; (function(){ "use strict"; foo(); //输出2。 })(); 2.隐式绑定考虑：调用位置是否有上下文对象，或者是否被某个对象拥有或包含。 1–>隐式绑定 function foo(){ console.log(this.a); } var obj={ a:2, foo:foo } obj.foo(); // 输出2 原因:foo()再被调用的时候，前面加上了对obj的引用，当函数引用有上下文对象时，函数中的this会绑定上去。 var obj1={ a:42; obj:obj } obj1.obj.foo(); //输出2 原因：对象属性引用链中只有上一层或者说最后一层在调用位置中起作用。 2–>隐式丢失 function foo(){ console.log(this.a); } var obj={ a:2, foo:foo } var bar=obj.foo; var a="oops,global"; bar(); //输出oops,global 原因：虽然bar是obj.foo的一个引用，但实际它引用的是foo函数本身，因此bar()其实是一个不带任何修饰的函数调用，因此应用了默认绑定。 3–>回调函数丢失this绑定 function foo(){ console.log(this.a); } function doFoo(fn){ //fn其实引用的是foo fn(); } var obj={ a:2, foo:foo }; var a="oops,global"; doFoo(obj.foo); //输出"oops,global" 相当于fn=obj.foo;fn(); 参数传递其实就是一种隐式赋值，因此我们传入函数时也会被隐式赋值。 作为参数传入内置函数，也会发生隐式丢失 function foo(){ console.log(this.a); } var obj={ a:2, foo:foo }; var a="oops,global"; setTimeout(obj.foo,100);////输出"oops,global" 3.显示绑定使用call(..)和apply(..)，他们的第一个参数是一个对象，在调用函数时将其绑定到this。 1–>显示绑定 function foo(){ console.log(this.a); } var obj={ a:2 } foo.call(obj); //输出2 如果你传入一个原始值(字符串类型、布尔类型)来当做this的绑定对象，这个原始值会被转换成他的对象形式。称为“装箱”。 问题：显示绑定无法解决我们之前的丢失绑定问题？但显示绑定的变种——硬绑定可以解决。 2–>硬绑定 function foo(){ console.log(this.a); } var obj={ a:2 }; var bar=function(){ foo.call(obj); } bar();//输出2 setTimeout(bar,100);//输出2 //硬绑定的bar不可能再修改它的this bar.call(window);//输出2 硬绑定的典型应用场景就是创建一个包裹函数，负责接收参数并返回值； 3–>bind 由于硬绑定是一种非常常用的模式，所以ES5提供了内置的方法： Function.prototype.bind: function foo(something){ console.log(this.a,something); return this.a+something; } var obj={ a:2 }; var b=bar(3); console.log(b); 4.new绑定function foo(a){ this.a=a; } var bar=new foo(2); console.log(bar.a);//输出2 使用new来调用foo(…)时，我们会构造一个新对象并把它绑定到foo(…)调用中的this上。]]></content>
</entry>
<entry>
<title><![CDATA[Array.forEach用法总结]]></title>
<url>%2F2017%2F02%2F22%2FArray-forEach%E7%94%A8%E6%B3%95%E6%80%BB%E7%BB%93%2F</url>
<content type="text"><![CDATA[Javascript数组Array的forEach扩展方法 forEach是最常用到的数组扩展方法之一，相当于参数化循环数组，它简单的在数组的每一个元素上应用传入的函数，这也意味着只有存在的元素会被访问和处理。 如果我们用console.log替换处理函数，将可以得到另外的有趣结果： [1,2,3,”csser”].forEach(console.log); 123456789输出结果： 1, 0, Array[1, 2, 3, "csser"] 2, 1, Array[1, 2, 3, "csser"] 3, 2, Array[1, 2, 3, "csser"] csser, 3, Array[1, 2, 3, "csser"] 这里forEach函数每次调用console.log时会传入3个参数。显而易见，这3个参数分别是：当前项、当前项索引和数组本身, forEach是一个基本的数组高阶（higher-order）方法， 其语法定义为： array.forEach(callback[, thisObject]) 第一个参数我们已经知道了，它是一个拥有3个参数的函数，该函数将应用于数组的每一项。 而第二个参数表示上下文对象（context object）或者this值，用于指向回调函数的this引用。 这有时会挺有用，比如当我们想使用某个对象的方法作为forEach的处理函数时： 123456789101112 var database = { users: ["CSSer", "John", "David"], sendEmail: function (user) { if (this.isValidUser(user)) { /* 发送消息 */ } }, isValidUser: function (user) { /* 验证代码 */ } }; database.users.forEach(database.sendEmail,database); 简单分析下，在sendMail函数内部的this指向database对象，并且this.isValidUser指向必须的函数，如果我们不传入第二个参数，this值会被默认指向全局对象（在浏览器中是window）或者在strict模式下指向undefined。]]></content>
</entry>
</search>