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获取电脑分辨率的思路及操作
Nov 22 Javascript
javascript结合ajax读取txt文件内容
Dec 05 Javascript
简述AngularJS相关的一些编程思想
Jun 23 Javascript
JavaScript基础语法之js表达式
Jun 07 Javascript
js中获取时间new Date()的全面介绍
Jun 20 Javascript
jQuery如何获取动态添加的元素
Jun 24 Javascript
解析Vue2.0双向绑定实现原理
Feb 23 Javascript
详解Vue结合后台的列表增删改案例
Aug 21 Javascript
Vue数据双向绑定底层实现原理
Nov 22 Javascript
Vue自定义多选组件使用详解
Sep 08 Javascript
js代码编写无缝轮播图
Sep 13 Javascript
Javascript Symbol原理及使用方法解析
Oct 22 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性能优化工具篇Benchmark类调试执行时间
2011/12/06 PHP
PHP网站建设的流程与步骤分享
2015/09/25 PHP
Symfony2在Nginx下的配置方法图文教程
2016/02/04 PHP
Yii2中OAuth扩展及QQ互联登录实现方法
2016/05/16 PHP
ThinkPHP5&5.1实现验证码的生成、使用及点击刷新功能示例
2020/02/07 PHP
[HTML/CSS/Javascript]WWTJS
2007/09/25 Javascript
用js获取电脑信息(是使用与IE浏览器)
2013/01/15 Javascript
js关闭当前页面(窗口)的几种方式总结
2013/03/05 Javascript
浅析js预加载/延迟加载
2014/09/25 Javascript
JavaScript面向对象分层思维全面解析
2016/11/22 Javascript
原生JS实现旋转轮播图+文字内容切换效果【附源码】
2018/09/29 Javascript
微信小程序开发实现的IP地址查询功能示例
2019/03/28 Javascript
详解小程序毫秒级倒计时(适用于拼团秒杀功能)
2019/05/05 Javascript
Vue组件基础用法详解
2020/02/05 Javascript
原生js实现轮播图特效
2020/05/04 Javascript
vue基础知识--axios合并请求和slot
2020/06/04 Javascript
Vue作用域插槽实现方法及作用详解
2020/07/08 Javascript
[01:57]2018年度DOTA2最具潜力解说-完美盛典
2018/12/16 DOTA
Python 爬虫学习笔记之正则表达式
2016/09/21 Python
Python基本socket通信控制操作示例
2019/01/30 Python
BeautifulSoup中find和find_all的使用详解
2020/12/07 Python
美国汽车交易网站:Edmunds
2016/08/17 全球购物
美国创意之家:BulbHead
2017/07/12 全球购物
巴西电子产品购物网站:Saldão da Informática
2018/01/09 全球购物
英语自荐信常用语句
2013/12/13 职场文书
银行门卫岗位职责
2013/12/29 职场文书
青年志愿者事迹材料
2014/02/07 职场文书
cf收人广告词大全
2014/03/14 职场文书
大学新闻系自荐书
2014/05/31 职场文书
小学数学课题方案
2014/06/15 职场文书
普通话演讲稿
2014/09/03 职场文书
乡镇安全生产月活动总结
2015/05/08 职场文书
七年级作文(600字3篇)
2019/09/24 职场文书
高并发下Redis如何保持数据一致性(避免读后写)
2022/03/18 Redis
Minikube搭建Kubernetes集群
2022/03/31 Servers
Mongodb 迁移数据块的流程介绍分析
2022/04/18 MongoDB