JS常见的小代码
一:去掉数组里面的重复项。
比如 如下一个数组:var arr = [1,2,4,3,4,3]; 我想要得到数组 [1,2,4,3].为这样的 写一个函数去掉重复的项。
var unique = function(arr){
arr = arr || [];
var obj = {},
newArray = [];
if(arr.length > 0){
for(var i = 0, len = arr.length; i < len; i+=1){
var curItem = arr[i],
itemTemp = typeof(curItem) + curItem;
if(obj[itemTemp] !== 1){
newArray.push(curItem);
obj[itemTemp] = 1;
}
}
}
return newArray;
};
二:返回数组里面的最大项:
比如需求如下 有个数组 var arr = [1,2,3,4,5]; 想返回数组里面的最大项。 我们只需要写如下函数即可:
var maxValue = function(arr){
arr = arr || [];
var i,
tempVal = 0;
for(i = 0, len = arr.length; i < len; i+=1){
var curVal = arr[i];
if(curVal > tempVal){
tempVal = curVal;
}
}
return tempVal;
};
三: 数组里面的项从小到大的排序问题.
有时候我们的需求要数组里面的数字从小到大排序问题,那么我们常见的方法有sort这个方法 可以使数字从小到大的排序 但是
用这个sort排序有个问题就是它根据ASCLL编码来排序的 比如数组[1,23,5],它排序后我们期望的是[1,5,23],但是它却返回了
[1,23,5],为什么呢?他首先计算2的ASCLL编码是50(因为1的ASCLL编码是49),5的ASCLL编码是53,所以50小于53.这是我们不
想要的结果。那么至于这种情况我们自己可以写个简单的函数来支持下:如下:
var compareNum = function(a,b){
if(a > b){
return 1;
}else if(a < b){
return -1;
}else {
return 0;
}
}
然后调用 数组.sort(compareNum);就ok了 但是我们有个更简单函数可以代替上面的函数:如下
数组.sort(function(a,b){
return a - b;
});
四:对象根据数组排序的问题。
有时候我们有这么样的一个需求 向服务器发一个请求 带参数 商品ID 数组传过去 但是后台返回一个数组 里面是以对象的形式存在
时候,由于后台开发人员懒的缘故,没有给我们排序,而我们前端需求是向服务器请求参数的顺序传过去 返回的后顺序和传过去一
样的顺序。
比如这么一个数组:var shopId = ['001','002','003','004']; 服务器返回的如下:
var callId = [{
'itemId': '003'
},
{
'itemId': '004'
},
{
'itemId': '002'
},
{
'itemId': '001'
}];
但是我是想返回的顺序是:
var callId = [{
'itemId': '001'
},
{
'itemId': '002'
},
{
'itemId': '003'
},
{
'itemId': '004'
}];
代码可以如下这样:
var sorting = function(shopId,callId){
var obj = {};
for(var i = 0, ilen = shopId.length; i < ilen; i+=1){
obj[shopId[i]] = i;
}
for(var j = 0, jlen = callId.length; j < jlen; j+=1){
var curItem = callId[j];
curItem._id = obj[curItem.itemId];
}
var compareId = callId.sort(function(a,b){
return a._id - b._id;
});
return compareId;
};
console.log(sorting(shopId,callId));
五: 如何获取当前 select 元素的值。
最近看到"怿飞" 的一篇很早的博客关于如何获取当前select元素的值得问题,感觉蛮好的 对以后工作也有帮助,所以打算收藏下:
- 如果 select 元素下的所有 option 元素均没有指定 selected 属性,会默认选中第一个。
- 可以通过
select.selectedIndex
获取到选中的 option 元素的索引。 - 可以通过
select.options[select.selectedIndex]
获取到选中的 option 元素。 - option 元素
<option selected="selected" value="value3">text3</option>
,可以通过 option.value 获得 option 元素的 value 属性值,即 value3;可以通过 option.text 获得 option 元素内的文本,即 text3。 - 如果 option 元素没有定义 value 属性,则 IE 中 option.value 无法获得,但 Safari、Opera、FireFox 依旧可以通过 option.value 获得,值同于 option.text 。
- 可以通过
option.attributes.value && option.attributes.value.specified
来判断 option 元素是否定义了 value 属性。 - 比如HTML代码如下:
- <select id="select">
<option value="11111">11111</option>
<option value="22222">22222</option>
<option value="33333">33333</option>
<option value='44444'>44444</option>
<option value='55555'>55555</option>
<option value='66666'>66666</option>
</select> - var getSelectValue = function(select) {
var idx = select.selectedIndex, //获取选中的option的索引
option,
value;
if(idx > -1) {
option = select.options[idx]; //获取选中的option元素
value = option.attributes.value;
return (value && value.specified) ? option.value : option.text;
}
return null;
};
var select = document.getElementById('select');
alert(getSelectValue(select));运行下就知道了。
JS常见的小代码的更多相关文章
- js——常见的小方法
1.随机得到是六位数,可以当做“密码”来使用: Math.random().toString().substr(2, 6):
- js一段小代码(浏览器用alert,否则用console)
(function(){ var root=this, isBrowserSide=false; if(typeof window !=="undefined" && ...
- 用Vue.js开发微信小程序:开源框架mpvue解析
前言 mpvue 是一款使用 Vue.js 开发微信小程序的前端框架.使用此框架,开发者将得到完整的 Vue.js 开发体验,同时为 H5 和小程序提供了代码复用的能力.如果想将 H5 项目改造为小程 ...
- 折腾一两天,终于学会使用grunt压缩合并混淆JS脚本,小激动,特意记录一下+spm一点意外收获
很长时间没有更新博客了,实在是太忙啦...0.0 ,以下的东西纯粹是记录,不是我原创,放到收藏夹还担心不够,这个以后常用,想来想去,还是放到这里吧,,丢不了..最后一句废话,网上搜集也好原创也罢,能解 ...
- 【转】利用 three.js 开发微信小游戏的尝试
前言 这是一次利用 three.js 开发微信小游戏的尝试,并不能算作是教程,只能算是一篇笔记吧. 微信 WeChat 6.6.1 开始引入了微信小游戏,初期上线了一批质量相当不错的小游戏.我在查阅各 ...
- js 数组去重小技巧
js 数组去重小技巧 Intro 今天遇到一个问题,需要对数据进行去重,想看一下有没有什么比较方便的方法,果然有些收获. Question 问题描述: 我有一个这样的数据: [ { "Pro ...
- three.js 3d三维网页代码加密的实现方法
http://www.jiamisoft.com/blog/17827-three-js-3dsanweiwangyejiami.html https://www.html5tricks.com/ta ...
- JS实现页面分享代码share,不需要第三方接口
在开发一个页面的时候常常会有这么一个小功能,就是分享该页面中的信息. 常见的分享代码有百度分享,JiaThis分享插件(现在貌似不能用了),bshare分享插件等,我主要分享一下自定义分享代码,如下: ...
- MPVUE - 使用vue.js开发微信小程序
MPVUE - 使用vue.js开发微信小程序 什么是mpvue? mpvue 是美团点评前端团队开源的一款使用 Vue.js 开发微信小程序的前端框架.框架提供了完整的 Vue.js 开发体验,开发 ...
随机推荐
- spring事务传播行为之使用REQUIRES_NEW不回滚
最近写spring事务时用到REQUIRES_NEW遇到一些不回滚的问题,所以就记录一下. 场景1:在一个服务层里面方法1和方法2都加上事务,其中方法二设置上propagation=Propagati ...
- Spring源码分析之IoC容器初始化
本文首发于cdream个人博客(点击获得更加阅读体验) 欢迎转载,转载请注明出处 作为一个java程序员,保守估计一年里也都有300天要和Spring有亲密接触~~像我这种怕是每天都要撸撸Spring ...
- SQL Server 中的一些概念
学习SQL Server 2012编程入门经典(第4版)的笔记 1.事务日志 任意数据库的更改起初不进入数据库本身,而是不断地被写入到事务日志. 日志是数据进入磁盘上的最先位置. 2.表 数据库中实际 ...
- JVM内存:年轻代、老年代、永久代(推荐 转)
参考文章: 1.Java 新生代.老年代.持久代.元空间 2.Java内存与垃圾回收调优 3.方法区的Class信息,又称为永久代,是否属于Java堆? Java 中的堆是 JVM 所管理的最大的一块 ...
- 初学HTML-10
marquee标签:设置文字滚动效果. 格式:<marquee>文字滚动</marquee> 属性:direction:设置滚动方向:left / right / up / d ...
- 试议常用Javascript 类库中 throttle 与 debounce 辅助函数的区别
问题的引出 看过我前面两篇博客的童鞋可能会注意到都谈到了事件处理的优化问题. 在很多应用中,我们需要控制函数执行的频率, 例如 窗口的 resize,窗口的 scroll 等操作,事件触发的频率非常高 ...
- React Native中Mobx的使用
从今天开始我们来搞搞状态管理可否,这几天没怎么写博客,因为被病魔战胜了,tmd,突然的降温让我不知所措,大家最近注意安全,毕竟年底了,查的严,呸,大家注意保暖 特别声明:写该文只是写一下用MobX的思 ...
- Android系统启动流程(二)解析Zygote进程启动过程
1.Zygote简介 在Android系统中,DVM(Dalvik虚拟机).应用程序进程以及运行系统的关键服务的SystemServer进程都是由Zygote进程来创建的,我们也将它称为孵化器.它通过 ...
- Kotlin入门(5)字符串及其格式化
上一篇文章介绍了数组的声明和操作,包括字符串数组的用法.注意到Kotlin的字符串类也叫String,那么String在Java和Kotlin中的用法有哪些差异呢?这便是本文所要阐述的内容了. 首先要 ...
- 将你的 Virtual dom 渲染成 Canvas
项目概述 一个基于Vue的virtual dom插件库,按照Vue render 函数的写法,直接将Vue生成的Vnode渲染到canvas中.支持常规的滚动操作和一些基础的元素事件绑定. githu ...