JS数组方法join()用法实例分析


Posted in Javascript onJanuary 18, 2020

本文实例讲述了JS数组方法join()用法。分享给大家供大家参考,具体如下:

join()方法

  1. 定义和用法:
    join() 方法用于把数组中的所有元素放入一个字符串。
    元素是通过指定的分隔符进行分隔的。
  2. 语法:arrayObject.join(separator)
  3. 参数:可选,指定要使用的分隔符。
    注:不给join()方法传入任何值,或者给它传入undefined,则使用逗号作为分隔符。
    IE7及更早版本会错误的使用字符串“undefined”作为分隔符。
    数组中的某一项是null或undefined,那么该值在join()、toLocaleString()、toString()和valueOf()方法返回的结果中以空字符串表示。
  4. 返回值:
    返回包含所有数组项的字符串。

代码如下:

Array.prototype.copyJoin = function() {
  var string = '';
  for(var i = 0; i < this.length; i++) {
    // 将数组中各项值为null 或undefined的项改为空字符串。
    if(this[i] == null || this[i] == undefined) {
      this[i] = '';
    }
    // 对数组进行操作
    if(arguments.length == 1 && arguments[0] != undefined) { //指定使用的分隔符
      string += (i < this.length - 1) ? this[i] + arguments[0] : this[i];
    }
    else { // 默认使用的分隔符————逗号
      // if(i < this.length - 1) {
      //   string += this[i] + ',';
      // }
      // else {
      //   string += this[i];
      // }
      string += (i < this.length - 1) ? this[i] + ',' : this[i];
    }
  }
  return string;
}
// 不传任何值或者传入undefined
var arr = [1, 2, 3, 4, 5, 6];
console.log(arr.copyJoin()); // 1,2,3,4,5,6
console.log(arr.copyJoin().length); // 11
console.log(arr.copyJoin(undefined)); // 1,2,3,4,5,6
console.log(arr.copyJoin(undefined).length); // 11
// 传入参数
console.log(arr.copyJoin('||')); // 1||2||3||4||5||6
console.log(arr.copyJoin('||').length);  // 16
// 数组中的某一项是null或undefined
var arr2 = [1, undefined, 2, undefined, 3, 4, 5, 6, 7, null, 8, null, 9];
console.log(arr2.copyJoin()); // 1,,2,,3,4,5,6,7,,8,,9
console.log(arr2.copyJoin().length); // 21
console.log(arr2.copyJoin(undefined)); // 1,,2,,3,4,5,6,7,,8,,9
console.log(arr2.copyJoin(undefined).length); // 21

运行结果:

JS数组方法join()用法实例分析

以上在IE8+ join()方法一样,但是在IE7及更早版本(copyJoin()方法不存在):

arr.join(undefined)); // 1undefined2undefined3undefined4undefined5undefined6
arr.join(undefined).length); // 51
arr2.join(undefined)); // 1undefinedundefined2undefinedundefined3undefined4undefined5undefined6undefined7undefinedundefined8undefinedundefined9
arr2.join(undefined).length); // 117

感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具:http://tools.3water.com/code/HtmlJsRun测试上述代码运行效果。

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
锋利的jQuery 第三章章节总结的例子
Mar 23 Javascript
JS/jQuery实现默认显示部分文字点击按钮显示全部内容
May 13 Javascript
js Math 对象的方法
Sep 01 Javascript
基于jQuery+JSON的省市二三级联动效果
Jun 05 Javascript
基于Javascript实现返回顶部按钮
Feb 29 Javascript
javaScript如何跳出多重循环break、continue
Sep 01 Javascript
微信小程序 后台https域名绑定和免费的https证书申请详解
Nov 10 Javascript
教你用十行node.js代码读取docx的文本
Mar 08 Javascript
vue.js开发环境安装教程
Mar 17 Javascript
vue resource post请求时遇到的坑
Oct 19 Javascript
微信小程序基于高德地图查找位置并显示文字
Oct 30 Javascript
Vue props中Object和Array设置默认值操作
Jul 30 Javascript
JavaScript进制转换实现方法解析
Jan 18 #Javascript
js滚轮事件 js自定义滚动条的实现
Jan 18 #Javascript
vue实现扫码功能
Jan 17 #Javascript
js实现轮播图效果 z-index实现轮播图
Jan 17 #Javascript
js键盘事件实现人物的行走
Jan 17 #Javascript
javascript实现简易的计算器
Jan 17 #Javascript
JavaScript简易计算器制作
Jan 17 #Javascript
You might like
如何实现给定日期的若干天以后的日期
2006/10/09 PHP
PHP执行linux系统命令的常用函数使用说明
2010/04/27 PHP
ThinkPHP 5.1 跨域配置方法
2019/10/11 PHP
onpropertypchange
2006/07/01 Javascript
asp 的 分词实现代码
2007/05/24 Javascript
jQuery表单获取和失去焦点输入框提示效果的实例代码
2013/08/01 Javascript
原生js获取宽高与jquery获取宽高的方法关系对比
2014/04/04 Javascript
网页右下角弹出窗体实现代码
2014/06/05 Javascript
checkbox勾选判断代码分析
2014/06/11 Javascript
全面解析Bootstrap表单使用方法(表单控件)
2015/11/24 Javascript
js实现不重复导入的方法
2016/03/02 Javascript
利用AJAX实现WordPress中的文章列表及评论的分页功能
2016/05/17 Javascript
Vue.js 表单校验插件
2016/08/14 Javascript
ajax实现加载页面、删除、查看详细信息 bootstrap美化页面!
2017/03/14 Javascript
vuejs前后端数据交互之从后端请求数据的实例
2018/08/11 Javascript
vue-property-decorator用法详解
2019/12/12 Javascript
vue中提示$index is not defined错误的解决方式
2020/09/02 Javascript
Python基础入门之seed()方法的使用
2015/05/15 Python
Python爬虫爬取新浪微博内容示例【基于代理IP】
2018/08/03 Python
Python之两种模式的生产者消费者模型详解
2018/10/26 Python
Python3 批量扫描端口的例子
2019/07/25 Python
Python要求O(n)复杂度求无序列表中第K的大元素实例
2020/04/02 Python
如何理解python中数字列表
2020/05/29 Python
搭建pypi私有仓库实现过程详解
2020/11/25 Python
海量信息软件测试笔试题
2015/08/08 面试题
主管职责范文
2013/11/09 职场文书
毕业生自荐信
2013/12/14 职场文书
大学生毕业求职信
2014/06/12 职场文书
小学课外阅读总结
2014/07/09 职场文书
学生上课看漫画的检讨书
2014/09/26 职场文书
会计工作总结范文2014
2014/12/23 职场文书
2015年入党决心书
2015/02/05 职场文书
通知范文怎么写
2015/04/16 职场文书
会议主持人开场白台词
2015/05/28 职场文书
科级干部培训心得体会
2016/01/06 职场文书
导游词之潮音寺
2019/09/26 职场文书