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 相关文章推荐
JS动态添加option和删除option(附实例代码)
Apr 01 Javascript
javascript记录文本框内文字个数检测文字个数变化
Oct 14 Javascript
详解AngularJS中自定义指令的使用
Jun 17 Javascript
jquery实现二级导航下拉菜单效果
Dec 18 Javascript
javascript实现随机显示星星特效
Jan 28 Javascript
js点击按钮实现水波纹效果代码(CSS3和Canves)
Sep 15 Javascript
jQuery实现在新增加的元素上添加事件方法案例分析
Feb 09 Javascript
微信小程序 ES6Promise.all批量上传文件实现代码
Apr 14 Javascript
vue.js默认路由不加载linkActiveClass问题的解决方法
Dec 11 Javascript
JavaScript基于对象方法实现数组去重及排序操作示例
Jul 10 Javascript
JavaScript实现手机号码 3-4-4格式并控制新增和删除时光标的位置
Jun 02 Javascript
JS实现鼠标按下拖拽效果
Jul 23 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
饭制《星际争霸》Mod:优化游戏机制 增加新单位
2017/07/02 星际争霸
收音机发烧友应当熟知的100条知识
2021/03/02 无线电
php使用flock阻塞写入文件和非阻塞写入文件的实例讲解
2017/07/10 PHP
PHP实现执行外部程序的方法详解
2017/08/17 PHP
Yii框架安装简明教程
2020/05/15 PHP
基于JQuery的简单实现折叠菜单代码
2010/09/15 Javascript
修改jQuery Validation里默认的验证方法
2012/02/14 Javascript
图片动画横条广告带上下滚动的JS代码
2013/10/25 Javascript
js格式化时间小结
2014/11/03 Javascript
使用正则表达式的格式化与高亮显示json字符串
2014/12/03 Javascript
ztree获取当前选中节点子节点id集合的方法
2015/02/12 Javascript
Jquery使用css方法改变样式实例
2015/05/18 Javascript
使用AngularJS制作一个简单的RSS阅读器的教程
2015/06/18 Javascript
jQuery实现动画效果circle实例
2015/08/06 Javascript
JS二叉树的简单实现方法示例
2017/04/05 Javascript
微信小程序canvas.drawImage完全显示图片问题的解决
2018/11/30 Javascript
vue实现div单选多选功能
2020/07/16 Javascript
[01:15:44]首部DOTA2纪录片今日23时全网上映
2014/03/19 DOTA
[03:48]DOTA2完美大师赛主赛事第二日精彩集锦
2017/11/24 DOTA
Python版的文曲星猜数字游戏代码
2013/09/02 Python
python通过装饰器检查函数参数数据类型的方法
2015/03/13 Python
Python实现把json格式转换成文本或sql文件
2015/07/10 Python
python中函数传参详解
2016/07/03 Python
Python实现SMTP发送邮件详细教程
2021/03/02 Python
Python 中的with关键字使用详解
2016/09/11 Python
Python计算指定日期是今年的第几天(三种方法)
2020/03/26 Python
突袭HTML5之Javascript API扩展3—本地存储全新体验
2013/01/31 HTML / CSS
html5 canvas合成海报所遇问题及解决方案总结
2017/08/03 HTML / CSS
浅谈HTML5 FileReader分布读取文件以及其方法简介
2017/11/09 HTML / CSS
澳大利亚最受欢迎的超级商场每日优惠:Catch
2020/11/17 全球购物
《云雀的心愿》教学反思
2014/02/25 职场文书
青年志愿者先进事迹
2014/05/06 职场文书
公司总经理任命书
2014/06/05 职场文书
领导班子整改方案
2014/10/25 职场文书
在职人员跳槽求职信
2015/03/20 职场文书
Python&Matlab实现灰狼优化算法的示例代码
2022/03/21 Python