返回

JavaScript常用方法大全，助您轻松驾驭前端开发

前端

JavaScript 常用方法大全

JavaScript 作为一门强大的编程语言，拥有丰富的内置方法，可以帮助开发人员轻松完成各种任务。本文整理了 JavaScript 中最常用的方法，分为字符串、数组、对象、函数、DOM 操作等几个部分，希望能为前端开发人员提供一个有用的参考。

一、字符串方法

  1. String.prototype.charAt() ：返回指定位置的字符。
  2. String.prototype.charCodeAt() ：返回指定位置字符的 Unicode 编码。
  3. String.prototype.concat() ：将两个或多个字符串连接成一个新字符串。
  4. String.prototype.indexOf() ：返回指定子字符串在字符串中首次出现的位置。
  5. String.prototype.lastIndexOf() ：返回指定子字符串在字符串中最后一次出现的位置。
  6. String.prototype.match() ：使用正则表达式匹配字符串。
  7. String.prototype.replace() ：使用正则表达式查找并替换字符串中的子字符串。
  8. String.prototype.search() ：使用正则表达式查找字符串中的子字符串。
  9. String.prototype.slice() ：从字符串中提取指定范围的字符。
  10. String.prototype.split() ：将字符串按指定分隔符拆分成数组。
  11. String.prototype.substr() ：从字符串中提取指定范围的字符。
  12. String.prototype.substring() ：从字符串中提取指定范围的字符。
  13. String.prototype.toLowerCase() ：将字符串转换为小写。
  14. String.prototype.toUpperCase() ：将字符串转换为大写。
  15. String.prototype.trim() ：去除字符串首尾的空格。

二、数组方法

  1. Array.prototype.concat() ：将两个或多个数组连接成一个新数组。
  2. Array.prototype.every() ：测试数组中的每个元素是否都满足指定条件。
  3. Array.prototype.filter() ：创建一个包含通过指定条件的元素的新数组。
  4. Array.prototype.find() ：返回数组中第一个满足指定条件的元素。
  5. Array.prototype.findIndex() ：返回数组中第一个满足指定条件的元素的索引。
  6. Array.prototype.forEach() ：对数组中的每个元素执行指定函数。
  7. Array.prototype.includes() ：检查数组是否包含指定元素。
  8. Array.prototype.indexOf() ：返回指定元素在数组中首次出现的位置。
  9. Array.prototype.join() ：将数组中的元素连接成一个字符串。
  10. Array.prototype.lastIndexOf() ：返回指定元素在数组中最后一次出现的位置。
  11. Array.prototype.map() ：创建一个包含经过指定函数处理的元素的新数组。
  12. Array.prototype.pop() ：从数组中删除最后一个元素并返回该元素。
  13. Array.prototype.push() ：向数组尾部添加一个或多个元素并返回新长度。
  14. Array.prototype.reduce() ：对数组中的每个元素执行指定函数，并将结果累积成一个单一的值。
  15. Array.prototype.reverse() ：反转数组中的元素顺序。
  16. Array.prototype.shift() ：从数组中删除第一个元素并返回该元素。
  17. Array.prototype.slice() ：从数组中提取指定范围的元素。
  18. Array.prototype.some() ：测试数组中是否存在一个元素满足指定条件。
  19. Array.prototype.sort() ：对数组中的元素进行排序。
  20. Array.prototype.splice() ：从数组中删除元素或向数组中添加元素。
  21. Array.prototype.unshift() ：向数组开头添加一个或多个元素并返回新长度。

三、对象方法

  1. Object.assign() ：将一个或多个源对象的属性复制到目标对象。
  2. Object.create() ：创建一个新对象，该对象的原型是指定的原型对象。
  3. Object.defineProperties() ：为对象定义新的属性或修改现有属性。
  4. Object.entries() ：将对象的所有可枚举属性键值对作为数组返回。
  5. Object.freeze() ：冻结对象，使其属性不可修改。
  6. Object.fromEntries() ：将一个键值对数组转换为对象。
  7. Object.getOwnPropertyDescriptor() ：获取指定属性的属性符。
  8. Object.getOwnPropertyNames() ：返回对象的所有可枚举属性键。
  9. Object.getPrototypeOf() ：获取对象的原型。
  10. Object.is() ：判断两个值是否相等。
  11. Object.isExtensible() ：检查对象是否可扩展。
  12. Object.isFrozen() ：检查对象是否冻结。
  13. Object.isSealed() ：检查对象是否密封。
  14. Object.keys() ：返回对象的所有可枚举属性键。
  15. Object.preventExtensions() ：阻止对对象添加新的属性。
  16. Object.seal() ：密封对象，使其属性不可删除或修改。
  17. Object.values() ：返回对象的所有可枚举属性值。

四、函数方法

  1. Function.prototype.apply() ：将函数应用于指定的对象，并使用指定的参数调用该函数。
  2. Function.prototype.bind() ：创建函数的新实例，该实例的 this 值被指定的对象绑定。
  3. Function.prototype.call() ：使用指定的 this 值和参数调用函数。
  4. Function.prototype.toString() ：返回函数的字符串表示形式。

五、DOM 操作方法

  1. document.getElementById() ：返回具有指定 ID 的元素。
  2. document.getElementsByClassName() ：返回具有指定类名的所有元素。
  3. document.getElementsByTagName() ：返回具有指定标签名的所有元素。
  4. document.querySelector() ：返回匹配指定 CSS 选择器的第一个元素。
  5. document.querySelectorAll() ：返回匹配指定 CSS 选择器的所有元素。
  6. element.addEventListener() ：向元素添加事件监听器。
  7. element.appendChild() ：向元素追加一个子元素。
  8. element.insertBefore() ：在元素之前插入一个子元素。
  9. element.removeChild() ：从元素中删除一个子元素。
  10. element.replaceChild() ：用一个新元素替换元素中的一个子元素。
  11. element.classList.add() ：向元素添加一个 CSS 类。
  12. element.classList.remove() ：从元素中删除一个 CSS 类。
  13. element.classList.toggle() ：切换元素的 CSS 类。
  14. element.getAttribute() ：获取元素的属性值。
  15. element.setAttribute() ：设置元素的属性值。
  16. element.removeAttribute() ：从元素中删除属性。

总结

JavaScript 作为一门强大的编程语言，拥有丰富的内置方法，可以帮助开发人员轻松完成各种任务。本文整理了 JavaScript 中最常用的方法，分为字符串、数组、对象、函数、DOM 操作等几个部分，希望能为前端开发人员提供一个有用的参考。