江门网站建设模板,网站标准字体,白云免费网站建设,爱南宁健康码app下载字符串方法 示例字符串#xff1a; const str hello,kitty,hello,vue ; 一、基本方法 charAt() 返回指定索引的字符
startsWith() 判断字符串是否以xxx开头#xff0c;返回布尔值
endsWith() 判断字符串是否以xxx结尾#xff0c;返回布尔值
padStar… 字符串方法 示例字符串 const str hello,kitty,hello,vue ; 一、基本方法 charAt() 返回指定索引的字符
startsWith() 判断字符串是否以xxx开头返回布尔值
endsWith() 判断字符串是否以xxx结尾返回布尔值
padStart() 头部补全返回新字符串
padEnd() 尾部补全返回新字符串
repeat() 拷贝字符串返回新字符串
toUpperCase() 大写转换返回新字符串
toLowerCase() 小写转换返回新字符串 用例 charAt()console.log(str.charAt(1)); // h
trim()console.log(str.trim()); // hello,kitty,hello,vue
startsWith() / endsWith()console.log(str.startsWith(hello)); // true
padStart() / padEnd()str.padStart(number,string) 接收两个参数第一个指定补全后的字符串长度第二个可选用来补全的字符串。默认补全空格console.log(str.padStart(5,x)); // hello,kitty,hello,vue 原本的长度超过了5所以补不全console.log(str.padStart(30,x)); // xxxxxxxxhello,kitty,hello,vue 原本的长度少于30缺多少补多少console.log(str.padStart(30)); // hello,kitty,hello,vue
repeat() str.repeat(number)接收一个参数复制的份数console.log(str.repeat(2)); // hello,kitty,hello,vue hello,kitty,hello,vue
toUpperCase() / toLowerCase()console.log(str.toUpperCase()); // HELLO,KITTY,HELLO,VUE 二、字符串匹配 indexOf() 返回字符串中指定文本首次出现的索引不存在返回-1
lastIndexOf() 返回字符串中指定文本最后一次出现的索引.如果不存在返回-1
search() 字符串内搜索特定值返回第一次出现的索引如果没有返回-1。与indexOf()的区别是可以使用正则表达式
match() 字符串内检索指定的值或找到一个或多个正则表达式的匹配。(通过字符串或正则表达式)。返回数组或null
includes() 【es6新增】判断字符串中是否包含指定文本返回布尔值 示例 indexOf() / lastIndexOf()indexOf(string,start) 为匹配的字符串start为开始匹配的索引默认为0console.log(str.indexOf(5)); // -1console.log(str.indexOf(e)); // 1
search()console.log(str.search(o)); // 4
match()console.log(str.match(e)); // [e] 属性有length,index,inputconsole.log(str.match(/ell/g)); // [ell,ell]
includes()console.log(str.includes(vue)); // trueconsole.log(str.includes(react)); // false三、字符串截取、分割 substring() 根据索引截取字符串返回新字符串
substr() 根据起始索引和长度截取。返回新字符串
slice() 根据索引截取返回新字符串。与substring()不同的是参数可以传入负值
trim() 去除首尾空格返回新字符串
trimRight() 去除右侧空格返回新字符串
trimLeft() 去除左侧空格返回新字符串用例 substring()str.substring(start,end) 起始索引和结束索引。第一个参数必需第二个非必需console.log(str.substring(1)); // ello,kitty,hello,vue 从索引1开始到结束console.log(str.substring(1,4)); // ell 从索引1到索引3的字符串
substr()str.substr(start,length) 传入一个开始索引和截取长度console.log(str.substr(1,10)); // ello,kitty 从索引1开始截取长度为10的字符串
slice()str.slice(start,end) 根据索引与substring不同的是可以传入负值。如果参数为负值表示从字符串的结尾开始计数。这里需要注意如果传入负值也遵从start在坐end在右的规则。示例如下console.log(str.slice(-7,-3)); // lo,vconsole.log(str.slice(-3,-7)); // 空四、字符串分割、拼接 concat() 可拼接多个字符串返回新的字符串
split() 将字符串分割成数组
join() 将数据转成字符串用例 let str1 abc,str2 def;
let arr [1,2,3,4,5];
console.log(str.concat(str1,str2)); // hello,kitty,hello,vue abcdef
console.log(str.split(,)); // [hello, kitty, hello, vue ]
console.log(arr.join(-)); // 1-2-3-4-5五、字符串替换 replace() 根据字符串或正则表达式进行替换返回新字符串用例 let re /hello/g, re2 /hello/, re3 hello;
str.replace(re,React); // React,kitty,React,vue
str.replace(re2,React); // React,kitty,hello,vue
str.replace(re3,React); // React,kitty,hello,vue数组方法 示例数组 let arr [1,2,3,4,5,6,7,8,9,10]; Array方法 Array.isArray() 判断对象是否为数组。
Array.of() 生成新的数组
Array.from() 将类数组或可迭代对象转化成数组返回新数组浅拷贝。用例 Array.from() 什么是类数组有些对象看上去很像数组但不是array类型不具有array的内置方法。例如querySelectorAll获取的元素列表。实现相同的效果也可用延展操作符完成let dom document.querySelectorAll(li);console.log(dom);console.log([...dom]);console.log(Array.from(dom));let a Array.from([a,b,c]) let b Array.from([1,2,3],(x){xx}) // Array [2, 4, 6]
Array.of()Array.of(5) // [5]Array.of(1,2,3) // [1,2,3]元素的增删改都会改变原数组 增push() 向数组的末尾添加一个或更多元素并返回新的长度。unshift() 向数组的开头添加一个或更多元素并返回新的长度。
删pop() 删除并返回数组的最后一个元素shift() 删除并返回数组的第一个元素copyWithin() 将数组中某几个元素复制到某一位置(浅拷贝)将原来被复制位置上的元素覆盖。该方法返回被改变的原数组。
splice() 可添加、删除、替换元素。
fill() 用一个固定值填充一个数组中指定范围内的元素详细说明 copyWithin()copyWithin(target,start,end) target是目标位置的索引start是复制源的起始位置end是结束位置。三个参数都可以是负数如果是负数从末尾开始计算。后两个参数可选如果start被忽略将从0开始复制如果end被忽略将一直复制到数组结尾。例如将数组中第5个元素复制到第一个位置。将第5,6个元素复制到第1,2个位置。console.log(arr.copyWithin(0, 4, 5)); // [5, 2, 3, 4, 5, 6, 7, 8, 9, 10]console.log(arr.copyWithin(0, 4, 6)); // [5, 6, 3, 4, 5, 6, 7, 8, 9, 10]splice()splice(start,number,items...) start为指定修改的开始位置,number为删除元素的个数,items数量不限表示要添加进数组的元素。该方法有返回值不同的功能返回不同的内容。需要明确的是此方法会改变原数组删除list.splice(0, 1) // 从下标为0开始,长度为1list.splice(0, 2) // 从下标为0开始,长度为2替换list.splice(0, 1, 4); // 从下标为0开始,长度为1的数组元素替换成4list.splice(0, 2, 4); // 从下标为0开始,长度为2的数组元素替换成4【两个元素被替换成一个元素】添加list.splice(1, 0, 5) // 在下标为1处添加一项5list.splice(1, 0, 5, 4, 3); // 在下标为1处依次添加5/4/3三个元素fill()fill(val,start,end) 后两个参数可省略let array1 [1, 2, 3, 4, 5];console.log(array1.fill(a, 2, 5)); // [1, 2, a, a, a]查找元素非遍历 includes() 判断数组是否包含某个值返回布尔值。
slice() 根据索引从数组中返回选定的元素(浅拷贝)
indexOf() 返回某元素在数组中首次出现的位置不存在返回-1
lastIndexOf() 返回最后一次出现的位置不存在返回-1用例 slice()slice(start,end) console.log(arr.slice(5,7)); // [6, 7]数组遍历 传统for循环
forEach() 遍历数组为所有元素调用一次回调函数。
map() 遍历数组处理后返回一个新数组。如果回调函数内不返回默认返回undefined数组
filter() 返回所有满足条件的元素形成新数组。与map()的不同是filter()只能返回元素不能返回处理后的值。
find() 返回数组中满足条件的元素只返回第一个。与filter()的不同是只返回第一个符合条件的元素。
findIndex() 返回数组中满足条件的元素的索引只返回第一个。
some() 用于检测数组中的元素是否满足指定条件只要有一个符合就返回true结束循环。
every() 用于检测数组所有元素是否满足指定条件一旦有一个不满足就返回false
reduce() 从左到右为每个数组元素执行一次回调函数并把上次回调函数的返回值放在一个暂存器中传给下次回调函数并返回最后一次回调函数的返回值。
reduceRight() 从右到左为每个数组元素执行一次回调函数并把上次回调函数的返回值放在一个暂存器中传给下次回调函数并返回最后一次回调函数的返回值。说明 forEach()forEach((item,index,array){}) 遍历数组无法通过item修改原数组。
map()map((item,index,array){}) 遍历数组返回新数组返回值由自己控制。
filter()filter((item,index,array){}) 与map不同该方法的作用是筛选元素。因此返回的数组中的项只能是原数组中的元素该方法将回调函数的返回值视为true和false视为true时返回该元素。
find()find(...)...数组拼接、转换 concat() 连接两个或更多的数组并返回结果。不会改变原数组
join() 把数组的所有元素放入一个字符串。元素通过指定的分隔符进行分隔。
toString() 把数组转换为字符串并返回结果。数组的排序 sort() 对数组的元素进行排序,返回排序后的数组
reverse() 颠倒数组中元素的顺序。用例 sort()默认排序顺序是在将元素转换为字符串然后比较它们的UTF-16代码单元值序列时构建的。let points [40, 100, 1, 5, 25, 10];points.sort(); // [1, 10, 100, 25, 40, 5]因此有时需要我们自定义排序条件。回调函数中a,b两个参数是用来比较的两个元素需要返回正值、0或负值。返回正值a会排到b之前返回0不改变相对位置返回负值b排到a之前。points.sort((a,b){return a-b})); // [1, 5, 10, 25, 40, 100]points.sort((a, b)》{return 0.5 - Math.random()}); // 随机排序数组深拷贝 1.json序列化和反序列化 没错这是个投机取巧的方法简单粗暴大部分基本类型都能都被有效拷贝。但也有一些弊端像MapsSetsRegExpsDatesArrayBuffers和其他内置类型这样的东西以及undefined、函数在序列化时会丢失。 2.MessageChannel 通过构造函数MessageChannel()可以创建一个消息通道实例化的对象会集成两个属性port1和port2这两个属性都是MessagePort对象。可以理解成电话两线的两端都可以收发数据。 MessagePort 我们可以为其添加属性 let ms new MessageChannel(); // 内含port1和port2
ms.port1.name Alex;
console.log(ms.port1); 可以看到MessagePort还有两个属性onmessage和onmessageerror他们都是接收到消息时的回调函数。收发数据 port1.postMessage(发送数据);
port2.onmessage (e) {console.log(port2接收数据,e.data)} 回归正题它除了可以用来通讯还可以用作深拷贝当然拷贝函数对象的时候还是会报错。 3.loadsh万全的深拷贝方案。 转载于:https://www.cnblogs.com/V587Chinese/p/11404916.html
