JavaScript常用数组、字符串、Object方法

本文详细介绍了JavaScript中数组和对象的常用方法,如添加、删除、遍历、搜索、排序、转换以及对象的创建、属性定义、访问和操作,帮助读者更好地理解和使用这些功能。
摘要由CSDN通过智能技术生成

数组

JavaScript中的数组提供了一系列的方法来进行元素的添加、删除、遍历、搜索、排序和转换等操作。以下是一些常用的数组方法及其示例:

添加和删除元素

push(): 在数组的末尾添加一个或多个元素,并返回新的长度。

  let fruits = ['apple', 'banana'];
  fruits.push('orange'); // ['apple', 'banana', 'orange']

pop(): 删除数组的最后一个元素,并返回该元素。

  let fruits = ['apple', 'banana', 'orange'];
  let last = fruits.pop(); // 'orange', fruits = ['apple', 'banana']

unshift(): 在数组的开头添加一个或多个元素,并返回新的长度。

  let fruits = ['banana', 'orange'];
  fruits.unshift('apple'); // ['apple', 'banana', 'orange']

shift(): 删除数组的第一个元素,并返回该元素。

  let fruits = ['apple', 'banana', 'orange'];
  let first = fruits.shift(); // 'apple', fruits = ['banana', 'orange']

遍历数组

forEach(): 对数组的每个元素执行一次给定的函数。

  let fruits = ['apple', 'banana', 'orange'];
  fruits.forEach(function(item, index) {
    console.log(index, item);
  });

搜索和过滤

find(): 返回数组中满足提供的测试函数的第一个元素的值,否则返回undefined

  let numbers = [5, 12, 8, 130, 44];
  let found = numbers.find(element => element > 10); // 12

filter(): 创建一个新数组,其包含通过所提供函数实现的测试的所有元素。

  let numbers = [5, 12, 8, 130, 44];
  let largeNumbers = numbers.filter(element => element > 10); // [12, 130, 44]

转换数组

map(): 创建一个新数组,其结果是该数组中的每个元素是调用一次提供的函数后的返回值。

  let numbers = [1, 4, 9];
  let roots = numbers.map(Math.sqrt); // [1, 2, 3]

reduce(): 对数组中的每个元素执行一个由您提供的reducer函数(升序执行),将其结果汇总为单个返回值。

  let numbers = [1, 2, 3, 4];
  let sum = numbers.reduce((accumulator, currentValue) => accumulator + currentValue, 0); // 10

排序数组

sort(): 对数组的元素进行排序,并返回数组。默认排序顺序是在将元素转换为字符串,然后比较它们的UTF-16代码单元值序列时构建的。

  let fruits = ['banana', 'orange', 'apple'];
  fruits.sort(); // ['apple', 'banana', 'orange']

其他

slice(): 返回一个新的数组对象,这一对象是一个由beginend(不包括end)决定的原数组的浅拷贝。原始数组不会被改变。

  let fruits = ['apple', 'banana', 'orange', 'lemon'];
  let citrus = fruits.slice(2, 4); // ['orange', 'lemon']

join(): 将一个数组(或一个类数组对象)的所有元素连接成一个字符串并返回这个字符串。

  let elements = ['Fire', 'Air', 'Water'];
  console.log(elements.join()); // "Fire,Air,Water"
  console.log(elements.join('')); // "FireAirWater"
  console.log(elements.join('-')); // "Fire-Air-Water"

字符串

JavaScript中的字符串对象提供了许多方法来处理文本。以下是一些常用的字符串方法及其示例:

检查和搜索

includes(): 判断字符串是否包含指定的子字符串。

  let text = "Hello world!";
  console.log(text.includes("world")); // true

startsWith(): 判断字符串是否以指定的子字符串开始。

  let text = "Hello world!";
  console.log(text.startsWith("Hello")); // true

endsWith(): 判断字符串是否以指定的子字符串结束。

  let text = "Hello world!";
  console.log(text.endsWith("!")); // true

indexOf(): 返回指定子字符串在字符串中首次出现的索引,如果没有找到子字符串,则返回-1。

  let text = "Hello world!";
  console.log(text.indexOf("world")); // 6

修改和替换

replace(): 替换字符串中的某个值。

  let text = "Hello world!";
  let newText = text.replace("world", "everyone");
  console.log(newText); // "Hello everyone!"

toUpperCase(): 将字符串转换为大写。

  let text = "Hello world!";
  console.log(text.toUpperCase()); // "HELLO WORLD!"

toLowerCase(): 将字符串转换为小写。

  let text = "Hello World!";
  console.log(text.toLowerCase()); // "hello world!"

trim(): 去除字符串两端的空白字符。

  let text = "  Hello world!  ";
  console.log(text.trim()); // "Hello world!"

分割和连接

split(): 根据指定的分隔符将字符串分割成数组。

  let text = "Hello world!";
  let words = text.split(" ");
  console.log(words); // ["Hello", "world!"]

slice(): 提取字符串的某个部分,并返回新的字符串。

  let text = "Hello world!";
  console.log(text.slice(0, 5)); // "Hello"

substring(): 提取字符串之间的字符。

  let text = "Hello world!";
  console.log(text.substring(0, 5)); // "Hello"

其他

concat(): 将一个或多个字符串与原字符串连接合并,形成一个新的字符串并返回。

  let text1 = "Hello";
  let text2 = "world!";
  console.log(text1.concat(" ", text2)); // "Hello world!"

charAt(): 返回指定位置的字符。

  let text = "Hello world!";
  console.log(text.charAt(0)); // "H"

charCodeAt(): 返回指定位置字符的Unicode编码。

  let text = "Hello world!";
  console.log(text.charCodeAt(0)); // 72

repeat(): 将字符串重复指定次数,然后返回新的字符串。

  let text = "Hello!";
  console.log(text.repeat(3)); // "Hello!Hello!Hello!"

Object

JavaScript中的Object对象是一个基础的构造函数,用于创建对象。它提供了一系列的静态方法来处理对象。以下是一些常用的Object方法及其示例:

创建和属性定义

Object.create(proto, [propertiesObject]): 创建一个新对象,使用现有的对象来提供新创建的对象的__proto__

  const person = {
    isHuman: false,
    printIntroduction: function() {
      console.log(`My name is ${this.name}. Am I human? ${this.isHuman}`);
    }
  };
  const me = Object.create(person);
  me.name = 'Matthew'; // "name"是一个属性,现在存在于"me"中,但不在"person"中
  me.isHuman = true; // 继承的属性可以被覆盖
  me.printIntroduction(); // My name is Matthew. Am I human? true

Object.defineProperty(obj, prop, descriptor): 直接在一个对象上定义一个新属性,或者修改一个对象的现有属性,并返回此对象。

  const object1 = {};
  Object.defineProperty(object1, 'property1', {
    value: 42,
    writable: false
  });
  console.log(object1.property1); // 42

属性访问

Object.keys(obj): 返回一个表示给定对象的所有可枚举属性的字符串数组。

  const object1 = {
    a: 'somestring',
    b: 42,
    c: false
  };
  console.log(Object.keys(object1)); // ["a", "b", "c"]

Object.values(obj): 返回一个表示给定对象的所有可枚举属性值的数组。

  console.log(Object.values(object1)); // ["somestring", 42, false]

Object.entries(obj): 返回一个给定对象自身可枚举属性的键值对数组。

  console.log(Object.entries(object1)); // [["a", "somestring"], ["b", 42], ["c", false]]

属性操作

Object.assign(target, ...sources): 用于将所有可枚举属性的值从一个或多个源对象复制到目标对象。它将返回目标对象

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

Object.freeze(obj): 冻结对象:其他代码不能删除或更改任何属性。

  const obj = {
    prop: 42
  };
  Object.freeze(obj);
  obj.prop = 33; // Throws an error in strict mode
  console.log(obj.prop); // 42

Object.seal(obj): 防止其他代码删除对象的属性。

  const obj = {
    prop: 33
  };
  Object.seal(obj);
  obj.prop = 42; // Works fine
  delete obj.prop; // Not allowed in strict mode
  console.log(obj.prop); // 42

其他

Object.hasOwnProperty(prop): 检查对象自身(不包括原型链)是否具有指定的属性。

  const object1 = new Object();
  object1.property1 = 42;
  console.log(object1.hasOwnProperty('property1')); // true
  console.log(object1.hasOwnProperty('toString')); // false
  • 38
    点赞
  • 28
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值