JS/TS和CSS的零散知识汇总

JS try catch

catch中抛出异常会影响finally么?不会。

tryreturn function()function中抛出的异常会被try捕获么?不会。

TS enum

如何编写enum才能让编译后的js文件也可以访问呢?答案超简单,去掉const关键字

1
2
3
4
5
6
7
8
export const enum E{
// ... 编译后访问 E.xxx
// Cannot read property 'xxx' of undefined
}

export enum E{
// ... 编译后可以正常访问 E.xxx
}

无符号右移

d >>> 0操作将d视作二进制存储的无符号数,然后再移动,会发生一次隐式类型转换

1
2
3
4
5
6
let d = -5
console.log(d)
// -5 = b11111111111111111111111111111011 as int
d = d >>> 0
console.log(d)
// 4294967291 = b11111111111111111111111111111011 as uint

所以可以写这么一个黑科技函数,用来强制类型转换

1
2
3
function int2uint(d){
return d >>> 0
}

Object.create(null)

使用Object.create(null)的原因

很多框架源码作者使用它来初始化一个新的对象,难道是最佳实践?

  1. 通过Object.create(null)创建出来的对象,没有任何属性,显示No properties。我们可以将其当成一个干净的 map 来使用,自主定义 toString,hasOwnProperty等方法,并且不必担心将原型链上的同名方法被覆盖。
  2. {...}创建的对象,使用for in遍历对象的时候,会遍历原型链上的属性,带来性能上的损耗。使用Object.create(null)则不必再对其进行遍历了。

框架源码对性能的要求,哪怕是一点点,都值得关注。

原文

CSS ellipsis

用以下css可以为超长的文字添加省略号标记。前提是文字确实可以overflow。

1
2
3
4
5
.ellipsis{
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}

用以下方法可以检测文字是否超长

1
2
3
function isOverflow (el) {
return el.clientWidth < el.scrollWidth
}