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 相关文章推荐
javascript 兼容鼠标滚轮事件
Apr 07 Javascript
解析JavaScript中delete操作符不能删除的对象
Dec 03 Javascript
javascript定义变量时有var和没有var的区别探讨
Jul 21 Javascript
js实现DOM走马灯特效的方法
Jan 21 Javascript
IE浏览器下PNG相关功能
Jul 05 Javascript
详解用node编写自己的cli工具
May 23 Javascript
vue2.0的contextmenu右键弹出菜单的实例代码
Jul 24 Javascript
VSCode配置react开发环境的步骤
Dec 27 Javascript
vue实现文章内容过长点击阅读全文功能的实例
Dec 28 Javascript
一文快速详解前端框架 Vue 最强大的功能
May 21 Javascript
关于layui的动态图标不显示的解决方法
Sep 04 Javascript
在react项目中使用antd的form组件,动态设置input框的值
Oct 24 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
Session的工作方式
2006/10/09 PHP
PHP生成带有雪花背景的验证码
2008/09/28 PHP
PHP数据库操作Helper类完整实例
2016/05/11 PHP
[原创]来自ImageSee官方 JavaScript图片浏览器
2008/01/16 Javascript
js 无提示关闭浏览器页面的代码
2010/03/09 Javascript
简单js代码实现selece二级联动(推荐)
2014/02/18 Javascript
node.js中的fs.rmdirSync方法使用说明
2014/12/16 Javascript
实例代码详解javascript实现窗口抖动及qq窗口抖动
2016/01/04 Javascript
复杂的javascript窗口分帧解析
2016/02/19 Javascript
vue实现图书管理demo详解
2017/10/17 Javascript
vue 2.5.1 源码学习 之Vue.extend 和 data的合并策略
2019/06/04 Javascript
解决vue单页面应用打包后相对路径、绝对路径相关问题
2020/08/14 Javascript
Element el-button 按钮组件的使用详解
2021/02/01 Javascript
ajax jquery实现页面某一个div的刷新效果
2021/03/04 jQuery
python使用正则表达式提取网页URL的方法
2015/05/26 Python
python实现八大排序算法(2)
2017/09/14 Python
Python实现备份MySQL数据库的方法示例
2018/01/11 Python
Python实现的文本对比报告生成工具示例
2018/05/22 Python
python pandas实现excel转为html格式的方法
2018/10/23 Python
Django中使用 Closure Table 储存无限分级数据
2019/06/06 Python
关于pytorch处理类别不平衡的问题
2019/12/31 Python
Python warning警告出现的原因及忽略方法
2020/01/31 Python
python turtle工具绘制四叶草的实例分享
2020/02/14 Python
使用CSS3的appearance属性改变元素的外观的方法
2015/12/12 HTML / CSS
canvas画图被放大且模糊的解决方法
2020/08/11 HTML / CSS
Hotels.com台湾:饭店订房网
2017/09/06 全球购物
美国综合购物商城:UnbeatableSale.com
2018/11/28 全球购物
在weblogic中发布ejb需涉及到哪些配置文件
2012/01/17 面试题
学校安全工作制度
2014/01/19 职场文书
小学生自我评价范文
2014/01/25 职场文书
函授毕业自我鉴定
2014/02/04 职场文书
大专生毕业的自我评价
2014/02/06 职场文书
2014年煤矿安全工作总结
2014/12/04 职场文书
2015年教研工作总结
2015/05/23 职场文书
六一活动主持词
2015/06/30 职场文书
2016创先争优活动党员公开承诺书
2016/03/24 职场文书