Javascript实用方法
这篇我主要记录一些在工作中常用的、实用的方法。
String
trim
字符串方法中的trim主要用来去空格使用,很多时候,在后台做参数处理的时候,我们都会使用该方法,比如在获取用户输入的账户时
var a = String(' 1234 ');
var b = "hello world";
console.log(b.trim()); //hello world
console.log(a.trim()); //1234
console.log(a); // 1234
以上,可以看出,trim方法去掉的是两头的空格,对中间的空格并不会产生影响。值得注意的是,trim方法,返回的是一个新的字符串,对原来的变量没有影响。
slice
slice方法用于切割字符串,用到的地方挺多的,比如在处理文件流的时候,我们就可以用slice来切割,当然,大多时候,也就仅仅是对字符串做一个简单处理
var b = "hello world, I like you";
console.log(b.slice(13)); //I like you
console.log(b.slice(15,20)); //like
console.log(b.slice(15,-4)); //like
console.log(b); //hello world, I like you
slice方法,支持传入两个参数,开始位置与结束位置,传入负数时,代表此次计数从末尾开始。
split
split方法用于将字符串分组存放,是常用的方法之一。能够让我们对分组好的字符串进行分组操作
var b = "hello world, I like you, and you?";
console.log(b.split()); //[ 'hello world, I like you, and you?' ]
console.log(b.split('')); //["h","e","l","l","o"," ","w","o","r","l","d",","," ","I",
" ","l","i","k","e"," ","y","o","u",","," ","a","n","d"," ","y","o","u","?"]
console.log(b.split(' ')); //[ 'hello', 'world,', 'I', 'like', 'you,', 'and', 'you?' ]
console.log(b.split(' ',3)); //[ 'hello', 'world,', 'I' ]
以空字符分组的时候,会将字符串按每一个字符来分组,这点很实用,可以按字符分组,想想都会觉得程序的世界也是鸟语花香啊~
substr、substring
都是用来截取字符串的,substr方法,支持传入两个参数,一个是开始位置,一个是截取长度,而substring的两个参数一个是开始位置,一个是结束位置
var b = "hello world, I like you, and you?";
console.log(b.substr()); //hello world, I like you, and you?
console.log(b.substr(13,10)); //I like you
console.log(b.substring(15,-9)); //hello world, I
console.log(b.substring(15,-1)); //hello world, I
由此可见,substr、substring和slice这三者来说,各有所长(╯°O°)╯┻━┻
你能体会么~不能体会的就留个言咯
Array
filter
filter能够按一定条件筛选出满足条件的数据,比如在后台处理mongdb的id时,前台传过来的id必须得满足id.trim().length === 24
var b = [ 'hello', 'world,', 'I', 'like', 'you,', 'and', 'you?' ];
console.log(b.filter(function (item){
return item.length < 5;
})); //[ 'I', 'like', 'you,', 'and', 'you?' ]
concat
concat方法能够将多个数组组合成一个数组,这在异步处理数据最后进行组装的时候特别有用
var b = [ 'hello', 'world,', 'I', 'like'];
var a = [ 'you,', 'and', 'you?' ];
var c = [[1],[2]];
console.log(b.concat(a)); //[ 'hello', 'world,', 'I', 'like', 'you,', 'and', 'you?' ]
console.log(b.concat(a).concat(c)); //[ 'hello', 'world,', 'I', 'like', 'you,', 'and', 'you?', [ 1 ], [ 2 ] ]
很多时候,在最后处理数据的时候,这种数组中嵌套了数组的情况是比较烦的,不过很简单,underscore有方法能够轻松解决它,你知道吗?(๑•́ ₃ •̀๑)
forEach
forEach应该是用的最多的方法了吧,它的作用就是遍历数组中的每一个值,然后你就可以对每一个值进行操作了
var b = ['hello', 'world,', 'I', 'like', 'you,', 'and', 'you?'];
b.forEach(function (ele, index) {
ele = ele + 1;
});
console.log(b); //[ 'hello', 'world,', 'I', 'like', 'you,', 'and', 'you?' ]
关于forEach,更准确的说对于Javascript中的对象,我一直觉得自己的理解已经够解决遇到的一般问题了,但是这个forEach还是给我带来了难题。比如上面这个,我对ele进行改变之后,b数组并没有按照我想象中的改变,结果是一成不变。而在在我的经历中,forEach中对遍历的值进行改变,它最终的结果使能够被改变的。因此,在这个变与不变之间,我没有找到一条清晰的分界线…
map
说了forEach怎么可以没有map,同是遍历数组中的每一个值,map能够将对这些值的操作进行返回为一个新的数组
var b = ['hello', 'world,', 'I', 'like', 'you,', 'and', 'you?'];
console.log(b.map(function (ele){
ele = ele + 1;
return ele;
})); //[ 'hello1', 'world,1', 'I1', 'like1', 'you,1', 'and1', 'you?1' ]
reduce
再说说这个reduce吧,reduce方法遍历数组的每一个值,操作自己定,最后返回一个做了这些累积操作的值,常用来算和吧,实用的呢,它能够产生比filter更强力的功效,这个自己体会吧~
var summary = [1, 2, 3, 4, 5, 6, 7, 8, 9];
console.log(summary.reduce(function (pre, cur) {
pre += cur;
return pre;
}, 0)); //45
今天就先写这么多吧,细水长流~
你可以很厉害,也可以很坚强,baby~
如想了解更多,请移步我的博客。
Javascript实用方法的更多相关文章
- Javascript实用方法二
承接上一篇, Object keys object的keys方法能够获取一个给定对象的所有键(key/属性名)并以数组的形式返回.这个方法可以用于键的筛选.匹配等. var basket = { st ...
- 基于 es6 的 javascript 实用方法
一.求数字数组的平均数 - 使用 数组的 reduce() 方法将每个值添加到累加器,初始值为0,总和除以数组长度. const average = arr => arr.reduce((acc ...
- JavaScript 实用方法
1.按时间显示问候语 2.强制光标停留位置 3.保存页面文本 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN& ...
- javascript代码实用方法实现
javascript代码实用方法实现 针对现在大家平时开发中,都会写一些重复性的js处理代码,今天总结了几个比较常用的方法实现.获取get请求参数.去字符串空格. 1.获取get请求中的参数 ...
- javascript实用技巧、javascript高级技巧
字号+作者:H5之家 来源:H5之家 2016-10-31 11:00 我要评论( ) 三零网提供网络编程. JavaScript 的技术文章javascript实用技巧.javascript高级技巧 ...
- 在Swift中使用JavaScript的方法和技巧
本文作者Nate Cook是一位独立的Web及移动应用开发者,是继Mattt大神之后NSHipster的主要维护者,也是非常知名活跃的Swift博主,并且还是支持自动生成Swift在线文档的Swift ...
- js实用方法记录-js动态加载css、js脚本文件
js实用方法记录-动态加载css/js 附送一个加载iframe,h5打开app代码 1. 动态加载js文件到head标签并执行回调 方法调用:dynamicLoadJs('http://www.yi ...
- 【译】你应该了解的JavaScript数组方法
让我们来做一个大胆的声明:for循环通常是无用的,而且还导致代码难以理解.当涉及迭代数组.查找元素.或对其排序或者你想到的任何东西,都可能有一个你可以使用的数组方法. 然而,尽管这些方法很有用,但是其 ...
- 《JavaScript实用效果整理》系列分享专栏
整理一些使用的JavaScript效果,在Web开发中遇到的比较好的动态效果,都收藏在这里,对以后的网站开发增加不少的色彩 <JavaScript实用效果整理>已整理成PDF文档,点击可直 ...
随机推荐
- 多线程爬坑之路-Thread和Runable源码解析之基本方法的运用实例
前面的文章:多线程爬坑之路-学习多线程需要来了解哪些东西?(concurrent并发包的数据结构和线程池,Locks锁,Atomic原子类) 多线程爬坑之路-Thread和Runable源码解析 前面 ...
- [原] KVM 虚拟化原理探究(1)— overview
KVM 虚拟化原理探究- overview 标签(空格分隔): KVM 写在前面的话 本文不介绍kvm和qemu的基本安装操作,希望读者具有一定的KVM实践经验.同时希望借此系列博客,能够对KVM底层 ...
- 利用on和off方法编写高效的js代码
先说下将这个话题的起因:最近发现公司的功能代码,很多在dom对象删除以后,其声明的绑定在window上的resize事件还一直存在,导致相同的功能代码执行了几次.对于我这种轻微代码洁癖的人来说,简直是 ...
- react入门参考资料--step by step
ReactJS简介 React 起源于 Facebook 的内部项目,因为该公司对市场上所有 JavaScript MVC 框架,都不满意,就决定自己写一套,用来架设 Instagram 的网站.做出 ...
- JQuery中的siblings()是什么意思
jQuery siblings() 方法返回被选元素的所有同胞元素,并且可以使用可选参数来过滤对同胞元素的搜索. 实例演示:点击某个li标签后将其设置为红色,而其所有同胞元素去除红色样式. 1.创建H ...
- 看图理解JWT如何用于单点登录
单点登录是我比较喜欢的一个技术解决方案,一方面他能够提高产品使用的便利性,另一方面他分离了各个应用都需要的登录服务,对性能以及工作量都有好处.自从上次研究过JWT如何应用于会话管理,加之以前的项目中也 ...
- Open-Test 测试驱动模式与版本号管理机制
以测试用例驱动项目开发,coding/case俩条线并走模式. 1.开发人员只负责功能实现: 2.测试人员提供自测用例,研发人员jenkins持续集成项目后自动化执行自测用例,通过后方可转测试 ...
- [AlwaysOn Availability Groups] 健康模型 Part 2 ——扩展
健康模型扩展 第一部分已经介绍了AlwayOn健康模型的概述.现在是创建一个自己的PBM策略,然后设置为制定的归类.创建这些策略,创建之后修改一下配置,dashboard就会自动评估这些策略. 场景, ...
- Nlog配置实例
彩色Console target <?xml version="1.0" encoding="utf-8" ?> <nlog xmlns= ...
- js实现四大经典排序算法
为了方便测试,这里写了一个创建长度为n的随机数组 function createArr(n) { var arr = []; while (n--) { arr.push(~~(Math.random ...