一、明确问题和答案
问:数组的join方法有什么作用
答:把数组中的所有元素转换为一个字符串,通过某个分割符对数组里面的元素进行分割, 分割符的类型是字符串

二、找例子
1、传值:使用"." 来做分割符

var arr = new Array(3)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"

console.log(arr.join("."))
// George.John.Thomas

2、不传值:不给join()方法传入任何值,或者给它传入undefined,则使用逗号作为分隔符

var arr = new Array(3)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"

console.log(arr.join())
// George,John,Thomas

var arr = new Array(3)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"

console.log(arr.join(undefined))
// George,John,Thomas

3、IE7及更早版本会错误的使用字符串“undefined”作为分隔符
(使用IE11仿真模式,设置文档为IE7,用户代理字符为IE7,下列代码为IE11浏览器仿真模式,设为IE7的运行结果)
知识点有效性带校验:有IE7浏览器的小伙伴可以测试留言告诉我,谢谢

var arr = new Array(3)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"

console.log(arr.join(undefined))
// George,John,Thomas

4、数组中的某一项是null或undefined,那么该值在join()、toLocaleString()、toString()和valueOf()方法返回的结果中以空字符串表示。

var arr = new Array(3)
arr[0] = "George"
arr[1] = null
arr[2] = undefined

console.log(arr.join())
// George,,
console.log(arr)
// ["George", null, undefined]

5、用join方法分割从数组对象提出来的值

var array = new Array();
var rows = [
	{name: '张三',id: '1'},
	{name: '李四',id: '2'},
	{name: '赵五',id: '3'},
]
for(var i = 0;i < rows.length; i++){
	var id = rows[i].id;
	array.push(id);
}
console.log(array.join('-'));
// 1-2-3

6、 用 and 分割符 连接所有数组元素

var fruits = ["Banana", "Orange", "Apple", "Mango"];
var energy = fruits.join(" and ");
console.log(energy)
// Banana and Orange and Apple and Mango

7、 split 和 join 方法 联合使用

// 我想要把所有顿号替换成→
var str1="北京、上海、广州、深圳"; 
str1.split('、').join('→')
// "北京→上海→广州→深圳"

// 2020 全国GDP 前四省的排名,需要:加入省这个字段,并且用大于号表示排名情况 
var str ="广东,江苏,山东,浙江"
str.split(',').join('省>')
// "广东省>江苏省>山东省>浙江"

总结:
1、join针对数组对象
2、参数是一个字符串,参数的默认值是 ‘,’ ,传空值或者undefined都会触发默认值
3、返回值是所有数组元素和分隔符的组合,是一个字符串

Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐