您的位置:首页 > Web前端 > JavaScript

有哪些短小却令人惊叹的 JavaScript 代码

2016-11-10 18:26 281 查看
之前在知乎上面看到的一些极其有意思的短小精悍的js代码,在这里做个记录:

1、JavaScript 错误处理的方式的正常姿势。

try{ something}catch(e){ window.location.href="http://stackoverflow.com/search?q=[js]+"+e.message;}

2、单行写一个评级组件:"★★★★★☆☆☆☆☆".slice(5 - rate, 10 - rate); 

3、为什么
++[[]][+[]]+[+[]] = 10?

4、这个正则表达式可以测质数……

function isPrime(n) {
return !(/^.?$|^(..+?)\1+$/).test('1'.repeat(n))
}


5、我给个最简单的:

1e3 => 1000

60e3 => 60000

经常用在 setTimeout 之类的地方,不用数零了。

另外,经常用 !! 将空/非空转化为真正的 bool 值,例如:

console.log("GC enabled?", !!global.gc)

我还有一个写 ES6 函数小习惯,

somePromise().then( _ = > doSomething() ),

其中 "_" 用来替代 somePromise().then( () = > doSomething() ) 的写法。括号多了很干扰,虽然凭空多声明了一个变量。

6、将n维数组破开成一维(string-array)

var foo0 =
[1,
[2, 3],
[4,
5, [6,7,[8]]],
[9],
10]; var foo1
= foo0.join(',').split(',');console.log(foo1);
//["1", "2", "3", "4", "5", "6", "7", "8", "9", "10"]

7、统计字符串中相同字符出现的次数。

var arr =
'abcdaabc';var
info = arr
.split('')
.reduce((p,
k) =>
(p[k]++
|| (p[k]
= 1),
p), {});console.log(info);
//{ a: 3, b: 2, c: 2, d: 1 }

8、getSelection=false;

前端写代码会检测一些变量判断浏览器是否有响应特性,然后做降级处理.尝试通过剪贴板赋值功能附带版权信息时,知乎的js会判断getSelection.所以我们可以在知乎的js脚本执行之前运行这行代码,假装自己是垃圾浏览器,从而不会被加入版权信息.

(7月17,知乎改代码了,所以要用下面不优雅的一段.)

var concatPre = Array.prototype.concat;
Array.prototype.concat = function (arg1) {
function checkExtra(arr){
return arr && arr.slice && arr[3] === "著作权归作者所有,转载请联系作者获得授权。";
}
if (checkExtra(this)||checkExtra(arg1)) {
return [];
} else {
return concatPre.apply(this, arguments);
}
};


另外附赠一段

var tipStyle="color: white;font-size: 22px;display: inline-block;position: absolute;top: 0;bottom: 0;line-height: 22px;margin: auto;height: 22px;";
$(".zu-top").append($("<span style='"+tipStyle+"left: 10px;"+"'>"+decodeURI("%E6%B0%91%E4%B8%BB")+"</span>")).append($("<span style='"+tipStyle+"right: 10px;"+"'>"+decodeURI("%E8%87%AA%E7%94%B1")+"</span>"));


9、生成6位的数字验证码
console.log(('000000' + Math.floor(Math.random() * 999999)).slice(-6));

10、再补充一个 大/小驼峰命名转下划线/连接符命名

'componentMapModelRegistry'.match(/^[a-z][a-z0-9]+|[A-Z][a-z0-9]*/g).join('_').toLowerCase();
// component_map_model_registry


11、'?key1=value1&key2=value2' 转换成json

<span style="font-size:18px;">export const query = (search = '') => ((querystring = '') => (q => (querystring.split('&').forEach(item => (kv => kv[0] && (q[kv[0]] = kv[1]))(item.split('='))), q))({}))(search.split('?')[1]);</span>


个人觉得第9,10,11个还是比较实用的,其他的可能更偏向于趣味性。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: