• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号
您的位置:首页 > 程序设计 >JavaScript > 那些精彩的JavaScript代码片段

那些精彩的JavaScript代码片段

作者: 字体:[增加 减小] 来源:互联网 时间:2017-05-11

通过本文主要向大家介绍了javascript代码,javascript代码编辑器,html javascript代码,javascript代码下载,javascript代码大全等相关知识,希望对您有所帮助,也希望大家支持linkedu.com www.linkedu.com

精彩的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
}); // 传输一个匿名函数作为逻辑判断
</div>

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

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

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

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

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

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

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

~~3.14 = > 3;
</div>

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

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

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

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

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

if ('querySelector' in document) {}
</div>

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;
}
</div>

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

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

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+'秒';
}

</div>

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

</div>
分享到:QQ空间新浪微博腾讯微博微信百度贴吧QQ好友复制网址打印

您可能想查找下面的文章:

  • JavaScript瀑布流布局实现代码
  • JavaScript实现的冒泡排序法及统计相邻数交换次数示例
  • JavaScript实现的商品抢购倒计时功能示例
  • JavaScript简单计算人的年龄示例
  • 基于JavaScript实现的折半查找算法示例
  • 基于JavaScript实现的顺序查找算法示例
  • JavaScript数据结构之二叉树的计数算法示例
  • JavaScript数据结构之二叉树的删除算法示例
  • JavaScript数据结构之二叉树的查找算法示例
  • JavaScript数据结构之二叉树的遍历算法示例

相关文章

  • 2017-05-11jQuery Ajax前后端使用JSON进行交互示例
  • 2017-05-11AngularJS 单选框及多选框的双向动态绑定
  • 2017-05-11JS简单实现点击按钮或文字显示遮罩层的方法
  • 2017-05-11微信小程序教程系列之视图层的条件渲染(10)
  • 2017-05-11微信小程序开发经验总结(推荐)
  • 2017-05-11推荐三款不错的图片压缩上传插件(webuploader、localResizeIMG4、LUploader)
  • 2017-05-11fckeditor部署到weblogic出现xml无法读取及样式不能显示问题的解决方法
  • 2017-05-11Jquery实时监听input value的实例
  • 2017-05-11jQuery插件zTree实现获取一级节点数据的方法
  • 2017-05-11JSONP跨域请求

文章分类

  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号

最近更新的内容

    • 简单实现IONIC购物车功能
    • node.js学习
    • 无循环 JavaScript(map、reduce、filter和find)
    • JS Select下拉框(支持输入模糊查询)
    • JavaScript中双符号的运算详解
    • Bootstrap学习笔记之进度条、媒体对象实例详解
    • jQuery实现Table表格隔行变色及高亮显示当前选择行效果示例
    • JS中input表单隐藏域及其使用方法
    • ajax详解
    • 简单实现JS上传图片预览功能

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有