JS 内置对象方法总结

JS 内置对象方法总结

Array(数组) 参考

1、归纳:

实例方法调用参数功能返回值改变原数组版本
push…items(尾部)追加 n 个元素新数组长度Y-
unshift…items(开头)插入 n 个元素返回新数组长度Y-
pop-删除数组的最后一位被删除的数据Y-
shift-删除数组的第一位被删除的数据Y-
splicestart,deleteCount?,…items?指定位置(索引从 0 开始)
删除指定个数再追加 n 个元素
被删除的数据组成的数组Y-
slicestart?,end?裁切指定位置的数组被裁切的元素形成的新数组N-
sort(a,b)=>number?对数组进行排序,可传入新数组Y-
reverse-反转数组中的元素反转后数组Y-
concatvalueN合并两个或多个数组合并之后的数组N-
joinseparator?数组拼接形成字符串(默认,)拼接的字符串N-
find(e, i, a) =>boolean返回数组中满足提供的函数的第一个元素的值,否则返回 undefined满足条件第一个元素NES6
findIndex(e, i, a) =>boolean返回数组中满足提供的函数的第一个元素的下标,否则返回-1满足条件第一个索引NES6
includessearchElement,fromIndex?判断一个数组是否包含一个指定的值true、falseNES6
fillvalue,start?,end?用固定值填充一个数组新数组YES6
indexOfsearchElement,fromIndex?返回数组中第一次出现给定元素的索引,不存在返回-1下标,不存在返回 -1N-
lastIndexOfsearchElement,fromIndex?返回数组中给定元素最后一次出现的索引,不存在则返回-1最后出现的下标,不存在返回-1N-
forEachcallbackFn, thisArg?方法对数组的每个元素执行一次给定的函数-N-
mapcallbackFn, thisArg?方法创建一个新数组(由原数组中的每个元素都调用一次提供的函数后的返回值组成)新的自定义数组N-
filtercallbackFn, thisArg?回调函数返回一个条件,把满足条件的元素筛选出来放到新数组中新的数组N-
reducecallbackFn, initialValue?遍历数组,每次循环时执行传入的回调函数,回调函数会返回一个值,将该值作为初始值 prev,传入到下一次函数中结果汇总为单个返回值N-
flatdepth?根据指定深度递归地将所有子数组拉平新数组NES6
flatMapcallbackFn,thisArg?先通过 map 返回一个新数组,再将数组拉平( 只能拉平一次 )新数组NES6

2、示例:

  • push(…items):方法将指定的元素添加到数组的末尾,并返回新的数组长度。

    参数描述备注
    elementN添加到数组末尾的元素。可选
    let list = [1, 2, 3]
    console.log("push", list.push(...list), list)
    // > push 6  (6) [1, 2, 3, 1, 2, 3]
    
  • unshift(…items):方法将指定元素添加到数组的开头,并返回数组的新长度。

    参数描述备注
    elementNelement1、…、elementN 添加到 arr 开头的元素。可选
    list = [1, 2, 3];
    console.log("unshift", list.unshift(...list), list);
    // > unshift 6  (6) [1, 2, 3, 1, 2, 3]
    
  • pop():方法从数组中删除最后一个元素,并返回该元素的值。此方法会更改数组的长度。

    list = [1, 2, 3];
    console.log("pop", list.pop(), list);
    // > pop 3  (2) [1, 2]
    
  • shift():方法从数组中删除第一个元素,并返回该元素的值。此方法更改数组的长度。

    list = [1, 2, 3];
    console.log("shift", list.shift(), list);
    // > shift 1  (2) [2, 3]
    
  • splice(start, deleteCount?, …items?):移除或者替换已存在的元素和/或添加新的元素。

    参数描述备注
    start从 0 开始计算的索引,表示要开始改变数组的位置必选
    deleteCount一个整数,表示数组中要从start 开始删除的元素数量可选
    item1、…、itemN从 start 开始要加入到数组中的元素。如果不指定任何元素,splice() 将只从数组中删除元素。可选
    list = [1, 2, 3];
    console.log("splice", list.splice(1, 1, 4, 5), list);
    // > splice [2]  (4) [1, 4, 5, 3]
    
  • slice(start?,end?): 方法返回一个新的数组对象,这一对象是一个由 start 和 end 决定的原数组的浅拷贝(包括 start,不包括 end),其中 start 和 end 代表了数组元素的索引。原始数组不会被改变。

    参数描述备注
    start提取起始处的索引(从 0 开始),如果索引是负数,则从数组末尾开始计算可选
    end提取终止处的索引(从 0 开始),如果索引是负数,则从数组末尾开始计算可选
    list = [1, 2, 3, 4, 5, 6];
    console.log("slice", list.slice(1, 4), list);
    // > slice (3) [2, 3, 4]  (6) [1, 2, 3, 4, 5, 6]
    
  • sort(compareFn):对数组的元素进行排序,并返回对相同数组的引用。默认排序是将元素转换为字符串,然后按照它们的 UTF-16 码元值升序排序。
    如果 (a, b)=> {return a - b;} ,a - b > 0 那么 a 会被排列到 b 之前; (从小到大排序)
    如果 (a, b)=> {return b - a;} ,b - a > 0 那么 b 会被排列到 a 之前; (从大到小排序)

    参数描述备注
    compareFn定义排序顺序的函数可选
    list = [3, 1, 2];
    console.log("sort", list.sort(), list);
    // > sort (3) [1, 2, 3]  (3) [1, 2, 3]
    
    list = [3, 1, 2];
    console.log(
      "sort",
      list.sort((a, b) => {
        return b - a;
      }),
      list
    );
    // > sort (3) [3, 2, 1]  (3) [3, 2, 1]
    
  • reverse():反转数组中的元素,并返回同一数组的引用。数组的第一个元素会变成最后一个,数组的最后一个元素变成第一个。换句话说,数组中的元素顺序将被翻转,变为与之前相反的方向。要在不改变原始数组的情况下反转数组中的元素,使用 toReversed()。

    list = [1, 2, 3];
    console.log("reverse", list.reverse(), list);
    // > reverse (3) [3, 2, 1]  (3) [3, 2, 1]
    
  • concat(valueN):方法用于合并两个或多个数组。此方法不会更改现有数组,而是返回一个新数组。

    参数描述备注
    valueN数组和/或值,将被合并到一个新的数组中。如果省略了所有 valueN 参数,则 concat 会返回调用此方法的现存数组的一个浅拷贝可选
    list = [1, 2, 3];
    console.log("concat", list.concat(list, list, list), list);
    // > concat (12) [1, 2, 3, 1, 2, 3, 1, 2, 3, 1, 2, 3]  (3) [1, 2, 3]
    
  • join(separator):将一个数组(或一个类数组对象)的所有元素连接成一个字符串并返回这个字符串,用逗号或指定的分隔符字符串分隔 (默认",")。如果数组只有一个元素,那么将返回该元素而不使用分隔符。

    list = [1, 2, 3];
    console.log("join", list.join(), list);
    // > join 1,2,3 (3)  [1, 2, 3]
    
  • find(callbackFn, thisArg?):方法返回数组中满足提供的回调函数的第一个元素的值。否则返回 undefined。

    参数描述备注
    callbackFn为数组中的每个元素执行的函数。它应该返回一个真值来表示已经找到了匹配的元素。该函数被调用时将传入以下参数:必选
    -element数组中当前正在处理的元素。必选
    -index正在处理的元素在数组中的索引。可选
    -array调用了 find() 的数组本身。可选
    thisArg执行 callbackFn 时用作 this 的值可选
    list = [1, 2, 3];
    console.log(
      "find",
      list.find((item, index, array) => item > 1),
      list
    );
    // > find 2  (3) [1, 2, 3]
    
  • findIndex(callbackFn, thisArg?):返回数组中满足提供的测试函数的第一个元素的索引。若没有找到对应元素则返回 -1。

    参数描述备注
    callbackFn为数组中的每个元素执行的函数。它应该返回一个真值以指示已找到匹配元素,否则返回一个假值。该函数被调用时将传入以下参数:必选
    -element数组中当前正在处理的元素。必选
    -index正在处理的元素在数组中的索引。可选
    -array调用了 findIndex() 的数组本身。可选
    thisArg执行 callbackFn 时用作 this 的值可选
    list = [1, 2, 3];
    console.log(
      "findIndex",
      list.findIndex((item, index, array) => item > 1),
      list
    );
    // > findIndex 1  (3) [1, 2, 3]
    
  • includes(searchElement,fromIndex?):方法用来判断一个数组是否包含一个指定的值,根据情况,如果包含则返回 true,否则返回 false。

    参数描述备注
    searchElement需要查找的值。必选
    fromIndex开始搜索的索引(从零开始),负索引从数组末尾开始计数可选
    list = [1, 2, 3];
    console.log("includes", list.includes(2), list);
    // > includes true  (3) [1, 2, 3]
    
  • fill(value,start?,end?):方法用一个固定值填充一个数组中从起始索引(默认为 0)到终止索引(默认为 array.length)内的全部元素。它返回修改后的数组。

    参数描述备注
    value用来填充数组元素的值。注意所有数组中的元素都将是这个确定的值:如果 value 是个对象,那么数组的每一项都会引用这个元素必选
    start基于零的索引,从此开始填充。负数索引从数组的末端开始计算可选
    end基于零的索引,在此结束填充。负数索引从数组的末端开始计算可选
    list = [1, 2, 3];
    console.log("fill", list.fill(4, 1, 3), list);
    // > fill (3) [1, 4, 4]  (3) [1, 4, 4]
    
  • indexOf(searchElement,fromIndex?):方法返回数组中第一次出现给定元素的下标,如果不存在则返回 -1。

    参数描述备注
    searchElement数组中要查找的元素。必选
    fromIndex开始搜索的索引(从零开始),负索引从数组末尾开始计数可选
    list = [1, 2, 3];
    console.log("indexOf", list.indexOf(2, 0), list);
    // > indexOf 1  (3) [1, 2, 3]
    
  • lastIndexOf(searchElement,fromIndex?):方法返回数组中给定元素最后一次出现的索引,如果不存在则返回 -1。该方法从 fromIndex 开始向前搜索数组。

    参数描述备注
    searchElement被查找的元素。必选
    fromIndex以 0 起始的索引,表明反向搜索的起始位置可选
    list = [1, 2, 3, 4, 3];
    console.log("lastIndexOf", list.lastIndexOf(3, 3), list);
    // lastIndexOf 2 (5) [1, 2, 3, 4, 3]
    
  • forEach(callbackFn,thisArg?):方法对数组的每个元素执行一次给定的函数。

    参数描述备注
    callbackFn为数组中每个元素执行的函数。并会丢弃它的返回值,该函数被调用时将传入以下参数必选
    -element数组中正在处理的当前元素。必选
    -index数组中正在处理的当前元素的索引。可选
    -array调用了 forEach() 的数组本身。可选
    thisArg执行 callbackFn 时用作 this 的值可选
    list = [1, 2, 3];
    list.forEach((item, index, array) => {
      console.log("forEach", item, index, array);
    });
    // > forEach 1 0 (3) [1, 2, 3] forEach 2 1 (3) [1, 2, 3] forEach 3 2 (3) [1, 2, 3]
    
  • map(callbackFn,thisArg?):方法创建一个新数组,这个新数组由原数组中的每个元素都调用一次提供的函数后的返回值组成。

    参数描述备注
    callbackFn为数组中的每个元素执行的函数。它的返回值作为一个元素被添加为新数组中。该函数被调用时将传入以下参数:必选
    -element数组中当前正在处理的元素。必选
    -index正在处理的元素在数组中的索引。可选
    -array调用了 map() 的数组本身。可选
    thisArg执行 callbackFn 时用作 this 的值可选
    list = [1, 2, 3];
    console.log(
      "map",
      list.map((item, index, array) => item + 1)
    );
    // > map (3)  [2, 3, 4]
    
  • filter(callbackFn,thisArg?):方法创建给定数组一部分的浅拷贝,其包含通过所提供函数实现的测试的所有元素。

    参数描述备注
    callbackFn为数组中的每个元素执行的函数。它应该返回一个真值以将元素保留在结果数组中,否则返回一个假值。该函数被调用时将传入以下参数:必选
    -element数组中当前正在处理的元素。必选
    -index正在处理的元素在数组中的索引。可选
    -array调用了 filter() 的数组本身。可选
    thisArg执行 callbackFn 时用作 this 的值可选
    list = [1, 2, 3];
    console.log(
      "list",
      list.filter((item, index, arr) => item >= 2)
    );
    // > list (2) [2, 3]
    
  • reduce(callbackFn,initialValue?):方法对数组中的每个元素按序执行一个提供的 reducer 函数,每一次运行 reducer 会将先前元素的计算结果作为参数传入,最后将其结果汇总为单个返回值。

    参数描述备注
    callbackFn为数组中每个元素执行的函数。其返回值将作为下一次调用 callbackFn 时的 accumulator 参数。对于最后一次调用,返回值将作为 reduce() 的返回值。该函数被调用时将传入以下参数:必选
    -accumulator上一次调用 callbackFn 的结果。在第一次调用时,如果指定了 initialValue 则为指定的值,否则为 array[0] 的值。可选
    -currentValue当前元素的值。在第一次调用时,如果指定了 initialValue,则为 array[0] 的值,否则为 array[1]。可选
    -currentIndexcurrentValue 在数组中的索引位置。在第一次调用时,如果指定了 initialValue 则为 0,否则为 1。可选
    -array调用了 reduce() 的数组本身。可选
    initialValue第一次调用回调时初始化 accumulator 的值可选
    list = [1, 2, 3];
    console.log(
      "reduce",
      list.reduce((accumulator, currentValue, currentIndex, array) => {
        return accumulator + currentValue;
      }, 10),
      list
    );
    // > reduce 16  (3) [1, 2, 3]
    
  • flat(depth?):方法创建一个新的数组,并根据指定深度递归地将所有子数组元素拼接到新的数组中。

    参数描述备注
    depth指定要提取嵌套数组的结构深度,默认值为 1。可选
    list = [
      [1.1, 1.2, 1.3],
      [2.1, 2.2, 2.3],
    ];
    console.log("flat", list.flat(1), list);
    // > flat (6) [1.1, 1.2, 1.3, 2.1, 2.2, 2.3]
    
  • flatMap(callbackFn,thisArg?):方法对数组中的每个元素应用给定的回调函数,然后将结果展开一级,返回一个新数组。它等价于在调用 map() 方法后再调用深度为 1 的 flat() 方法(arr.map(…args).flat()),但比分别调用这两个方法稍微更高效一些。

    参数描述备注
    callbackFn一个在数组的每个元素上执行的函数。它应该返回一个包含新数组元素的数组,或是要添加到新数组中的单个非数组值。该函数将被传入以下参数:必选
    -element数组中正在处理的当前元素。可选
    -index数组中正在处理的当前元素的索引。可选
    -array调用 flatMap() 的当前数组。可选
    thisArg在执行 callbackFn 时用作 this 的值。可选
    list = [1, 2, 3];
    console.log(
      "flatMap",
      list.flatMap((element, index, array) => {
        return [element, index];
      }),
      list
    );
    // > flatMap (6) [1, 0, 2, 1, 3, 2]  (3) [1, 2, 3]
    

Object(对象) 参考

1、归纳

静态方法参数功能返回值改变原数据版本
assigntarget,…sources将一个或者多个源对象中所有可枚举的自有属性复制到目标对象返回修改后的目标对象YES6
createproto,propertiesObject静态方法以一个现有对象作为原型,创建一个新对象。新对象N-
definePropertiesobj,props静态方法直接在一个对象上定义新的属性或修改现有属性,并返回该对象。此对象Y-
definePropertyobj, prop?, descriptor?静态方法会直接在一个对象上定义一个新属性,或修改其现有属性,并返回此对象。此对象。Y-
entriesobj静态方法返回一个数组,包含给定对象自有的可枚举字符串键属性的键值对。数组NES8
freezeobj静态方法可以使一个对象被冻结此对象YES6
getOwnPropertyNamesobj静态方法返回一个数组,其包含给定对象中所有自有属性数组属性N-
isvalue1, value2静态方法确定两个值是否为相同值。BooleanNES6
keys-静态方法返回一个由给定对象自身的可枚举的字符串键属性名组成的数组数组键N-
hasOwnPropertyprop方法返回一个布尔值,表示对象自有属性(而不是继承来的属性)中是否具有指定的属性。BooleanN-

2、示例:

  • Object.assign(target, …sources):静态方法将一个或者多个源对象中所有可枚举的自有属性复制到目标对象,并返回修改后的目标对象。(注意:针对深拷贝,需要使用其他办法,因为 Object.assign() 只复制属性值。)

    参数描述备注
    target需要应用源对象属性的目标对象,修改后将作为返回值。必选
    sources一个或多个包含要应用的属性的源对象。可选
    let target = { a: 1, b: 2 },
      source = { b: 4, c: 5 };
    console.log("assign", Object.assign(target, source), target);
    // > assign  {a: 1, b: 4, c: 5}  {a: 1, b: 4, c: 5}
    
  • Object.create(proto, propertiesObject?):静态方法以一个现有对象作为原型,创建一个新对象。

    参数描述备注
    proto新创建对象的原型对象。必选
    propertiesObject对象可枚举的自有属性将为新创建的对象添加具有对应属性名称的属性描述符可选
    target = { a: 1, b: 2 };
    let newObj = Object.create(target, { c: { value: "play" } });
    console.log("target", newObj, Object.getPrototypeOf(newObj), target);
    // > target {c: 'play'}c: "play"[[Prototype]]: Object {a: 1, b: 2}a: 1b: 2[[Prototype]]: Object {a: 1, b: 2}
    
  • Object.defineProperties(obj, props?):静态方法直接在一个对象上定义新的属性或修改现有属性,并返回该对象

    参数描述备注
    obj在其上定义或修改属性的对象。必选
    props一个对象,其中每个键表示要定义或修改的属性的名称(属性详见)可选
    target = { a: 1, b: 2 };
    newObj = Object.defineProperties(target, { a: { value: "张三" } });
    console.log("defineProperties", newObj, target);
    // > defineProperties {a: '张三', b: 2} {a: '张三', b: 2}
    
  • Object.defineProperty(obj, prop?, descriptor?):静态方法会直接在一个对象上定义一个新属性,或修改其现有属性,并返回此对象。
    描述:Object.defineProperty() 允许精确地添加或修改对象上的属性。通过赋值添加的普通属性会在枚举属性时(例如 for…in、Object.keys() 等)出现,它们的值可以被更改,也可以被删除。此方法允许更改这些额外细节,以使其不同于默认值。默认情况下,使用 Object.defineProperty() 添加的属性是不可写、不可枚举和不可配置的。

    参数描述备注
    obj要定义属性的对象。必选
    prop一个字符串或 Symbol,指定了要定义或修改的属性键。可选
    descriptor要定义或修改的属性的描述符。可选
    -configurable为 false 时该属性的类型不能在数据属性和访问器属性之间更改,且该属性不可被删除,
    且其描述符的其他属性也不能被更改(但是,如果它是一个可写的数据描述符,则 value 可以被更改,writable 可以更改为 false)。
    可选
  • Object.entries(obj):静态方法返回一个数组,包含给定对象自有的可枚举字符串键属性的键值对。

    target = { a: 1, b: 2 };
    for (const [key, val] of Object.entries(target)) {
      console.log(`${key}: ${val}`);
    }
    // > a: 1 b: 2
    console.log("entries", Object.entries(target));
    // > entries [["a",1],["b",2]]
    
  • Object.freeze(obj):静态方法可以使一个对象被冻结。冻结对象可以防止扩展,并使现有的属性不可写入和不可配置。被冻结的对象不能再被更改:不能添加新的属性,不能移除现有的属性,不能更改它们的可枚举性、可配置性、可写性或值,对象的原型也不能被重新指定。freeze() 返回与传入的对象相同的对象。

    target = { a: 1, b: 2 };
    Object.freeze(target);
    target.a = "sa";
    console.log("freeze", target);
    // > freeze  {a: 1, b: 2}
    
  • Object.keys(obj):静态方法返回一个由给定对象自身的可枚举的字符串键属性名组成的数组。

    target = { a: 1, b: 2 };
    console.log("keys", Object.keys(target));
    // > keys (2) ['a', 'b']
    
  • Object.prototype.hasOwnProperty(prop):方法返回一个布尔值,表示对象自有属性(而不是继承来的属性)中是否具有指定的属性。

    target = { a: 1, b: 2 };
    console.log("hasOwnProperty", target.hasOwnProperty("a"));
    // > hasOwnProperty true
    

持续更新…

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值