那些精彩的JavaScript代码片段


Posted in Javascript onJanuary 12, 2017

精彩的JavaScript代码片段,分享给大家

1.根据给定的条件在原有的数组上,得到所需要的新数组

var a = [-1, -1, 1, 2, -2, -2, -3, -3, 3, -3];
function f(s, e) {
  var ret = [];
  for (var i in s) { // 根据原有的数组长度进行循环
    ret.push(e(s[i]));
  }
  return ret;
}
f(a, function(n) {
  return n > 0 ? n : 0
}); // 传输一个匿名函数作为逻辑判断

2.比原生type或typeof更详细的类型监测方法

function type(p) {
  /function.(\w*)\(\)/.test(p.constructor); //通过其构造函数来获取对应的类型。
  return RegExp.$1;
}

3.对象或数组的深拷贝,用于解决对象引用时值一改全改的问题。

var copyObject = function(obj) {
  var result = {};
  for (var x in obj) {
    result[x] = typeof obj === "object" ? copyObject(obj[x]) : obj[x]
    //如果拷贝的值仍然是一个对象,那么重复执行当前方法。
  }
  return result;
}

4.通过正则表达式来获取Cookie的值

function getCookie(name) {
  if (name && RegExp("(^| )" + name + "=([^;]*)(;|$)").exec(document.cookie)) return RegExp.$2;
  // (^| ) 不匹配第一个空格。
  // ([^;]*) 只匹配除了;号之外的所有字符。
  // (;|$) 匹配以;号或$为结尾的字符。
}

5.通过移位运算来替代”parseInt”

~~3.14 = > 3;

// ~~ 取整。~取当前数值的反码,~~表示再次取反,也就是得到当前自身(说明,JS中的“位”运算会将数值自动转换为整数)

6.将数值转换为16进制的字符串(常用于表示色彩)

(~~ (Math.random() * (1 << 24))).toString(16)

// ~~ 通过位运算来取整。
// << 左移位。将1的二进制数左移24位。而1<<24 == 2^24(RGB模式下最多可表示的色彩数量)
// toString(16) 将数值转换为16进制的字符串输出。

7.对象方法的兼容性检查

if ('querySelector' in document) {}

8.NodeList || HTMLCollection || Object转换为Array或具有Array的方法

NodeList: 是指通过集合方法获得到的DOM节点列表,例如:document.getElementsByTagNmae,document.forms…等方法。
HTMLCollection: HTML块,它与NodeList很像,但是NodeList只支持数字索引,而HTMLCollection可以支持名称作为索引。
NodeList与HTMLCollection都具有以下类似: 具有数组的外观,但没有数组的方法 、具有length属性、支持索引来读取内容

function makeArray(obj) {
  var rs = [],
    len = obj.length;
  try {
    rs = [].slice.call(obj, 0);
  } catch (e) { //for IE
    for (var i = 0; j = obj[i++];) {
      rs.push(j);
    }
  }
  return rs;
}

9. 正则匹配清除两侧空格

var trim = function(v){
  var patrn = /^\s*(.*?)\s+$/;
  return (patrn.test(v))? RegExp.$1 : '
  null ';
}

10. 时间格式化

function dateFormat(t){    // t 是以秒为单位的值。
  var h = ~~(t/3600),    // t除以3600,取整,得到的就是小时。
    m = ~~(t%3600/60),  // t求余3600,取模,得到的就是去除小时剩下的秒数(分钟 + 秒),再除以60,取整,得到的就是分钟。
    s = ~~(t%3600%60);  // t求余3600,再求余60,剩下的自然就是“秒数”。
 
   return h+'小时'+m+'分'+s+'秒';
}

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Ext JS Grid在IE6 下宽度的问题解决方法
Feb 15 Javascript
vs2003 js文件编码问题的解决方法
Mar 20 Javascript
Jsonp 跨域的原理以及Jquery的解决方案
May 18 Javascript
基于jQuery的可用于选项卡及幻灯的切换插件
Mar 28 Javascript
使用jQuery Ajax功能时需要注意的一个问题(内存溢出)
May 30 Javascript
理解javascript对象继承
Apr 17 Javascript
Angular ng-class详解及实例代码
Sep 19 Javascript
Javascript ES6中对象类型Sets的介绍与使用详解
Jul 17 Javascript
微信小程序之选项卡的实现方法
Sep 29 Javascript
解决Mac安装thrift因bison报错的问题
May 17 Javascript
解决vscode进行vue格式化,会自动补分号和双引号的问题
Oct 26 Javascript
Vue自定义铃声提示音组件的实现
Jan 22 Vue.js
JavaScript实现星级评分
Jan 12 #Javascript
angular2倒计时组件使用详解
Jan 12 #Javascript
JavaScript中localStorage对象存储方式实例分析
Jan 12 #Javascript
利用VUE框架,实现列表分页功能示例代码
Jan 12 #Javascript
js中常用的Math方法总结
Jan 12 #Javascript
Vue数据驱动模拟实现4
Jan 12 #Javascript
移动端点击态处理的三种实现方式
Jan 12 #Javascript
You might like
php使用pdo连接mssql server数据库实例
2014/12/25 PHP
PHP实现唤起微信支付功能
2019/02/18 PHP
js之WEB开发调试利器:Firebug 下载
2007/01/13 Javascript
Javascript document.referrer判断访客来源网址
2020/05/15 Javascript
在UpdatePanel内jquery easyui效果失效的解决方法
2010/04/11 Javascript
如何将JS的变量值传递给ASP变量
2012/12/10 Javascript
JQuery+CSS提示框实现思路及代码(纯手工打造)
2013/05/07 Javascript
探讨js字符串数组拼接的性能问题
2014/10/11 Javascript
理解javascript回调函数
2014/12/28 Javascript
javascript实现控制文字大中小显示
2015/04/28 Javascript
异步安全加载javascript文件的方法
2015/07/21 Javascript
JS中innerHTML和pasteHTML的区别实例分析
2016/06/22 Javascript
Angular2利用组件与指令实现图片轮播组件
2017/03/27 Javascript
JS简单获取日期相差天数的方法
2017/04/24 Javascript
Angular 通过注入 $location 获取与修改当前页面URL的实例
2017/05/31 Javascript
vscode下vue项目中eslint的使用方法
2019/01/13 Javascript
小程序云开发实现数据库异步操作同步化
2019/05/18 Javascript
node.js实现带进度条的多文件上传
2020/03/27 Javascript
Python的randrange()方法使用教程
2015/05/15 Python
Python控制多进程与多线程并发数总结
2016/10/26 Python
pandas or sql计算前后两行数据间的增值方法
2018/04/20 Python
详解利用python+opencv识别图片中的圆形(霍夫变换)
2019/07/01 Python
Python logging模块handlers用法详解
2020/08/14 Python
HTML5应用之文件上传
2016/12/30 HTML / CSS
HTML5 Canvas的事件处理介绍
2015/04/24 HTML / CSS
介绍一下.net和Java的特点和区别
2012/09/26 面试题
.NET程序员的几道面试题
2012/06/01 面试题
酒店采购员岗位职责
2014/03/14 职场文书
英语教师自荐信
2014/05/26 职场文书
部门活动策划方案
2014/08/16 职场文书
售房协议书
2014/08/19 职场文书
大学生考试作弊检讨书1000字
2014/10/14 职场文书
留学推荐信(中英文版)
2015/03/26 职场文书
技术转让协议书
2016/03/19 职场文书
民事纠纷协议书
2016/03/23 职场文书
三年级作文之趣事作文
2019/11/04 职场文书