JS数组、对象、字符串常用方法汇总

JS数组、对象、字符串常用方法汇总

    • 前言
    • 数组常用方法
      • arrayObject.slice(start,end)
      • arrayObject.map()
      • arrayObject.forEach()
      • arrayObject.filter()
      • arrayObject.every()
      • arrayObject.some()
      • arrayObject.reduce()
      • arrayObject.push()
      • arrayObject.pop()
      • arrayObject.shift()
      • arrayObject.unshift()
      • Array.isArray()
      • arrayObject.concat()
      • arrayObject.toString()
      • arrayObject.join()
      • arrayObject.splice(开始删除的位置, 删除的个数,删除后新插入的元素)
      • arrayObject.sort()
      • arrayObject.find()
      • arrayObject.findIndex()
      • arrayObject.includes()
      • arrayObject.reverse()
      • arrayObject.fill(value, start, end)
      • Array.from()
    • 对象常用方法
      • Object.keys()
      • Object.values()
      • Object.assign()
      • Object.create()
      • Object.defineProperty()
      • Object.entries()
      • Object.freeze()
      • Object.fromEntries()
      • Object.is()
      • Object.isFrozen()
    • 字符串常用方法
      • concat()
      • indexOf(searchvalue, fromindex)
      • charAt(index)
      • string.lastIndexOf(searchvalue,start)
      • match
      • string.substring(start,stop)
      • string.substr(start,length)
      • string.replace(regexp/substr, replacement)
      • string.search()
      • string.split(separator,howmany)
      • string.length()
      • string.toLowerCase()
      • string.toUpperCase()
      • string.includes()
      • string.startsWith()
      • string.endsWith()
      • string.padStart()
      • string.padEnd()
    • 结尾
    • 参考

前言

2018年的中秋过后,开始从事前端,2018年9月25日实习到2019年5月15日转正,到今天刚好一年,但是前端能力上的提升却非常有限,这点得反思.得有危机意识.

工作中,样式和结构写得多,js逻辑相对少,时不时用到数组相关的方法还得上网搜,于是今天整理下来,希望以后常见的方法不再需要上网搜

Ctrl + F快速搜索定位

数组常用方法

ps:
箭头函数函数体加了{} 就需要加上return 不然返回undefined
箭头函数函数体不加{} 就可以不加return
方法传入的回调函数有三个参数:(当前的数组元素, 当前索引值, 调用方法的数组)

arrayObject.slice(start,end)

slice() 方法可从已有的数组中返回选定的元素。
请注意,该方法并不会修改数组,而是返回一个子数组。如果想删除数组中的一段元素,应该使用方法 Array.splice()。

let arr = [1, 2, 3, 4, 5]
let newArr = arr.slice(1)
// arr= [1, 2, 3, 4, 5]   原数组保持不变
// newArr = [2, 3, 4, 5] 返回新数组

arrayObject.map()

将数组中的每个元素调用一个提供的函数,结果作为一个新的数组返回不改变原来的数组

let arr = [1, 2, 3, 4, 5]
let newArr = arr.map(x => x * 2)
// arr= [1, 2, 3, 4, 5]   原数组保持不变
// newArr = [2, 4, 6, 8, 10] 返回新数组

arrayObject.forEach()

将数组中的每个元素调用一个提供的函数,没有返回值,直接改变原数组,注意和map方法区分

let arr = [1, 2, 3, 4, 5]
arr.forEach(x => x * 2)
// arr = [2, 4, 6, 8, 10]  数组改变,注意和map区分

arrayObject.filter()

将所有元素进行判断,将满足条件的元素作为一个新的数组返回

let arr = [1, 2, 3, 4, 5]
let newArr = arr.filter(x => {
	return x >= 3
})
// 箭头函数加了{} 就需要加上return 不然返回undefined
// 箭头函数不加{} 就可以不加return
let newArr = arr.filter(x => x >= 3)
//newNum = [3, 4, 5] 满足条件的元素返回为一个新的数组

//数组去重
let myArr = [1,3,4,5,6,3,7,4];
console.log(myArr.filter((value,index,arr)=>arr.indexOf(value)===index));
//[ 1, 3, 4, 5, 6, 7 ]

arrayObject.every()

将所有元素进行判断返回一个布尔值,如果所有元素都满足判断条件,则返回true,否则为false:

let arr = [1, 2, 3, 4, 5]
const isLessThan4 = value => value < 4
const isLessThan6 = value => value < 6
arr.every(isLessThan4 ) //false
arr.every(isLessThan6 ) //true

arrayObject.some()

将所有元素进行判断返回一个布尔值,如果存在元素都满足判断条件,则返回true,若所有元素都不满足判断条件,则返回false

let arr= [1, 2, 3, 4, 5]
const isLessThan4 = value => value < 4
const isLessThan6 = value => value > 6
arr.some(isLessThan4 ) //true
arr.some(isLessThan6 ) //false

arrayObject.reduce()

将所有元素调用返回函数,返回值为最后结果,传入的值必须是函数类型

let arr = [1, 2, 3, 4, 5]
const add = (a, b) => {
	console.log("a:" + a + ";b:" + b)
	return a + b
}
let sum = arr.reduce(add)
// a:1;b:2
// a:3;b:3
// a:6;b:4
// a:10;b:5
// console.log(sum) // 15  相当于累加的效果
// 与之相对应的还有一个 Array.reduceRight() 方法,区别是这个是从右向左操作的

arrayObject.push()

在数组的后面添加新加元素,此方法改变了数组的长度

let arr = [1, 2, 3, 4, 5]
arr.push(6, 7, 8)
console.log(arr) // [1, 2, 3, 4, 5, 6, 7, 8]

arrayObject.pop()

此方法删除数组最后一个元素,并返回数组,此方法改变了数组的长度

let arr = [1, 2, 3, 4, 5]
arr.pop()
console.log(arr) //[1, 2, 3, 4]
console.log(arr.length) //4

arrayObject.shift()

此方法删除数组第一个元素,并返回数组,此方法改变了数组的长度

let arr = [1, 2, 3, 4, 5]
arr.shift()
console.log(arr) // [2, 3, 4, 5]
console.log(arr.length) // 4 

arrayObject.unshift()

此方法是将一个或多个元素添加到数组的开头,并返回新数组的长度:

let arr = [1, 2, 3, 4, 5]
arr.unshift(6, 7)
console.log(arr) //[6, 7, 1, 2, 3, 4, 5]
console.log(arr.length) //7

Array.isArray()

判断一个对象是不是数组,返回的是布尔值

let str1 = 'hello world'
let arr1 = ['hello', 'world']
Array.isArray(str1) // false
Array.isArray(arr1) // true

arrayObject.concat()

此方法可以将多个数组拼接成一个数组:
“concat creates a new array consisting of the elements in the object on which it is called, followed in order by, for each argument, the elements of that argument (if the argument is an array) or the argument itself (if the argument is not an array).”
concat
如果concat方法的参数是一个元素,该元素会被直接插入到新数组中;如果参数是一个数组,该数组的各个元素将被插入到新数组中;

let arr1 = [1, 2, 3]
arr2 = [4, 5]
let arr = arr1.concat(arr2)
console.log(arr)//[1, 2, 3, 4, 5]

二维数组降维

let arr = [1, 2, 3, [4, 5, 6], 7, 8, [9, 10]];
function reduceDimen(arr) {
  let reduce = [];
  for (let i = 0; i < arr.length; i++) {
    reduce = reduce.concat(arr[i]);
  }
  return reduce;
}
reduceDimen(arr); // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

arrayObject.toString()

此方法将数组转化为字符串

let arr = [1, 2, 3, 4, 5];
let str = arr.toString()
console.log(str)// 1,2,3,4,5

arrayObject.join()

此方法也是将数组转化为字符串

let arr = [1, 2, 3, 4, 5];
let str1 = arr.toString()
let str2 = arr.toString(',')
let str3 = arr.toString('##')
console.log(str1)// 12345
console.log(str2)// 1,2,3,4,5
console.log(str3)// 1##2##3##4##5
// 可以跟toString()对比

arrayObject.splice(开始删除的位置, 删除的个数,删除后新插入的元素)

这方法可以实现增删改:

let arr = [1, 2, 3, 4, 5];
let arr1 = arr.splice(2, 0 'haha')
let arr2 = arr.splice(2, 3)
let arr1 = arr.splice(2, 1 'haha')
console.log(arr1) //[1, 2, 'haha', 3, 4, 5]新增一个元素
console.log(arr2) //[1, 2] 删除三个元素
console.log(arr3) //[1, 2, 'haha', 4, 5] 替换一个元素

arrayObject.sort()

这方法可以将数组元素排序,传进一个函数,函数带两个参数
第一参数a, 第二参数b
a-b升序 b-a降序

// 升序
let arr = [77, 99, 115, 135, 147, 191, 197, 219, 221, 227, 229, 233, 237, 269, 30, 189, 63, 87, 121, 143, 201, 211, 243, 12, 17, 9, 171, 279, 23, 24, 31, 34, 35, 37, 53, 55, 59, 60, 61, 62, 67, 68, 71, 75, 89, 91, 95, 107, 109, 123, 137, 139, 149, 165, 173, 175, 185, 205, 213, 217, 225, 239, 293, 294, 275, 296, 297]
arr.sort((a,b) => {
	return a - b
	})
console.log(arr) 
// [9, 12, 17, 23, 24, 30, 31, 34, 35, 37, 53, 55, 59, 60, 61, 62, 63, 67, 68, 71, 75, 77, 87, 89, 91, 95, 99, 107, 109, 115, 121, 123, 135, 137, 139, 143, 147, 149, 165, 171, 173, 175, 185, 189, 191, 197, 201, 205, 211, 213, 217, 219, 221, 225, 227, 229, 233, 237, 239, 243, 269, 275, 279, 293, 294, 296, 297]

// 降序
arr.sort((a, b) => {
	return b - a
	})
console.log(arr) 
// [297, 296, 294, 293, 279, 275, 269, 243, 239, 237, 233, 229, 227, 225, 221, 219, 217, 213, 211, 205, 201, 197, 191, 189, 185, 175, 173, 171, 165, 149, 147, 143, 139, 137, 135, 123, 121, 115, 109, 107, 99, 95, 91, 89, 87, 77, 75, 71, 68, 67, 63, 62, 61, 60, 59, 55, 53, 37, 35, 34, 31, 30, 24, 23, 17, 12, 9]

arrayObject.find()

此方法返回通过函数判断的数组第一个元素的值。

let arr1 = [1, 2, 3, 4]
let str = arr1.find((x) => {
	return x > 2
	})
console.log(str ) // 3
// 如果没有符合条件的元素 返回undefined

arrayObject.findIndex()

findIndex()与find()的使用方法相同,只是当条件为true时findIndex()返回的是索引值,而find()返回的是元素。如果没有符合条件元素时findIndex()返回的是-1,而find()返回的是undefined。

const bookArr=[
    {
        id:1,
        bookName:"三国演义"
    },
    {
        id:2,
        bookName:"水浒传"
    },
    {
        id:3,
        bookName:"红楼梦"
    },
    {
        id:4,
        bookName:"西游记"
    }
];
var i=bookArr.findIndex((value)=>value.id==4);
console.log(i);// 3
var i2=bookArr.findIndex((value)=>value.id==100);
console.log(i2);// -1

arrayObject.includes()

用来判断一个数组是否包含一个指定的值,如果是返回 true,否则false。

let site = ['runoob', 'google', 'taobao']
site.includes('runoob') // true 
site.includes('baidu')  // false

arrayObject.reverse()

用于颠倒数组中元素的顺序

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

document.write(arr + "
"
) // George,John,Thomas document.write(arr.reverse()) // Thomas,John,George

arrayObject.fill(value, start, end)

fill() 方法用于将一个固定值替换数组的元素。

value	必需。填充的值。
start	可选。开始填充位置。
end 	可选。停止填充位置 (默认为 array.length)

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.fill("Runoob", 2, 4); // ["Banana", "Orange", "Runoob", "Runoob"]

Array.from()

Array.from()就是将一个类数组对象或者可遍历对象转换成一个真正的数组。(ES6)

let arrayLike = {
    0: 'tom', 
    1: '65',
    2: '男',
    3: ['jane','john','Mary'],
    'length': 4
}
let arr = Array.from(arrayLike)
console.log(arr) // ['tom','65','男',['jane','john','Mary']]

对象常用方法

Object.keys()

会返回一个由一个给定对象的自身可枚举属性组成的数组,数组中属性名的排列顺序和使用 for…in 循环遍历该对象时返回的顺序一致 。

// simple array
var arr = ['a', 'b', 'c'];
console.log(Object.keys(arr)); // console: ['0', '1', '2']
 
// array like object
var obj = { 0: 'a', 1: 'b', 2: 'c' };
console.log(Object.keys(obj)); // console: ['0', '1', '2']
 
// array like object with random key ordering
var anObj = { 100: 'a', 2: 'b', 7: 'c' };
console.log(Object.keys(anObj)); // console: ['2', '7', '100']
 
// getFoo is a property which isn't enumerable
var myObj = Object.create({}, {
  getFoo: {
    value: function () { return this.foo; }
  } 
});
myObj.foo = 1;
console.log(Object.keys(myObj)); // console: ['foo']

Object.values()

方法返回一个给定对象自身的所有可枚举属性值的数组,值的顺序与使用for…in循环的顺序相同 ( 区别在于 for-in 循环枚举原型链中的属性 )。

var obj = { foo: 'bar', baz: 42 };
console.log(Object.values(obj)); // ['bar', 42]
 
// array like object
var obj = { 0: 'a', 1: 'b', 2: 'c' };
console.log(Object.values(obj)); // ['a', 'b', 'c']
 
// array like object with random key ordering
// when we use numeric keys, the value returned in a numerical order according to the keys
var an_obj = { 100: 'a', 2: 'b', 7: 'c' };
console.log(Object.values(an_obj)); // ['b', 'c', 'a']
 
// getFoo is property which isn't enumerable
var my_obj = Object.create({}, { getFoo: { value: function() { return this.foo; } } });
my_obj.foo = 'bar';
console.log(Object.values(my_obj)); // ['bar']
 
// non-object argument will be coerced to an object
console.log(Object.values('foo')); // ['f', 'o', 'o']

Object.assign()

用于将所有可枚举属性的值从一个或多个源对象复制到目标对象。返回目标对象。
Object.assign()方法的第一个参数是目标对象后面的参数都是源对象。(如果目标对象与源对象有同名属性,或多个源对象有同名属性,则后面的属性会覆盖前面的属性)

const target = { a: 1, b: 2 };
const source = { b: 4, c: 5 };
const returnedTarget = Object.assign(target, source);
console.log(target);
// expected output: Object { a: 1, b: 4, c: 5 }
console.log(returnedTarget);
// expected output: Object { a: 1, b: 4, c: 5 }

Object.create()

创建一个新对象,使用现有的对象来提供新创建的对象的__proto__。

const person = {
isHuman: false,
printIntroduction () {
	console.log(`My name is ${this.name},Am I Human? ${this.isHuman}`)
	}
}
const me = Object.create(person)
me.name = "Matthew"; // "name" is a property set on "me", but not on "person"
me.isHuman = true; // inherited properties can be overwritten
 
me.printIntroduction();
// expected output: "My name is Matthew. Am I human? true"

Object.defineProperty()

直接在一个对象上定义新的属性或修改现有属性,并返回该对象

一般通过为对象的属性赋值的情况下,对象的属性可以修改也可以删除,但是通过Object.defineProperty()定义属性,通过描述符的设置可以进行更精准的控制对象属性

Object.defineProperty(obj, prop, desc)
  • obj 需要定义属性的当前对象
  • prop 当前需要定义的属性名
  • desc 属性描述符,是一个对象

描述符中的某些属性被省略,会使用以下默认规则
JS数组、对象、字符串常用方法汇总_第1张图片
存取描述符 --是由一对 getter、setter 函数功能来描述的属性
get:一个给属性提供getter的方法,如果没有getter则为undefined。该方法返回值被用作属性值。默认为undefined。
set:一个给属性提供setter的方法,如果没有setter则为undefined。该方法将接受唯一参数,并将该参数的新值分配给该属性。默认值为undefined。

let Person = {}
let temp = null
Object.defineProperty(Person, 'name', {
  get: function () {
    return temp
  },
  set: function (val) {
    temp = val
  }
})
Person.name // null
Person.name = 'Web泓' // Web泓

最近看Vue元源码看到了上面的内容,Vue之所以可以通过this.message来访问到data选项中定义的message变量,实现方法中用到了Object.defineProperty()方法

部分源码如下,

export function proxy (target: Object, sourceKey: string, key: string) {
  sharedPropertyDefinition.get = function proxyGetter () {
    return this[sourceKey][key]
  }
  sharedPropertyDefinition.set = function proxySetter (val) {
    this[sourceKey][key] = val
  }
  Object.defineProperty(target, key, sharedPropertyDefinition)
}

target参数可以理解为Vue实例对象
sourceKey参数可以理解为data选项
key参数可以理解为data选项里定义的变量名

有兴趣可以看下面的博客
Vue源码学习(持续更新中)

Object.entries()

返回一个给定对象自身可枚举属性的键值对数组,其排列与使用 for…in 循环遍历该对象时返回的顺序一致(区别在于 for-in 循环也枚举原型链中的属性)

const obj = { foo: 'bar', baz: 42 };
console.log(Object.entries(obj)); // [ ['foo', 'bar'], ['baz', 42] ]

// array like object
const obj = { 0: 'a', 1: 'b', 2: 'c' };
console.log(Object.entries(obj)); // [ ['0', 'a'], ['1', 'b'], ['2', 'c'] ]

// array like object with random key ordering
const anObj = { 100: 'a', 2: 'b', 7: 'c' };
console.log(Object.entries(anObj)); // [ ['2', 'b'], ['7', 'c'], ['100', 'a'] ]

// getFoo is property which isn't enumerable
const myObj = Object.create({}, { getFoo: { value() { return this.foo; } } });
myObj.foo = 'bar';
console.log(Object.entries(myObj)); // [ ['foo', 'bar'] ]

// non-object argument will be coerced to an object
console.log(Object.entries('foo')); // [ ['0', 'f'], ['1', 'o'], ['2', 'o'] ]

// iterate through key-value gracefully
const obj = { a: 5, b: 7, c: 9 };
for (const [key, value] of Object.entries(obj)) {
  console.log(`${key} ${value}`); // "a 5", "b 7", "c 9"
}

// Or, using array extras
Object.entries(obj).forEach(([key, value]) => {
console.log(`${key} ${value}`); // "a 5", "b 7", "c 9"
});

Object.freeze()

可以冻结一个对象。一个被冻结的对象再也不能被修改;冻结了一个对象则不能向这个对象添加新的属性,不能删除已有属性,不能修改该对象已有属性的可枚举性、可配置性、可写性,以及不能修改已有属性的值。此外,冻结一个对象后该对象的原型也不能被修改。freeze() 返回和传入的参数相同的对象。

const object1 = {
  property1: 42
};
 
const object2 = Object.freeze(object1);
 
object2.property1 = 33;
// Throws an error in strict mode
 
console.log(object2.property1);
// expected output: 42

Object.fromEntries()

把键值对列表转换为一个对象。

 Map 转化为 Object
通过 Object.fromEntries, 可以将 Map 转化为 Object:
 
const map = new Map([ ['foo', 'bar'], ['baz', 42] ]);
const obj = Object.fromEntries(map);
console.log(obj); // { foo: "bar", baz: 42 }
 
Array 转化为 Object
通过 Object.fromEntries, 可以将 Array 转化为 Object:
 
const arr = [ ['0', 'a'], ['1', 'b'], ['2', 'c'] ];
const obj = Object.fromEntries(arr);
console.log(obj); // { 0: "a", 1: "b", 2: "c" }
对象转换为Object
Object.fromEntries 是 Object.entries() 的反转函数, 借用 array manipulation methods 可以转换对象,如下:
 
const object1 = { a: 1, b: 2, c: 3 };
 
const object2 = Object.fromEntries(
  Object.entries(object1)
  .map(([ key, val ]) => [ key, val * 2 ])
);
 
console.log(object2);
// { a: 2, b: 4, c: 6 }

Object.is()

判断两个值是否是相同的值

Object.is('foo', 'foo');     // true
Object.is(window, window);   // true
 
Object.is('foo', 'bar');     // false
Object.is([], []);           // false
 
var foo = { a: 1 };
var bar = { a: 1 };
Object.is(foo, foo);         // true
Object.is(foo, bar);         // false
 
Object.is(null, null);       // true
 
// 特例
Object.is(0, -0);            // false
Object.is(-0, -0);           // true
Object.is(NaN, 0/0);         // true

Object.isFrozen()

判断一个对象是否被冻结

// 使用Object.freeze是冻结一个对象最方便的方法.
var frozen = { 1: 81 };
Object.isFrozen(frozen) //=== false
Object.freeze(frozen);
Object.isFrozen(frozen) //=== true
 
// 一个冻结对象也是一个密封对象.
Object.isSealed(frozen) //=== true
 
// 当然,更是一个不可扩展的对象.
Object.isExtensible(frozen) //=== falseES5 中,如果参数不是一个对象类型,将抛出一个TypeError异常。在 ES2015 中,非对象参数将被视为一个冻结的普通对象,因此会返回true。
 
Object.isFrozen(1);
// TypeError: 1 is not an object (ES5 code)
 
Object.isFrozen(1);
// true                          (ES2015 code)

字符串常用方法

concat()

将两个或多个字符的文本组合起来,返回一个新的字符串。

var a = "hello";
var b = ",world";
var c = a.concat(b); // c = "hello,world"

indexOf(searchvalue, fromindex)

返回字符串中一个子串第一处出现的索引(从左到右搜索)。如果没有匹配项,返回 -1 。

var a = "hello";
var index1 = a.indexOf("l");
//index1 = 2
var index2 = a.indexOf("l",3);
//index2 = 3

charAt(index)

返回指定位置的字符,index范围为从 0 到 length() - 1,否则返回空字符串.

var a = "hello";
var get_char = a.charAt(0);
//get_char = "h"

string.lastIndexOf(searchvalue,start)

返回字符串中一个子串最后一处出现的索引(从右到左搜索),如果没有匹配项,返回 -1 。

var a = "hello";
var index1 = a.lastIndexOf('l');
//index1 = 3
var index2 = a.lastIndexOf('l',2)
//index2 = 2

// 这里好像有点问题 试了好像不是从右到左搜索

match

检查一个字符串匹配一个正则表达式内容,如果没有匹配返回 null。

var a = "hello";
var b = ",world";
var re = new RegExp(/^\w+$/);
var is_alpha1 = a.match(re);
//is_alpha1 = "hello"
var is_alpha2 = b.match(re);
//is_alpha2 = null 

// 这里正则表达式 还得补补 

string.substring(start,stop)

返回字符串的一个子串,传入参数是起始位置和结束位置。

var a = "hello";
var sub_string1 = a.substring(1);
//sub_string1 = "ello"
var sub_string2 = a.substring(1,4);
//sub_string2 = "ell"

string.substr(start,length)

返回字符串的一个子串,传入参数是起始位置和长度

var a = "hello";
var sub_string1 = a.substr(1);
//sub_string1 = "ello"
var sub_string2 = a.substr(1,4);
//sub_string2 = "ello"

string.replace(regexp/substr, replacement)

replace() 方法用于在字符串中用一些字符替换另一些字符,或替换一个与正则表达式匹配的子串。

var a = "hello";
var b = ',World'
var re = new RegExp(/^\w+$/);
var result1 = a.replace(re,"Hello");
//result1 = "Hello"
var result2 = a.replace('o',"o, Hello");
//result2 = "hello, Hello"

string.search()

search() 方法用于检索字符串中指定的子字符串,或检索与正则表达式相匹配的子字符串,否则返回 -1 。

var a = "hello";
var b = ",world";
var re = new RegExp(/^\w+$/);
var index1 = a.search(re);
//index1 = 0
var index2 = b.search(re);
//index2 = -1

###. string.slice(start, end)
提取字符串的一部分,并返回一个新字符串(与 substring 相同)。
从start开始到end,不包括end

var a = "hello";
var sub_string1 = a.slice(1);
//sub_string1 = "ello"
var sub_string2 = a.slice(1,4);
//sub_string2 = "ell"

从身份证获取出生年月日,性别(第17位,偶数为男,奇数为女)

const idcard = '445281199508071556'
const year = idcard.slice(6, 10) // 1995
const month = idcard.slice(10, 12) // 08
const day = idcard.slice(12, 14) // 07
const sex = (idcard.slice(16, 17)) % 2 === 0 ? '女' : '男' // 男

string.split(separator,howmany)

通过将字符串划分成子串,将一个字符串做成一个字符串数组。
separator:字符串或正则表达式,从该参数指定的地方分割
howmany:该参数可指定返回的数组的最大长度。如果设置了该参数,返回的子串不会多于这个参数指定的数组。如果没有设置该参数,整个字符串都会被分割,不考虑它的长度。

var a = "hello";
var arr1 = a.split("");
//arr1 = [h,e,l,l,o]

string.length()

返回字符串的长度,所谓字符串的长度是指其包含的字符的个数。

var a = "hello";
var len = a.length();
//len = 5

string.toLowerCase()

将整个字符串转成小写字母。

var a = "hello";
var lower_string = a.toLowerCase();
//lower_string = "hello"

string.toUpperCase()

将整个字符串转成大写字母。

var a = "hello";
var upper_string = a.toUpperCase();
//upper_string = "HELLO"

string.includes()

用于判断字符串是否包含指定的子字符串。(区分大小写)

let str = "Hello world, welcome to the Runoob。";
let n = str.includes("world"); // true

string.startsWith()

用于判断字符串是否以指定的子字符串开头。(区分大小写)

let str = "Hello world, welcome to the Runoob。";
let n = str.startsWith("h"); // true

string.endsWith()

用于判断字符串是否以指定的子字符串结尾。(区分大小写)

let str = "Hello world, welcome to the Runoob";
let n = str.endsWith("Runoob"); // true

string.padStart()

ES2017 引入了字符串补全长度的功能。如果某个字符串不够指定长度,会在头部或尾部补全。padStart()用于头部补全,padEnd()用于尾部补全。

  • padStart()和padStart()一共接受两个参数,第一个参数用来指定字符串的最小长度,第二个参数是用来补全的字符串
  • 如果原字符串的长度,等于或大于指定的最小长度,则返回原字符串。
  • 如果用来补全的字符串与原字符串,两者的长度之和超过了指定的最小长度,则会截去超出位数的补全字符串。
  • 如果省略第二个参数,默认使用空格补全长度。
'x'.padStart(5, 'ab') // 'ababx'
'x'.padStart(4, 'ab') // 'abax'

string.padEnd()

'x'.padEnd(5, 'ab') // 'xabab'
'x'.padEnd(4, 'ab') // 'xaba'
'1304909'.padEnd(11, '0') // '13049090000'

结尾

这些都是比较常用的数组方法,有时候用得少了,再次用时就会忘记,需要上网搜,现在整理一下,希望这些常用的数组方法可以不用再搜

参考

  1. js中数组常用方法总结
  2. js对象方法大全
  3. js 字符串常用方法

你可能感兴趣的:(javascript)