名字取的高大上,其实只是我平时上网浏览遇到的一些我感觉还不错的小题目,再加上我或者是我在网上找到的一些理解,就保存到这里了。
2019/4/2 最新开了个新坑,是一个javascipt30的一些案例,地址: https://www.cnblogs.com/wangxi01/p/10641115.html
1.
window.$ = HTMLElement.prototype.$ = function(selector) { var elems = (this == window ? document : this).querySelectorAll(selector); return elems == null ? null : elems.length == 1 ? elems[0] :elems; }
这里,首先HTMLElement.prototype.$这是原型继承中添加了一个$的属性,然后把他赋值给一个全局变量$;
后面这个匿名函数将来就是$的值,比如:写$('#id')其实就是相当于function('#id'),就是调用这个函数。
前面的我们就理解了,那个函数里面这一长串写的什么东西呢?
这是三元运算符,不过确实是有点长了,这个function里面是在调用js的querySelectorAll方法。判断先是document.querySelectorAll还是dom.querySelectorAll。
后面返回值是说如果查询出来是null则返回null,如果是一个dom,则返回这一个,如果是多个,则返回dom数组。
2.
console.log(([])?true:false); console.log(([]==false?true:false)); console.log(({}==false)?true:false)
此题考察类型转换,三元运算符先“分清是非”,再决定今后该走哪条路,“==”运算符比较“喜欢”Number类型。(我就不严谨地这么一说,若要刨根问底,请看《JavaScript权威指南》)
下面是题目的类型转换结果:
Boolean([]); //true Number([]); //0 Number({}); // NaN Number(false); //0
因此:
console.log(([])?true:fasle);// => console.log((true)?true:false); console.log([]==false?true:false); // => console.log(0==0?true:false); console.log(({}==false)?true:false); // => console.log((NaN==0)?true:false);
《JavaScript权威指南》的部分相关知识点
“==”运算符(两个操作数的类型不相同时)
-
如果一个值是null,另一个值是undefined,则它们相等
-
如果一个值是数字,另一个值是字符串,先将字符串转换为数学,然后使用转换后的值进行比较。
-
如果其中一个值是true,则将其转换为1再进行比较。如果其中的一个值是false,则将其转换为0再进行比较。
-
如果一个值是对象,另一个值是数字或字符串,则将对象转换为原始值,再进行比较。
对象到数字的转换
-
如果对象具有valueOf()方法,后者返回一个原始值,则JavaScript将这个原始值转换为数字(如果需要的话)并返回一个数字。
-
否则,如果对象具有toString()方法,后者返回一个原始值,则JavaScript将其转换并返回。(对象的toString()方法返回一个字符串直接量(作者所说的原始值),JavaScript将这个字符串转换为数字类型,并返回这个数字)。
-
否则,JavaScript抛出一个类型错误异常。
空数组转换为数字0
-
数组继承了默认的valueOf()方法,这个方法返回一个对象而不是一个原始值,因此,数组到数学的转换则调用toString()方法。空数组转换为空字符串,空字符串转换为数字0.