Js常用方法(charAt、match、replace、split、splice、substr、join、pop、shift、filter以及判断对象中是否有某属性等)

置顶 smile@qingqing

已于 2024-07-12 10:26:40 修改

阅读量270

点赞数

分类专栏： javascript 文章标签： javascript html 正则表达式

于 2020-03-04 16:32:36 首次发布

本文链接：https://blog.csdn.net/weixin_43363871/article/details/104656430

版权

javascript 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

JS对象常用方法

String

charAt()

用于返回指定索引处的字符，索引范围为从 0 到 length - 1。

var str = 'welcome to learn about javascript methods'
var str1 = str.charAt(5);
var str2 = str.charAt(6, 26);

console.log(str1);     //m
console.log(str2);     //e(传入两个参数，不会报错，但是第二个参数默认无效)

结合charAt()实现统计字符串字母个数最多：

let str = 'aaaavvvvvddddbbbvvv';
let obj = {};
for (let index = 0; index < str.length; index++) {
    let data = str.charAt(index);    //'a','v','d','b'
    if (obj[data]) {
      obj[data]++;
    } else {
      obj[data] = 1;
    }
}
console.log('obj', obj);
let maxData = 0;
let maxLetter;
for (const key in obj) {
    if (obj[key] > maxData) {
      maxData = obj[key];
      maxLetter = key
    }
}
console.log('maxData', '字母' + maxLetter + '个数最多：' + maxData);

在这里插入图片描述

charCodeAt()

返回咋指定位置的字符的Unicode编码。

var str = "welcome to learn about javascript methods";
var str1 = str.charCodeAt(2);   
var str2 = str.charCodeAt(3);   
console.log(str1); //108，l的Unicode编码是108
console.log(str2); //99

match()

在字符串内检索指定的值或找到一个或多个正则表达式的匹配，返回的是值而不是值的位置。

var str1 = "welcome to learn about javascript methods";
var str2 = str1.match('lear'); 
var str3 = str1.match('anna');
console.log(str2);   //检索字符串，返回的是字符
console.log(str3);   //没有指定的字符，返回的是null

replace()

替换匹配的字符串。

var str1 = "how are you?";
var str2 = "how old are you?";
var str3 = str1.replace(str1.match('are'), str2.match('old are'));
console.log(str3);   //how old are you?

search()

var str1 = "how are you?";
var str2 = "how";
var str3 = "do";
var num1 = str1.search(str2); //返回的是第一个字符所在的位置
var num2 = str1.search(str3); //未检测到返回-1
console.log(num1);   //0
console.log(num2);   //-1

split()

var str1 = "how,old,are,you?";
console.log(str1.split(''));
var str2 = str1.split(',');
console.log(str2);
console.log(str1);//原字符串不变

toLocaleLowerCase()

把字符串转换成小写

var str = "HOW OLD are you?";
console.log(str.toLocaleLowerCase());
var str1 = str.toLocaleLowerCase();
console.log('-----------');
console.log(str1);
console.log(str);//原字符串不变

toLocaleUpperCase()

把字符串准换成大写.

var str = "HOW OLD are you?";
console.log(str.toLocaleUpperCase());   //HOW OLD ARE YOU?
var str1 = str.toLocaleUpperCase();
console.log(str1);    //HOW OLD ARE YOU?
console.log(str); //HOW OLD are you?

ECMAScript中涉及字符串大小写转换的方法有4个toLowerCase()、toLocaleLowerCase()、toUpperCase()和toLocaleUpperCase()。其中，toLowerCase()和toUpperCase()是两个经典的方法，借鉴自java.lang.String中的同名方法。而toLocaleLowerCase()和toLocaleUpperCase()方法则是针对特定地区的实现。

对有些地区来说，针对地区的方法与其通用方法得到的结果相同，但少数语言(如土耳其语言)会为Unicode大小写转换应用特殊的规则，这时候就必须使用针对地区的方法来保证实现正确的转换。🌰如下：
```
var stringValue = "hello world";
alert(stringValue.toLocaleUpperCase());    //"HELLO WORLD"
alert(stringValue.toUpperCase());          //"HELLO WORLD"
alert(stringValue.toLocaleLowerCase());    //"hello world"
alert(stringValue.toLowerCase());          //"hello world"
```
以上代码调用的toLocaleUpperCase()和toUpperCase()都返回了“HELLO WORLD”，就像调用toLocaleLowerCase()和toLowerCase()都返回“hello world”一样。一般来说，在不知道自己的代码将在那种语言环境中运行的情况下，还是使用针对地区的方法更稳妥一些。

substr()

在字符串中抽取从起始下标开始的指定数目的字符。

var str = "welcome to learn about javascript methods"
var str1 = str.substr(0, 10);//字符串中空格不占位置，从0开始，到10结束
console.log(str1);   //welcome to

subString()

方法用于提取字符串中介于两个指定下标之间的字符。

var str = "welcome to learn about javascript methods"
var str1 = str.substring(0, 12);
console.log(str1);   //welcome to l

array

slice()

返回从原数组中指定开始下标到结束下标之间的项组成的新数组（原数组不变）。
```
let arr=[1,2,3,4,5];
let arr1=arr.splice(2,3);
console.log(arr1);   //3,4,5  
```

splice()

删除：2个参数 —— 起始位置，删除的项数

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

插入：3个参数 —— 起始位置，删除的项数，插入的项

let arr=[1,2,3,4,5];
let arr1=arr.splice(2,1,'Anna');
console.log(arr1);  
console.log(arr);

替换：任意参数—— 起始位置，删除的项数，插入任意数量的项数

let arr=[1,2,3,4,5];
let arr1=arr.splice(2,3,'Anna','Jack','Tom');
console.log(arr1);
console.log(arr);

pop()

删除数组的最后一个元素，减少数组的长度，返回被删除的值。

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

shift()

删除数组的第一个参数，数组的长度减1，无参。

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

unshift()

像数组的开头添加一个或更多的元素，并返回新的长度。（参数不限）

var arr = [1, 2, 3, 4, 5];
console.log(arr.length);
var arr1 = arr.unshift('Linda', 'Censek',  { name: 'Anna' });
console.log(arr1); //返回的是新数组的长度
console.log(arr); //原数组被改变成新数组

join()

let arr=[1,2,3,4];
console.log(arr);
let arr1=arr.join(' ');
console.log(arr1);

every()

every是所有函数的每个回调都返回true的时候才会返回true，当遇到false的时候终止执行，返回false。

let arr = [1, 6, 8, -2, -5, 7, -4]
let isPositive = arr.every(value=> value > 0)
console.log(isPositive) // false

let arr1=[1,2,3];
let isPositive1 = arr1.every(value =>value > 0)
console.log(isPositive1);  //true

some()

some函数是存在有一个函数返回true的时候终止执行并返回true，否则返回false。

let arr = [1, 6, 8, -2, -5, 7, -4]
let isPositive = arr.some(value=> value > 0)
console.log(isPositive) // true

let arr1=[1,2,3];
let isPositive1 = arr1.some(value =>value > 0)
console.log(isPositive1);  //true

Array.isArray(obj)

 var arr = [3, 4, 5]
console.log(Array.isArray(arr)); // true
console.log(typeof arr); // object
console.log(arr.toString()); // 3,4,5
console.log(arr instanceof Array); //true

filter()

返回数组的一个子集，回调函数用于逻辑判断是否返回，返回true则把当前元素加到返回数组中，false则不加。

 var arr = [1, 6, 8, -2, -5, 7, -4]
var positiverArr = arr.filter((value)=> {
    return value > 0
})
console.log(positiverArr); // [1, 6, 8, 7]
console.log(arr); // [1, 6, 8, -2, -5, 7, -4]

reduce(function(v1,v2),value)

遍历数组，调用回调函数，将数组元素组合成一个值，reduce从索引最小值开始，方法有两个参数:

回调函数，把两个值合成一个，返回结果
value,一个初始值，可选

let arr = [1, 2, 3, 4, 5, 6]
let result=arr.reduce((v1, v2)=> {
    return v1 + v2;
}) 
console.log(result);// 21 (开始是1+2 = 3，之后3+3 =6，之后6+4 =10，之后10+5 =15，最后15+6 =21)

let result1=arr.reduce((v1, v2)=> {
    return v1 - v2;
}, 100) 
console.log(result1);// 79(开始的时候100-1=99，之后99-2=97，之后97-3=94，之后94-4=90，之后90-5=85，最后85-6=79)

JavaScript 判断对象中是否有某属性

let obj={
    "name":"Anna",
    "age":23
}

点( . )或者方括号( [ ] )

通过点或者方括号可以获取对象的属性值，如果对象上不存在该属性，则会返回undefined。
```
let isName=obj.name;
let isName1=obj['name'];
let isAddress=obj.address;
console.log(isName);   //Anna
console.log(isName1);  //Anna
console.log(isAddress);   //undefined
```
所以，我们可以根据 Obj.x !== undefined 的返回值来判断Obj是否有x属性。

这种方式很简单方便，局限性就是：不能用在x的属性值存在，但可能为 undefined的场景。in运算符可以解决这个问题。

in

如果指定的属性在指定的对象或其原型链中，则in 运算符返回true。
```
let isName = 'name' in obj;
let isAddress = 'address' in obj;
console.log(isName);   //true
console.log(isAddress);  //false
```
这种方式的局限性就是无法区分自身和原型链上的属性，在只需要判断自身属性是否存在时，这种方式就不适用了。这时需要hasOwnProperty()

hasOwnProperty()

let obj={
    "name":"Anna",
    "age":23
}
let isName=obj.hasOwnProperty("name");
let isAddress=obj.hasOwnProperty("address");
console.log(isName);   //true
console.log(isAddress);  //false

可以看到，只有自身存在该属性时，才会返回true。适用于只判断自身属性的场景。

数组最大最小值

  let arr = [1, 2, 3, 4, 5];
  let resultMax = arr.reduce((a, b) => a > b ? a : b);
  console.log('resultMax', resultMax);   //5
  let resultMin = arr.reduce((a, b) => a < b ? a : b);
  console.log('resultMin', resultMin);   //1

一维数组转对象

let arrOne = ['a', 'b', 'c'];
let obj = { ...arrOne };
console.log('obj', obj);   //{0: 'a', 1: 'b', 2: 'c'}

深拷贝值

JSON.parse(JSON.stringify(variables1));

简化if语句

简化前

if (
      this.billingTypeModel === 1006 ||
      this.billingTypeModel === 1013 ||
      this.billingTypeModel === 1014
    ) {
  	this.btn=true;
  	}

简化后

if ([1006, 1013, 1014].includes(this.billingTypeModel)) {
   this.btn=true;
}

使用变量作为对象的键

const dynamicKey = 'name';
const value = '张三';

// 使用一个动态的变量作为 key
const obj = {[dynamicKey]: value};

// 结果: obj = { name: '张三' }

smile@qingqing

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
1
评论
Js常用方法(charAt、match、replace、split、splice、substr、join、pop、shift、filter以及判断对象中是否有某属性等)

JS对象常用方法StringcharAt()用于返回指定索引处的字符，索引范围为从 0 到 length() - 1。var str = 'welcome to learn about javascript methods'var str1 = str.charAt(5);var str2 = str.charAt(6, 26);console.log(str1); /...
复制链接

扫一扫

专栏目录