首页 > web前端 > js教程 > JavaScript相关函数的讲解

JavaScript相关函数的讲解

jacklove
发布: 2018-05-21 10:45:59
原创
1295 人浏览过

在JavaScript的学习中有些经常出现的函数,本篇就会详解一部分函数。

.map

map 方法会迭代数组中的每一个元素,并根据回调函数来处理每一个元素,最后返回一个新数组。

用 map 方法来为 oldArray 中的每一项增加3,并且在 newArray 中保存它们。 oldArray 不应该被改变。

var oldArray = [1,2,3,4,5];var newArray = oldArray.map(function(val){  return val + 3;  });
.reduce
登录后复制

数组中的元素进行运算 从左到右 依次进行 剩下最后一个元素为return值
其中 上次进行结果的累计值(previousVal) 和当前值 (currentVal)。

var array = [4,5,6,7,8];var singleVal = 0;singleVal = array.reduce(function(previousVal, currentVal){ return previousVal + currentVal;   });
.filter
登录后复制

filter 方法用来迭代一个数组,并且按给出的条件过滤出符合的元素。

用 filter 来创建一个新数组,新数组的值是 oldArray 中值小于6的元素。不许改变原数组 oldArray

var oldArray = [1,2,3,4,5,6,7,8,9,10];var newArray = oldArray.filter(function(val){    return val<6;   });
.sort
登录后复制

sort 方法将改变原数组,返回被排序后的数组。sort 可以把比较函数作为参数传入。比较函数有返回值,当 a 小于 b,返回一个负数;当 a 大于 b ,返回一个正数;相等时返回0。如果没有传入比较函数,它将把值全部转成字符串,并按照字母顺序进行排序。

用 sort 按照从小到大的顺序排序 array 。

var array = [1, 12, 21, 2];array.sort(function(a, b) {  return a - b;});result: [1,2,12,21]
.reverse
登录后复制

用 reverse 来翻转 array 数组。并赋值给 newArray.

var array = [1,2,3,4,5,6,7];var newArray = [];newArray = array.reverse();
reverse_result.png
.concat
登录后复制

concat 方法的参数应该是一个数组。参数中的数组会拼接在原数组的后面,并作为一个新数组返回。

用 .concat() 将 concatMe 拼接到 oldArray 后面,并且赋值给 newArray。

concat_result.png
.split
登录后复制

你可以使用 split 方法按指定分隔符将字符串分割为数组。给 split 方法传递一个参数,这个参数将会作为一个分隔符。

用 split 方法来把字符串 string 分割为数组 array。

无分隔符。

<script type="text/javascript">
    var str="How are you doing today?";    var n=str.split();    document.write(n);</script>输出:
How are you doing today?
登录后复制

将字符串的每个字符都分开。输出:

H,w are y,u d,ing t,day?
.join
登录后复制

join 方法来把数组转换成字符串,里面的每一个元素可以用你指定的连接符来连接起来,这个连接符就是你要传入的参数。

用 join 方法,连接符为' '把数组 joinMe 转化成字符串 joinedString.

var veggies = ["Celery", "Radish", "Carrot", "Potato"];var salad = veggies.join(" and ");console.log(salad); // "Celery and Radish and Carrot and Potato" 
.replace
登录后复制

将替换

本篇详细的讲解一些常见的函数,更多相关知识请关注php中文网。

相关推荐:

关于jquery DOM&事件的讲解

一些相关的模块化基础

dom对象的innerText和innerHTML有什么区别?

以上是JavaScript相关函数的讲解的详细内容。更多信息请关注PHP中文网其他相关文章!

相关标签:
来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板