JavaScript的漂亮的代码片段


Posted in Javascript onJune 05, 2013

 动态构建正则表达式

 new RegExp( Expr.match[ type ].source + (/(?![^\[]*\])(?![^\(]*\))/.source) )

来自sizzle,动态构建正则时,这样做避免了字符转义。

更灵活和巧妙的数字补零

function prefixInteger(num, length) {
    return (num / Math.pow(10, length)).toFixed(length).substr(2);
}

 取数组的最大和最小值

Math.max.apply(Math, [1,2,3]) //3
Math.min.apply(Math, [1,2,3]) //1

产生漂亮的随机字符串

Math.random().toString(16).substring(2); //8位
Math.random().toString(36).substring(2); //16位

 获取时间戳

相对于
var timeStamp = (new Date).getTime();
如下方式更方便:

var timeStamp = Number(new Date);

 转换为数值并取整

var result = '3.1415926' | 0; // 3

字符串格式化

function format(format) {
    if (!FB.String.format._formatRE) {
      FB.String.format._formatRE = /(\{[^\}^\{]+\})/g;
    }
    var values = arguments;
    return format.replace(
      FB.String.format._formatRE,
      function(str, m) {
        var
          index = parseInt(m.substr(1), 10),
          value = values[index + 1];
        if (value === null || value === undefined) {
          return '';
        }
        return value.toString();
      }
    );
  }

  使用:
format('{0}.facebook.com/{1}', 'www', 'login.php'); 
//-> www.facebook.com/login.php

交换两个变量的值

var foo = 1;
var bar = 2;
foo = [bar, bar=foo][0];

RegExp Looping

String.prototype.format = function ( /* args */ ) {
  var args = arguments;
  return this.replace( 
     /\{(\d+)\}/g, 
     function (full, idx) {
         return args[idx];
     } )
}
'Hello {0}, How{1}'.format( 'Bob', ' you doin');
// => Hello Bob, How you doinhttp://mazesoul.github.com/Readability_idioms_and_compression_tolerance/#31.0

定义即运行函数

( function() {
// do something
} )();

这确实是最简单的技巧,但也是最实用的技巧。 奠定了JavaScript封装的基础。

三元运算

var some = con1 ? val1 :
           con2 ? val2 :
           con3 ? val3 :
           defaultVal;

一种函数注册-调用机制

来自CKEditor,我做了提取。

( function() {
var fns = [];
// 将可用下标访问属性的对象转换成数组
// 注意,IE下DOMNodeList会失败
function toArray( arrayLike, index ) {
 return Array.prototype.slice.call( arrayLike, index || 0 ); 
}
window.Util = {
 'addFunction' : function( fn, scope ) {
  return fns.push( function(){
   return fn.apply( scope || window, arguments );
  } ) - 1;
 },
 'removeFunction' : function( index ) {
  fns[ index ] = null;
 },
 'callFunction' : function( index ) {
  var fn = fns[ index ];
  return fn && fn.apply( window, toArray( arguments, 1 ) );
 }
};
} )();
// 应用场景
var fnId;
// 在闭包中,添加一个可供全局调用的函数
( function() {
 fnId = Util.addFunction( function( msg ) {
  alert( msg );
 } );
} )();
// 调用
Util.callFunction( fnId, 'Hello, World' ); //-> 'Hello,World';

短路运算

var something = 'xxxx';
console.log( true && something ); //-> 'xxx';
console.log( false && something ); //-> false
console.log( true || something );  // -> true
console.log( false || something );  //-> something
Javascript 相关文章推荐
Ext grid 添加右击菜单
Nov 26 Javascript
js计算精度问题小结
Apr 22 Javascript
jquery控制select的text/value值为选中状态
Jun 03 Javascript
jquery结合CSS使用validate实现漂亮的验证
Jan 29 Javascript
Spring Boot+AngularJS+BootStrap实现进度条示例代码
Mar 02 Javascript
Bootstrap栅格系统简单实现代码
Mar 06 Javascript
微信小程序教程系列之新建页面(4)
Apr 17 Javascript
Easyui Datagrid自定义按钮列(最后面的操作列)
Jul 13 Javascript
ES6学习教程之对象字面量详解
Oct 09 Javascript
浅谈es6语法 (Proxy和Reflect的对比)
Oct 24 Javascript
详解ES6中的 Set Map 数据结构学习总结
Nov 06 Javascript
利用angular自动编译andriod APK的绕坑经历分享
Mar 08 Javascript
Javascript中的for in循环和hasOwnProperty结合使用
Jun 05 #Javascript
理解JAVASCRIPT中hasOwnProperty()的作用
Jun 05 #Javascript
jquery 面包屑导航 具体实现
Jun 05 #Javascript
JSCode all of Brower 全局屏蔽网页右键功能 具体实现
Jun 05 #Javascript
js 获取后台的字段 改变 checkbox的被选中的状态 代码
Jun 05 #Javascript
JQuery AJAX 中文乱码问题解决
Jun 05 #Javascript
Javascript自定义排序 node运行 实例
Jun 05 #Javascript
You might like
php文字水印和php图片水印实现代码(二种加水印方法)
2013/12/25 PHP
百度实时推送api接口应用示例
2014/10/21 PHP
最新制作ThinkPHP3.2.3完全开发手册
2015/11/23 PHP
PHP生成图片验证码功能示例
2017/01/12 PHP
php str_getcsv把字符串解析为数组的实现方法
2017/04/05 PHP
用js解决数字不能换行问题
2010/08/10 Javascript
IE和Firefox的Javascript兼容性总结[推荐收藏]
2011/10/19 Javascript
编写针对IE的JS代码两种编写方法
2013/01/30 Javascript
jquery 选取方法都有哪些
2014/05/18 Javascript
教你用jquery实现iframe自适应高度
2014/06/11 Javascript
使用delegate方法为一个tr标签加一个链接
2014/06/27 Javascript
jQuery 实现自动填充邮箱功能(带下拉提示)
2014/10/14 Javascript
微信企业号开发之微信考勤Cookies的使用
2015/09/11 Javascript
整理JavaScript创建对象的八种方法
2015/11/03 Javascript
分享javascript、jquery实用代码段
2016/10/20 Javascript
JavaScript中的编码和解码函数
2017/02/15 Javascript
vue如何实现observer和watcher源码解析
2017/03/09 Javascript
解决vue bus.$emit触发第一次$on监听不到问题
2020/07/28 Javascript
简单介绍Ruby中的CGI编程
2015/04/10 Python
python3 与python2 异常处理的区别与联系
2016/06/19 Python
python实现支付宝当面付(扫码支付)功能
2018/05/30 Python
Python实现爬虫抓取与读写、追加到excel文件操作示例
2018/06/27 Python
解决django中ModelForm多表单组合的问题
2019/07/18 Python
python [:3] 实现提取数组中的数
2019/11/27 Python
使用python 的matplotlib 画轨道实例
2020/01/19 Python
python GUI库图形界面开发之PyQt5单行文本框控件QLineEdit详细使用方法与实例
2020/02/27 Python
pycharm 配置svn的图文教程(手把手教你)
2021/01/15 Python
IE9下html5初试小刀
2010/09/21 HTML / CSS
HTML5 Canvas 实现K线图的示例代码
2019/12/23 HTML / CSS
法院先进个人事迹材料
2014/05/04 职场文书
家具商场的活动方案
2014/08/16 职场文书
工商局副局长个人对照检查材料
2014/09/25 职场文书
预备党员考察表党小组意见
2015/06/01 职场文书
《去年的树》教学反思
2016/02/18 职场文书
2019脱贫攻坚工作总结报告范本!
2019/08/06 职场文书
陶瓷类经典广告语集锦
2019/10/25 职场文书