字符串,数组,对象操作方法

358 阅读7分钟

以下方法本人测试过

以下方法借鉴博客园 专业黑==>郭先生放晴的天空

如有其它数据操作方法,或者想知道什么数据操作方法欢迎评论取写出,我将测试并更新至文章,本文若有错误请指出我会更改,多谢

字符串操作方法

1.将数据类型转为字符串

方法一 toString()

var num = 24;
var mystr= num.toString();

方法二 String()

var num = 24;
var mystr = String(num);

方法三 "" +

var num = 24;
var mystr = "" +num;

2.字符串转为字符串数组

方法一 split

split()方法有两个参数

方法参数一参数二
split必选 从该参数指定的地方分割可选 该参数可指定返回的数组的最大长度。如果设置了该参数,则返回的数组长度不会大于该参数

参数一

var mystr = "qingchenghuwoguoxiansheng,woaishenghuo,woaiziji";
var arr1 = mystr.split(",")

参数二

var mystr="qingchenghuwoguoxiansheng,woaishenghuo,woaiziji";
var arr1 = mystr.split(",", 2)
var arr2 = mystr.split("", 10)

方法二 JSON.parse

var string = '123,456,789';
var arr = JSON.parse("[" + string + "]");

3.字符串剪切(删除)

方法一 slice

索引不是从0开始

var string = 'javascript';
var index = string.slice(3)

var string = 'javascript';
var index = string.slice(1,4)

方法参数一参数二
slice必需,规定从何处开始选取。如果是负数,那么它规定从数组尾部开始算起的位置。也就是说,-1 指最后一个元素,-2 指倒数第二个元素,以此类推可选。规定从何处结束选取。该参数是数组片断结束处的数组下标。如果没有指定该参数,那么切分的数组包含从 start 到数组结束的所有元素。如果这个参数是负数,那么它规定的是从数组尾部开始算起的元素

方法二 substring

该方法不可填写负数

var string = '2020-11-02';
var index = string.substring(4)

方法三 substr

var string = '2020-11-02';
var index = string.substr(4)
方法参数一参数二
substr必需,规定从何处开始选取。必须是数值。如果是负数,那么该参数声明从字符串的尾部开始算起的位置。也就是说,-1 指字符串中最后一个字符,-2 指倒数第二个字符,以此类推。可选,给定截取后的字符串长度

注:

1.slice() 可以为负数,如果起始位置为负数,则从字符串最后一位向前找对应位数并且向后取结束位置,如果为正整数则从前往后取起始位置到结束位置。

2.substring()只能非负整数,截取起始结束位置同slice()函数一致。

3.substr()与第一、第二种函数不同,从起始位置开始截取,结束位置为第二个参数截取的字符串最大长度。

以上三种函数未填第二参数时,自动截取起始位置到字符串末尾。

删除指定位置字符串

var str = "agasgagAfasfaAfasf";
var reg = new RegExp("a","gi");
var a = str.replace(reg,"");

属性 "g"、"i"分别用于指定全局匹配、区分大小写的匹配和多行匹配

4.符串合并拼接

方法一 加号拼接

只连接100个以下的字符串建议用这种方法最方便

var String = 'java';
var String = String + 'script';

方法二 数组的join 方法

var arr = ['hello','java','script']
var str = arr.join("")

方法三 字符串模板

var a = '字';
var b = '符';
var c = '串';
var d = '模';
var e = '板';
var str = `我是使用${a}${b}${c}${d}${e}生成的字符串`;

目前本人使用最多的是方法三,如有更多请在评论区写出持续更新

5.字符串替换

方法一 replace

替换掉检索到的第一匹配字符

var a = '2020-11-02';
var b = a.reolace('-','/')

替换掉检索到的所有字符

var a = '2020-11-02';
var b = a.reolace(/-/g,'/')

这里使用这个方法会出现一个问题上面我们使用的是时间格式的替换,就是如果换成字母字符串就会出现有区分大小写的问题,如果你想要替换掉一个字符串中所有的a就会出现以下情况,只有小写的a被替换掉了大写的A没有替换

var a = 'afasfAsf';
var b = a.replace(/a/gi,'1')
g 代表全局替换  i 代表 忽略大小写

6.字符串查询

方法一 indexof

最常用的方法之一indexof可返回第一个所匹配到的字符索引(从左到右搜索下标从0开始),如果没有则返回-1

var string = 'javascript';
var string = string.indexOf('a')

方法二 lastIndexOf 可返回最后一个所匹配到的字符索引

var string = 'javascript';
var string = string.indexOf('pt')

方法三 charAt

该方法用于返回给定索引的字符串值

var string = 'javascript';
var index = string.charAt(7);

还有一个不常用的就是返回编码值

var mystr="Hello World!";
var charCode=mystr. charCodeAt(7)

字符串大小写转换

var a = 'Javascript';
var da_xie = a.toUpperCase(); //转为大写
var xiao_xie = a.toLowerCase(); //转为小写

字符串去空格

trim方法用来删除字符串前后的空格

var mystr="     hello world      ";  
var trimStr=mystr.trim();    //hello world

数组操作方法

我们常用的数组操作方法分为改变源数组和不改变源数组

改变源数组方法

1.将数组中的元素颠倒顺序,reverse方法

var arr = [1,2,3,4,5,6,7,8,9];
var arr2 = arr.reverse();
console.log(arr)
console.log(arr2)

2.从数组中添加/删除元素,然后返回被删除的元素splice

1.删除指定位置以后元素

2.可以为负数使用负数可从数组结尾处规定位置

3.从指定位置删除几个元素

4.添加(将第二个参数设为0的话则不会删除任何元素)

3.删除数组随后一个元素pop()方法(删除)

pop() 方法将删除 arrayObject 的最后一个元素,把数组长度减 1,并且返回它删除的元素的值。如果数组已经为空,则 pop() 不改变数组,并返回 undefined 值。

    var arr1 = [1,2,3];
    var arr2 = arr1.pop()

4.删除第一个数组元素shift()方法(删除)

如果数组是空的,那么 shift() 方法将不进行任何操作,返回 undefined 值。请注意,该方法不创建新数组,而是直接修改原有的 arrayObject。

var arr1 = [1,2,3];
var arr2 = arr1.shift()

5.向数组开始添加元素unshift方法(添加)

unshift() 方法可向数组的开头添加一个或更多元素,并返回新的长度

var arr1 = [1,2,3];
var arr2 = arr1.unshift(0)

6.常用的push()方法就不说了,

不改变源数组

1.数组拼接的功能 ,返回新数组,concat方法(拼接)

也可以拼接对象

2.join方法(转换)

该方法与上述字符串中的一样,

var arr1 = [1,2,3,4];
var str = arr1.join();
str
"1,2,3,4"

3.slice方法(截取)

方法参数描述
slicestart必需。规定从何处开始选取。如果是负数,那么它规定从数组尾部开始算起的位置。也就是说,-1 指最后一个元素,-2 指倒数第二个元素,以此类推
end可选。规定从何处结束选取。该参数是数组片断结束处的数组下标。如果没有指定该参数,那么切分的数组包含从 start 到数组结束的所有元素。如果这个参数是负数,那么它规定的是从数组尾部开始算起的元素。

slice方法在截取时如果有end的话是不会包含end的,

下图中我们从下标2开始截取,下标2元素是3 结束下标是12,下标元素是13,也就是说,返回的是不会包含结束下标元素的

另外操作(查找)

1.indexOf 和 lastIndexOf

都接受两个参数:查找的值、查找起始位置 不存在,返回 -1 ;存在,返回位置。indexOf 是从前往后查找, lastIndexOf 是从后往前查找。

2.includes indexof

includes是ES6的方法,includes和indexOf都是检查是否包含指点元素,而不同的是includes返回的是true和false,indexOf返回的是如果有指定元素则返回位置,如果没有则返回-1,

方法参数描述
includessearchvalue要查找的值
start设置从那个位置开始查找,默认为 0。

includes方法的第二个参数表示搜索的起始位置,默认为 0 。如果第二个参数为负数,则表示倒数的位置,如果这时它大于数组长度(比如第二个参数为 -4 ,但数组长度为 3 ),则会重置为从 0 开始。

indexOf方法有两个缺点,一是不够语义化,它的含义是找到参数值的第一个出现位置,所以要去比较是否不等于 -1 ,表达起来不够直观。二是,它内部使用严格相当运算符( === )进行判断,这会导致对NaN的误判。

持续更新中...