JS的一些常用API

2021-8-30 17:35:035

#javascript

31

前言

因为某些不可说的原因我现在要对这方面进行一波总结。

正文

数组(Array)

  • every(function())
    • every() 方法测试一个数组内的所有元素是否都能通过某个指定函数的测试。
    • 全部通过返回true,否则返回false
    • 它返回一个布尔值。
    • 如果是空数组,此方法会在一切情况下返回true
const isBelowThreshold = (currentValue) => currentValue < 40;

const array1 = [1, 30, 39, 29, 10, 13];

console.log(array1.every(isBelowThreshold));
// true
  • some(function())
    • 与every类似,区别是some只要有一个元素通过便返回true,全都不通过才会返回false
  • filter(function())
    • filter() 方法创建一个新数组, 其包含通过所提供函数实现的测试的所有元素
const words = ['spray', 'limit', 'elite', 'exuberant', 'destruction', 'present'];

const result = words.filter(word => word.length > 6);

console.log(result);
// [\"exuberant\", \"destruction\", \"present\"]
  • find(function())
    • find() 方法返回数组中满足提供的测试函数的第一个元素的值。否则返回 undefined。
const array1 = [5, 12, 8, 130, 44];

const found = array1.find(element => element > 10);

console.log(found);
// 12
  • includes
    • includes() 方法用来判断一个数组是否包含一个指定的值,根据情况,如果包含则返回 true,否则返回false。
const array1 = [1, 2, 3];

console.log(array1.includes(2));
// true

const pets = ['cat', 'dog', 'bat'];

console.log(pets.includes('cat'));
// true

console.log(pets.includes('at'));
// false

  • map(function())
    • map() 方法创建一个新数组,其结果是该数组中的每个元素是调用一次提供的函数后的返回值。
const array1 = [1, 4, 9, 16];

// pass a function to map
const map1 = array1.map(x => x * 2);

console.log(map1);
// [2, 8, 18, 32]
  • forEach(function())
    • 对数组的每个元素执行一次给定的函数。
const array1 = ['a', 'b', 'c'];

array1.forEach(element => console.log(element));
  • reduce
    • 对数组中的每个元素执行一个由您提供的reducer函数(升序执行),将其结果汇总为单个返回值。
const array1 = [1, 2, 3, 4];
const reducer = (accumulator, currentValue) => accumulator + currentValue;

// 1 + 2 + 3 + 4
console.log(array1.reduce(reducer));
// 10

// 5 + 1 + 2 + 3 + 4
console.log(array1.reduce(reducer, 5));
// 15
  • new set()数组去重
    • set即集合,是js自带的一个数据结构,其特点是不包含重复元素,因此我们可以利用这点使用set集合来去除数组的重复元素
    • 过程如下
let array = [1,1,2,2,3,3]  // 测试数组
let set = new Set(array)  // 利用Set数组的构造器来帮我们去重数组
array = Array.from(set)  // 将set集合重新转为数组
  • splice与slice
    • 作用:用于修改数组元素
    • 区别:
      • splice(start,deleteCount,item1, item2, ...)
        • start:指定修改的开始位置(从0计数)。
          • 超出数组长度,从数组末尾开始添加内容
          • 负值,则从数组末尾开始(等价于array.length-n)
          • 负值绝对值大于数组长度,则表示开始位置为第0位
        • deleteCount:
          • 整数,表示要移除的数组元素的个数
          • 被省略或值大于start之后的数组元素,则删除start以及start之后的数组元素
        • 通过删除或替换现有元素或者原地添加新的元素来修改数组,并以数组形式返回被修改的内容。此方法会改变原数组。
      • slice(begin,end)
        • begin
          • 0开始计数,从该索引开始提取原数组元素
          • 负数的话则表示从原数组的倒数第几个元素开始提取
        • end
          • 0开始计数,从该索引结束提取原数组元素。
          • 负数的话则表示它在原数组的倒数第几个元素结束抽取
        • 若end被省略,则提取至原数组末尾
        • 若end大于数组长度,slice也会一直提取至原数组末尾
        • 返回一个新的数组对象,这一对象是一个由 begin 和 end 决定的原数组的浅拷贝(包括 begin,不包括end)。原始数组不会被改变。

字符串(String)

  • includes

Math

Math是一个内置对象,它拥有一些数学常数属性和数学函数方法,不是一个函数对象。 Math用于Number类型,不支持BigInt。

  • PI
    • 圆周率,一个圆的周长和直径之比,约等于 3.14159。
  • abs
    • 返回一个数的绝对值。
  • floor
    • 返回小于一个数的最大整数,即一个数向下取整后的值。
  • ceil
    • 返回大于一个数的最小整数,即一个数向上取整后的值。
  • min
    • 返回参数中的最小值
  • max
    • 返回参数中的最小值
  • random
    • 返回一个 0(包含) 到 1(不包含) 之间的伪随机数
  • round
    • 返回四舍五入后的整数
  • trunc
    • 返回一个数的整数部分,直接去除其小数点及之后的部分,和floor在负数的情况下会有所区别

其他

  • 如何生成一个随机字符串作为唯一key
  • 数据类型:
    • Number:
      • 是经过封装的能让你处理数字值的对象。Number 对象由 Number() 构造器创建,为双精度IEEE 754 64位浮点类型
    • Stirng
      • 是一个用于字符串或一个字符序列的构造函数
    • Boolean
      • 是一个布尔值的对象包装器
      • 创建对象省略或值0,-0,null,false,NaN,undefined,或空字符串(""),初始值都为false,其他一律true
    • Null
      • 原始值之一,特指对象的值未设置。
    • undefined
      • 一个声明未定义的变量的初始值,或没有实际参数的形式参数。
    • Object
      • 构造函数创建一个对象包装器
      • 在JavaScript中,几乎所有的对象都是Object类型的实例,它们都会从Object.prototype继承属性和方法
    • Symbol(es6新增)
      • 每个从Symbol()返回的symbol值都是唯一的。一个symbol值能作为对象属性的标识符;这是该数据类型仅有的目的。
  • 数字处理相关
    • Number.toString(radix)
      • 返回Number对象的字符串形式
      • radix表示输出数字radix进制的数字
      • 例子
    • Number.toFixed()
      • 使用定点表示法来格式化一个数值
      • 简单来讲就是保留几位小数点,少了用0填充,多了四舍五入到指定小数点
      • 例子
    • Number()
      • 如果参数无法被转换为数字,则返回 NaN。
      • 在非构造器上下文中 (如:没有 new 操作符),Number 能被用来执行类型转换。
      • 类型转换规则:
        • 字符串(String)
          • 把字符串转换为数字,只要字符串中包含任意一个非有效数字字符(第一个点除外)结果都是NaN,空字符串会变为数字零
        • 布尔(Boolean)
          • true为1,false为0
        • null和undefined
          • null为0,undefined为NaN
    • parseInt
      • parseInt(string, radix) 解析一个字符串并返回指定基数的十进制整数, radix 是2-36之间的整数,表示被解析字符串的基数。
      • 过程:将其第一个参数转换为一个字符串,对该字符串进行解析,然后返回一个整数或 NaN。
    • parseFloat
      • 解析一个参数(必要时先转换为字符串)并返回一个浮点数
      • 返回浮点数或NaN
  • =====的区别
    • ==(相等) 会尝试强制类型转换并且比较不同类型的操作数
    • === (全等)会检查它的两个操作数是否相等,并且返回一个布尔值结果。与相等运算符不同,全等运算符总是认为不同类型的操作数是不同的。
  • display:none,visibility:hiddenopacity:0的区别 Description