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 相关文章推荐
可实现多表单提交的javascript函数
Aug 01 Javascript
js停止输出代码
Jul 20 Javascript
有趣的javascript数组定义方法
Sep 10 Javascript
ECMAScript 创建自己的js类库
Nov 22 Javascript
微信+angularJS的SPA应用中用router进行页面跳转,jssdk校验失败问题解决
Sep 09 Javascript
AngularJS 指令的交互详解及实例代码
Sep 14 Javascript
AngularJS常见过滤器用法实例总结
Jul 06 Javascript
JavaScript门面模式详解
Oct 19 Javascript
element-ui 上传图片后清空图片显示的实例
Sep 04 Javascript
Angular单元测试之事件触发的实现
Jan 20 Javascript
JS实现超级好看的鼠标小尾巴特效
Dec 01 Javascript
简单聊聊TypeScript只读修饰符
Apr 06 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
PHP 5.3 下载时 VC9、VC6、Thread Safe、Non Thread Safe的区别分析
2011/03/28 PHP
php获取mysql数据库中的所有表名的代码
2011/04/23 PHP
php抽奖小程序的实现代码
2013/06/18 PHP
Yii2 加载css、js 载静态资源的方法
2017/03/10 PHP
基于Codeigniter框架实现的student信息系统站点动态发布功能详解
2017/03/23 PHP
扩展String功能方法
2006/09/22 Javascript
JavaScript中的集合及效率
2010/01/08 Javascript
腾讯与新浪的通过IP地址获取当前地理位置(省份)的接口
2010/07/26 Javascript
那些年,我还在学习jquery 学习笔记
2012/03/05 Javascript
jQuery实现智能判断固定导航条或侧边栏的方法
2016/09/04 Javascript
Angular通过angular-cli来搭建web前端项目的方法
2017/07/27 Javascript
不到200行 JavaScript 代码实现富文本编辑器的方法
2018/01/03 Javascript
vue19 组建 Vue.extend component、组件模版、动态组件 的实例代码
2019/04/04 Javascript
使用axios请求时,发送formData请求的示例
2019/10/29 Javascript
java遇到微信小程序 &quot;支付验证签名失败&quot; 问题解决
2019/12/22 Javascript
JavaScript实现简单贪吃蛇效果
2020/03/09 Javascript
python实现斐波那契递归函数的方法
2014/09/08 Python
Python获取DLL和EXE文件版本号的方法
2015/03/10 Python
黑科技 Python脚本帮你找出微信上删除你好友的人
2016/01/07 Python
详解django三种文件下载方式
2018/04/06 Python
python脚本生成caffe train_list.txt的方法
2018/04/27 Python
python3 线性回归验证方法
2019/07/09 Python
详解Python 循环嵌套
2020/07/09 Python
python单例模式的应用场景实例讲解
2021/02/24 Python
HTML5注册表单的自动聚焦与占位文本示例代码
2013/07/19 HTML / CSS
夏威夷航空官网:Hawaiian Airlines
2016/09/11 全球购物
澳大利亚便宜隐形眼镜购买网站:QUICKLENS Australia
2018/10/06 全球购物
入学申请自荐信范文
2014/02/26 职场文书
事业单位分类改革实施方案
2014/03/21 职场文书
2014年技术员工作总结
2014/11/18 职场文书
家庭财产分割协议范文
2014/11/24 职场文书
学校捐款活动总结
2015/05/09 职场文书
感恩信:写给爸爸妈妈的一封感谢信
2019/09/12 职场文书
Django如何与Ajax交互
2021/04/29 Python
Java spring定时任务详解
2021/10/05 Java/Android
golang连接MySQl使用sqlx库
2022/04/14 Golang