资讯频道 → 编程语言
阅读更多

5顶
6踩

编程语言

转载新闻 JavaScript 装逼指南

2016-04-26 11:07 by 副主编 mengyidan1988 评论(2) 有9433人浏览
javascript
本文秉承着
引用
你看不懂是你sb，我写的代码就要牛逼

的理念来介绍一些js的装逼技巧。

下面的技巧，后三个，请谨慎用于团队项目中(主要考虑到可读性的问题)，不然，leader 干你没商量。



Boolean

这个技巧用的很IIFE

这个其实非常有实用价值，不算是装逼。只是其他语言里没有这么玩的，给不太了解js的同学看那可牛逼大了。

(function(arg) {
    // do something
})(arg)
实用价值在于可以防止全局污染。不过现在随着ES2015的普及已经没什么必要用这个了，我相信五年之后，这种写法就会逐渐没落。

自己干五年，在实习生面前装逼用也是蛮不错的嘛~多，也非常的简单 
!!'foo'

通过两个取反，可以强制转换为Boolean类型。较为常用。

Number

这个也特别简单，String转化为Number 
+'45'
+new Date

会自动转化为number类型的。较为常用。

Closure

闭包嘛，js特别好玩的一个地方。上面的立即执行函数就是对闭包的一种运用。

不了解的回去翻翻书，知乎上也有很多讨论，可以去看看。

闭包用起来对初学者来说简直就是大牛的标志(其实并不是)。 
var counter = function() {
    var count = 0
    return function() {
        return count++
    }
}

上面用到了闭包，看起来还挺装逼的吧。不过好像没什么实用价值。

那么这样呢？ 
var isType = function(type) {
    return function(obj) {
        return toString.call(obj) == '[Object ' + type + ']';
    }
}

通过高阶函数很轻松的实现判定类别。(别忘了有判定Array的Array.isArray())

当然，很明显，这只是基础，并不能更装逼一点。来看下一节

Event

事件响应前端肯定都写烂了，一般来说如何写一个计数器呢？ 
var times = 0
var foo = document.querySelector('.foo')
foo.addEventListener('click', function() {
    times++
    console.log(times)
}, false)

好像是没什么问题哦，但是！变量times为什么放在外面，就用了一次放在外面，命名冲突了怎么办，或者万一在外面修改了怎么办。

这个时候这样一个事件监听代码就比较牛逼了。 
foo.addEventListener('click', (function() {
    var times = 0
    return function() {
        times++
        console.log(times)
    }
})(), false)

怎么样，是不是立刻感觉不一样了。瞬间逼格高了起来！

通过创建一个闭包，把times封装到里面，然后返回函数。这个用法不太常见。
parseInt
引用
高能预警
从这里开始，下面的代码谨慎写到公司代码里！

parseInt这个函数太普通了，怎么能装逼。答案是~~

现在摁下F12，在console里复制粘贴这样的代码： 
~~3.14159
// => 3
~~5.678
// => 5

这个技巧十分装逼，原理是~是一个叫做按位非的操作，会返回数值的反码。是二进制操作。

原因在于JavaScript中的number都是double类型的，在位操作的时候要转化成int，两次~就还是原数。

Hex

十六进制操作。其实就是一个Array.prototype.toString(16)的用法

看到这个词脑袋里冒出的肯定是CSS的颜色。

做到随机的话可以这样 
(~~(Math.random()*(1<<24))).toString(16)

底下的原文链接非常建议去读一下，后三个技巧都是在那里学到的。

«

左移操作。这个操作特别叼。一般得玩 C 玩得多的，这个操作会懂一些。一般半路出家的前端码农可能不太了解(说的是我 ☹)。

这个也是二进制操作。将数值二进制左移

解释上面的1<<24的操作。

其实是1左移24位。000000000000000000000001左移24位，变成了1000000000000000000000000

不信？

试着在console粘贴下面的代码 
parseInt('1000000000000000000000000', 2) === (1 << 24)

其实还有一种更容易理解的方法来解释 
Math.pow(2,24) === (1 << 24)

因为是二进制操作，所以速度是很快的。

BTW 
[].forEach.call($$("*"),function(a){
    a.style.outline="1px solid #"+(~~(Math.random()*(1<<24))).toString(16)
})

翻译成正常语言就是这样的 
Array.prototype.forEach.call(document.querySelectorAll('*'), 
dom => dom.style.outline = `1px solid #${parseInt(Math.random() * Math.pow(2,24)).toString(16)}`)

Others

其他的，像是一些await, Decorators什么的。用上TypeScript基本就懂的东西我就不介绍了。

祝愿大家越玩越牛逼。

本文转自：annatarhe
  • 大小: 43 KB
来自: annatarhe
5
顶
6
踩
评论 共 2 条 请登录后发表评论
2 楼 tntxia 2016-05-02 10:22
有些真的没见人用过
1 楼 邪恶的正派 2016-04-26 16:38
菜鸟路过，谢谢分享

发表评论

您还没有登录,请您登录后再发表评论

相关推荐

  • 远程唤醒部分源代码

    远程唤醒的原理简介，实现部分的源代码，中间有关于AMd Magic Packet的英文解释。写远程唤醒网吧管理程序值得一读。

  • WOL远程唤醒（python实现）

    WOL（Wake On Lan）局域网唤醒：是一种远程唤醒技术，允许通过网络发送一个特殊的信号来远程唤醒局域网中的计算机。这个信号是通过一个特殊格式的数据包（通常称为“Magic Packet”或“WOL数据包”）发送的，正是由于绝大多数的现代网卡都支持在超低功耗下监听特定的报文，WOL技术才得以应用。WOL数据包是一个广播帧，包含目标计算机的MAC地址。

  • 远程唤醒

    生活工作中经常通过远程控制某台电脑，但是有些时候，我们想远程某个电脑却发现，电脑被断电或者关机了，此时必须的跑去开个机； 由各种百度，博客发现可以通过幻包远程进行唤醒：其电脑设置步骤此处省略，百度搜索远程唤醒即可找到，当然网上也有很多工具可以远程唤醒，由于楼主是学C#故发一下 远程唤醒的C#代码实现： using System;using System.Collections.Ge...

  • 计算机网络唤醒技术说明与实现

    网络唤醒是一种远程唤醒计算机的技术，也称为Wake-on-LAN (WOL)。它可以通过局域网内的其他设备向计算机发送唤醒信号，使得计算机从睡眠状态或者关机状态中被唤醒。网络唤醒通常需要满足以下条件：支持Wake-on-LAN功能的网卡：计算机的网卡需要支持Wake-on-LAN功能，这意味着网卡可以在待机状态下监听网络信号，并在接收到唤醒信号时将计算机唤醒。启用Wake-on-LAN功能：在计算机的BIOS设置中，需要启用Wake-on-LAN功能，以便于网卡在待机状态下仍能够监听网络信号。

  • 远程唤醒源代码 (转)

    远程唤醒源代码 (转)[@more@]//IPAddress: 除去网络号后的IP段全部补255 ,如 210.45.234.255// MacAddress : 6个字节的字符型数组，每块网卡都有一个物理地址，在Wind...

  • 远程开机的原理与代码实现

    继续聊一个无客户端的话题，很多机房管理软件中的常见的一个功能：远程开机，电脑是关闭就算电脑中安装了你客户端关机状态下也没有运行，是如何响应指令呢，肯定不是通过客户端了。 其实远程开机就是一种网络唤醒（Wakeup On LAN）绝大多数电脑的主板BIOS  都支持这项功能，如果BIOS 中没有开启则需要手工打开。电脑没有开机前网卡没有IP 地址，网络通讯时该如何发送数据？ 这里就要用到广播包，广

  • 网络唤醒的源码

    在vs2010下网络唤醒的源码，主要可以看看网络唤醒的报文格式,

  • PHP实现远程关机

    此代码比较简短，将它放在服务器上后，我们能够在其他地方登陆该页面（比如http://IP:Port/shutdown.php)，输入关机延时时间，可以设定多少秒后将服务器关机。另外也可以通过输入'cancel'命令来取消关机操作。适合出门在外想控制自己主机的人。

  • 等待与唤醒代码的实现

    该代码运用了Scanner和线程的匿名创建方式 import java.util.Scanner; public class Demo05WaitAndNotifi { public static void main(String[] args) { Scanner sc = new Scanner(System.in); System.out.println("你要吃什么包子"); String a = sc.next(); Object obj = new Object(); n

  • c# 网络唤醒局域网内Windows计算机（用mac地址）

    方法一： public void WakeUp(string macString) { try { if (macString.Split('-').Length == 6) { string macStr = macString.Replace('-', ' '); ; byte[] macByteArray = HexStringSToByteArr

  • 【超详细】Windows设置远程唤醒WOL+远程连接（远程开机）

    Windows设置远程唤醒（远程开机wol）免费路由器ddns设置、端口映射、远程连接、wol开机唤醒，超详细操作手册、避坑指南，希望对你有所帮助

  • WOL 实现命令。（Wake On LAN - 局域网唤醒）

    1 wakeonlan 00:11:22:33:44:55 2 正确的做法是，如果用wol，则需要指定向电脑所在的网段广播： /usr/bin/wol -i 192.168.1.255 40:8D:5C:1F:5D:18 3 如果用etherwake，需要指定电脑所在局域网的接口： /usr/bin/etherwake -i br-lan 40:8D:5C:1F:5D:18 ...

  • 关于H5唤醒APP的功能实现(千辛万苦啊!)

          首先，我是个后端，写java的，甚至不是搞移动端的，所以js这方面有点底子但不专业，对于出现的错误也请见谅，原来项目要求有个H5页面打开APP的功能就强行要做，没办法就想办法搞一下，网上的教程基本都是差不多套路，APP厂商也没有提供启动的接口之类的，只能从系统注册表考虑启动应用，所以这下面的代码都是基于你知道这个app的scheme_url和scheme_hosts是啥的基础上进行的。...

  • windows，远程开机，远程唤醒(WOL，Wake-on-LAN)

    寞水

  • 电脑启用远程唤醒

    我们通常要用TM或者远程连接访问家里或者办公室的电脑，但是电脑不可能一直处于打开状态，或者休眠状态，那么这个就能帮到你。 下面三个地方设置好了之后只需要在路由器中远程唤醒指定的PC你的电脑就会自动启动，这样，你就可以方便的远程到了。话不多说，下面就看看是那三个方面吧。 1. bios里面的设置 BIOS里面一般在高级电源管理里面有个PCI-E的选项，由于各大厂商的BIOS设置不...

  • 用QT实现Wake On Lan功能（附全部程序源码）

    Wake On Lan也就是远程唤醒（远程开机），即通过一台PC向另一台已经关机但仍连接电源PC发送网络数据包，使其开机的功能，前提是两台PC同处一个局域网内，且被唤醒方的网卡支持网络唤醒功能（现在网卡基本上都支持啦）。原理：PC关闭后，网卡仍能获取电源，一直监听“magic” packet到来，这种数据包可以是IP、IPX或者其它什么，其中封装了特制的字节序列，一旦收到这种数据包，通过网卡与

  • java实现电脑远程开机（网络唤醒）

    在设备管理器中找到 网卡设备，右键选择「属性」，然后在「电源管理」里面开启「允许此设备唤醒计算机」，然后在「高级」一栏里找到「关机网络唤醒」、「魔术封包唤醒」里设置成「开启」网络唤醒的原理：通过有线网卡执行开机操作，需要主板和网卡全都支持网络唤醒功能，被唤醒的计算机需要在同一局域网中，通过UDP广播的方式发送魔法包；注意，只有插网线的网卡才支持网络唤醒，wifi是无法远程开机的，蓝屏或死机属于非正常关机状态，不支持远程开机；

Global site tag (gtag.js) - Google Analytics