you dont known js - trick && skill

[xiaohesong]

这里记录一些you don't know js提出的一些小细节，小技巧。

章： types&&grammer 点击查看此章各小节

values

• isNaN
  测试传入的东西要么不是number，要么是number。但是这样是严谨的吗？

var a = 2 / "foo";
var b = "foo";

a; // NaN
b; // "foo"

window.isNaN( a ); // true
window.isNaN( b ); // true -- ouch!

"foo"实际上不是一个number，但它绝对不是NaN值！
显然，这是不合理的，foo并不是一个NaN。所以es6添加了Number.isNaN, 就是对这个问题(bug)的补充。

if (!Number.isNaN) {
	Number.isNaN = function(n) {
		return (
			typeof n === "number" &&
			window.isNaN( n )
		);
	};
}

var a = 2 / "foo";
var b = "foo";

Number.isNaN( a ); // true
Number.isNaN( b ); // false -- phew!

可以发现，首先确认他是不是数字类型，然后再进行isNaN判断。

Coercion, 点击查看详细内容

• ~

const arr = ['ni', 'wo', 'ta']
//使用~之前
if(arr.indexOf('js') === -1){
  //不存在
}
//使用~之后
if(!~arr.indexOf('js')){
  //不存在
}

记住: ~操作符类似于-(x + 1)

grammer 点击查看详细内容

• ||和&&优先级

先自己问自己一把，||和&&的哪个优先级更高？
在很长一段时间里，我认为这两个优先级是一样的，实则不然。
看下面代码：

false && true || true // ??
(false && true) || true // ??

通过上面的例子，我想你可以知道优先级高低的答案了。
当然，你可以参考MDN - Operator Precedence

考虑下面这个例子会输出什么？

var a = 42;
var b = "foo";
var c = false;

var d = a && b || c ? c || b ? a : c && b : a;

d;		// ??

上面例子具体的可以看这里 运算符优先级问题

章：scope&&closures 点击查看各小节

what is scope 点击查看详细内容

ReferenceError和TypeError的区别：

• ReferenceError
  这个是作用域解析失败相关而抛出的异常

• TypeError
  作用域解析成功，但试图对结果执行非法/不可能的操作。

lexical scope 点击查看详细内容

• eval

  他会修改现有的词法作用域(非严格模式)

   function run(str){
       eval(str)
        console.log(yourName)
   }
   run("var yourName = 'xhs'")

  然后你可以在里面试试严格模式。

• with
  创建一个 全新的词法作用域

  function foo(obj) {
  	with (obj) {
  		a = 2;
  	}
  }
  
  var o1 = {
  	a: 3
  };
  
  var o2 = {
  	b: 3
  };
  
  foo( o1 );
  console.log( o1.a ); // 2
  
  foo( o2 );
  console.log( o2.a ); // undefined
  console.log( a ); // 2 -- Oops, leaked global!

  可以看见，LHS查找不存在，就直接到了上一层。

章：this&object prototypes 点击查看此章各小节

this指向, 点击查看详细内容

• 默认绑定 🛫
• 隐式绑定 🛩
• 显示绑定🛩
• new绑定🛩
  绑定关系是按照上面依次增强 🛩

Objects 点击查看详细内容

• property
  对于熟悉描述，在之前有做过小小的对象属性总结。
  这里说下enumerable 是啥：就是在迭代(循环遍历)中包含。
  可以检查是否为enumerable,在对象属性总结那里有提到，现在来说下另外一个方法propertyIsEnumerable 。

var myObject = { };

Object.defineProperty(
	myObject,
	"a",
	{ enumerable: false, value: 2 }
);
myObject.propertyIsEnumerable( "a" ); // false

propertyIsEnumerable(..)测试给定的属性名称是否 直接 存在于对象上，并且也是enumerable:true。

Prototypes 点击查看详细内容

a instanceof Foo; // true

• instanceof的意思：在a的整个[[Prototype]]链中，Foo.prototype任意指向的对象有没有出现?

Foo.prototype.isPrototypeOf( a ); // true

• isPrototypeOf(..)的意思是: 在a整个[[Prototype]]链中，Foo.prototype有没有出现？

isPrototypeOf的实现如下：

function isRelatedTo(o1, o2) {
	function F(){}
	F.prototype = o2;
	return o1 instanceof F;
}

var a = {};
var b = Object.create( a );

isRelatedTo( b, a ); // true