JavaScript装逼指南

如何写JavaScript才能逼格更高呢?怎样才能组织JavaScript才能让别人一眼看出你不简单呢?是否很期待别人在看完你的代码之后感叹一句“原来还可以这样写”呢?下面列出一些在JavaScript时的装逼技巧。

1. 匿名函数的N种写法

你知道“茴”的四种写法吗?ε=(?д?`*)??… 扯淡,但你或许不知道匿名函数的好几种写法。一般情况下写匿名函数是这样的:

(function(){})();

但下面几种写法也是可以的:

  • !function(){}();
  • +function(){}();
  • -function(){}();
  • ~function(){}();
  • ~(function(){})();
  • void function(){}();
  • (function(){}());

其实细看可以看出规律,因为 +-!~ 这些具有极高的优先级,所以右边的函数声明加上括号的部分(实际上就是函数执行的写法)就直接执行了。当然,这样的写法,没有什么区别,纯粹看装逼程度。

2. 另外一种undefined

从来不需要声明一个变量的值是undefined,因为JavaScript会自动把一个未赋值的变量置为undefined。所有如果你在代码里这么写,会被鄙视的:

var data = undefined;

但是如果你就是强迫症发作,一定要再声明一个暂时没有值的变量的时候赋上一个undefined。那你可以考虑这么做:

 var data = void 0; // undefined

void在JavaScript中是一个操作符,对传入的操作不执行并且返回undefined。void后面可以跟 () 来用,例如 void(0) ,看起来是不是很熟悉?没错,在HTML里阻止带href的默认点击操作时,都喜欢把href写成 javascript:void(0) ,实际上也是依靠void操作不执行的意思。

当然,除了出于装逼的原因外,实际用途上不太赞成使用void,因为void的出现是为了兼容早起ECMAScript标准中没有undefined属性。 void 0 的写法让代码晦涩难懂。

3. 抛弃你的if和else

当JS代码里有大量的条件逻辑判断时,那代码看起来多可怕:

if () {
  // ...
} else if () {
  // ...
} else if () {
  // ...
} else {
  // ...
}

不用我说你都猜到用什么语法来简化if-else了。没错,用 || 和 && ,很简单的原理就不用说啦。值得一提的是,有时候用 !! 操作符也能简化if-else模式。例如这样:

// 普通的if-else模式
var isValid = false;
if (value && value !== ‘error‘) {
    isValid = true;
}
// 使用!!符号
var isValid = !!(value && value !== ‘error‘);

“!”是取反操作,两个“!”自然是负负得正了。

4. 不加分号

关于JavaScript要不要加分号的争论已经吵了好几年。Google的JavaScript语法指南告诉我们要加分号,很多JavaScript语法书籍也告诉我们加上分号更安全。然而,分号加不加,全靠个人对代码的写法,你确信写得足够安全的话,不加分号显得更加高大上。

5. 赶上ES6的早班车

ES6即将在年底正式发布,赶时髦的开发者们,赶快在自己的代码里用起来。用上module声明,写写class,捣鼓一下Map,这些都会让你的代码逼格更高。神马?你都不会用?那也好歹在代码头部加上一个ES5的 "use strict"; 呀。

6. 添加AMD模块支持

给你写的代码声明一下AMD模块规范,这样别人就可以直接通过AMD的规范来加载你的模块了,如果别人没有通过规范来加载你的模块,你也可以优雅地返回一个常规的全局对象。来看看jQueryUI的写法:

(function( factory ) {
  if ( typeof define === "function" && define.amd ) {
    // AMD. Register as an anonymous module.
    define( [ "jquery" ], factory );
  } else {
    // Browser globals
    factory( jQuery );
  }
}(function( $ ) {
  // 这里放模块代码
  return $.widget;
}));

就用它来包裹你的实际代码吧,保证别人一看代码就知道你是个专业的开发者。

7. Function构造函数

很多JavaScript教程都告诉我们,不要直接用内置对象的构造函数来创建基本变量,例如 var arr = new Array(2); 的写法就应该用 var arr = [1, 2]; 的写法来取代。但是,Function构造函数(注意是大写的Function)有点特别。Function构造函数接受的参数中,第一个是要传入的参数名,第二个是函数内的代码(用字符串来表示)。

var f = new Function(‘a‘, ‘alert(a)‘);
f(‘test‘); // 将会弹出窗口显示test

或许大家疑惑了,你这样绕着写,跟 function f(a) {alert(a);} 比有什么好处呢? 
事实上在某种情况下是有好处的,比如不能用eval的时候,你需要传入字符串内容来创建一个函数的时候。在一些JavaScript模板语言的解析,和字符串转换json对象的时候比较实用。

8. 用原生Dom接口不用jQuery

一个傲娇的前端工程师是不需要jQuery的,前提是你经得起折腾。实际上,几乎所有的jQuery方法都可以用同样的Dom原生接口来实现,因为这货本来就是用原生接口实现的嘛,哈哈。怎样做到不用jQuery(也叫jQuery-free)呢?阮老师的博文 《如何做到 jQuery-free?》 给我们很好的讲解了做法。依赖于querySelector和querySelectorAll这两个现代浏览器的接口,可以实现跟jQuery同样方便和同样效率的Dom查找,而且其他的类似Ajax和CSS的接口同样也可以把原生方法做一些兼容方面的包装即可做到jQuery-free。

总结

上述所有的JavaScript装逼写法,一些是为了程序易懂或者效率提高的语法糖,这样的做法是比较可取的,比如前面所说的省略if-else的做法;而有些写法则容易造成代码晦涩难懂或者效率偏低,例如上面说的 void 0 的写法,实际上不可取。JavaScript语法上灵活,让大家对同一个功能有很多种不同的写法,写法上的优化是对程序结构和代码维护有很大帮助的。所以,装逼得装得好看。

时间: 2024-07-29 11:59:36

JavaScript装逼指南的相关文章

JavaScript 装逼指南

Summary 本文秉承着 你看不懂是你sb,我写的代码就要牛逼 的理念来介绍一些js的装逼技巧. 下面的技巧,后三个,请谨慎用于团队项目中(主要考虑到可读性的问题),不然,leader 干你没商量. Boolean 这个技巧用的很多,也非常的简单 !!'fuck' 通过两个取反,可以强制转换为Boolean类型.较为常用. Number 这个也特别简单,String转化为Number +'45' +new Date 会自动转化为number类型的.较为常用. IIFE 这个其实非常有实用价值,

【转】这些JavaScript编程黑科技,装逼指南,高逼格代码,让你惊叹不已

[转]这些JavaScript编程黑科技,装逼指南,高逼格代码,让你惊叹不已 Javascript是一门很吊的语言,我可能学了假的JavaScript,哈哈,大家还有什么推荐的 本文秉承着:你看不懂是你SB,我写的代码就要牛逼. 1.单行写一个评级组件 "★★★★★☆☆☆☆☆".slice(5 - rate, 10 - rate);定义一个变量rate是1到5的值,然后执行上面代码,看图 才发现插件什么的都弱爆了 2.如何装逼用代码骂别人SB (!(~+[])+{})[--[~+&qu

程序员装逼指南(转)

程序员嘛,外行人看起来已经是不可理解的奇怪生物了,自然也没必要跟他们再装逼 所以呢,如何对其他程序员装逼就是一门很有学问的事了 ---------------------------------------------------- 一.准备工作 "工欲善其事必先利其器." 1.电脑不一定要配置高,但是双屏是必须的,越大越好,能一个横屏一个竖屏更好.一个用来查资料,一个用来写代码.总之要显得信息量很大,效率很高. 2.椅子不一定要舒服,但是一定要可以半躺着. 3.大量的便签,各种的颜色

产品经理装逼指南

参考程序员装逼指南于是发了一个PM版. 一.准备工作 “工欲善其事必先利其器.” 1.电脑一定要是Mac的,apple的logo能遮住就遮住,千万不能用有线鼠标. 2.椅子不一定要舒服,但是一定要可以半躺着. 3.大量的便签,各种的颜色的,用来记录每天要完成的事务,多多益善.沿着电脑屏幕的边框,尽量贴满,显出有很多事情的样子. 4.工具书,工业设计,心理学,人性的弱点什么的都可以,能英文就英文,不行影印版的也可以,反正越厚越好,而且千万不要放在书架上,一定要堆在桌上,半打开状. 二.从进门开始

程序员装逼指南

一.准备工作 “工欲善其事必先利其器.”1.电脑不一定要配置高,但是双屏是必须的,越大越好,能一个横屏一个竖屏更好.一个用来查资料,一个用来写代码 .总之要显得信息量很大,效率很高.2.椅子不一定要舒服,但是一定要可以半躺着.3.大量的便签,各种的颜色的,用来记录每天要完成的事务,多多益善.沿着电脑屏幕的边框,尽量贴满,显出有很多事情的样子.4.工具书,orelly的,机械工业,电子工业什么的都可以,能英文就英文,不行影印版的也可以,反正越厚越好,而且千万不要放在书架上,一定要堆在桌上,半打开状

processon完全装逼指南

一.引言 作为一名IT从业者,不仅要有扎实的知识储备,出色的业务能力,还需要具备一定的软实力.软实力体现在具体事务的处理能力,包括沟通,协作,团队领导,问题的解决方案等,这些能力在关键时刻比硬性的技术水平更能体现一名工程师的价值,它决定了IT职业生涯的高度和视野. 而本文所分享的绘图能力,与其说是软实力,不妨说是基本功.无论从事的是开发.运维.通信,甚至产品经理,交互设计.运营这些有交集的岗位,都会在工作中用到.因为在计算机的世界里,大多数场景都是抽象的,当我们在描述他们的时候,一定是通过其实现

python 装逼指南(一)

咳咳~~ python是个有趣的东西,那我就来分享一下使用过程中遇到的有趣的事情吧~~ 记得有一次在跟客户的交流中,正看着PPT,然后需要计算一些东西,本人用的操作系统是linuxmint,于是乎我打开黑漆漆的终端,敲入python 然后3231+900+1450*3..... 客户立马惊奇的问,这是什么玩意儿?这么强! 我呵呵~~

位运算装逼指南

今天的这篇文章,算是一种补充,同时会列举一些常见的算法题,如何用这些技巧来解决,通过使用这些方法,可以让一些算法题变的更加简单. 1.用 n & (n - 1)消去 n 最后的一位 1 在 n 的二进制表示中,如果我们对 n 执行 n = n & (n - 1) 那么可以把 n 左右边的 1 消除掉,例如 n = 1001 n - 1 = 1000 n = n & (n - 1) = (1001) & (1000) = 1000 复制代码 这个公式有哪些用处呢? 其实还是有

教你如何塑造JavaScript牛逼形象

如何写JavaScript才能逼格更高呢?怎样才能组织JavaScript才能让别人一眼看出你不简单呢?是否很期待别人在看完你的代码之后感叹一句“原来还可以这样写”呢?下面列出一些在JavaScript时的装逼技巧. 1. 匿名函数的N种写法 你知道“茴”的四种写法吗?ε=(?д?`*)??… 扯淡,但你或许不知道匿名函数的好几种写法.一般情况下写匿名函数是这样的: (function(){})(); 复制代码 但下面几种写法也是可以的: !function(){}(); +function()