JS常用方法整理(包含数组,对象,Math,字符串)

数组常用方法

var fruits = ["Banana", "Orange", "Apple", "Mango"];
​
数组方法:
toString() 把数组转换为数组值(逗号分隔)的字符串 ---------  Banana,Orange,Apple,Mango
​
join("*") 方法也可将所有数组元素结合为一个字符串     ---------  Banana * Orange * Apple * Mango 
​
pop() 方法从数组中删除最后一个元素      ----------   从 fruits 删除最后一个元素("Mango")-- 返回删除的值
​
push() 方法(在数组结尾处)向数组添加一个新的元素   ---------   向 fruits 添加一个新元素 -- 返回新数组的长度
​
shift() 方法会删除首个数组元素,并把所有其他元素“位移”到更低的索引 ------ 从 fruits 删除第一个元素 "Banana" -- 返回删除的值
​
unshift() 方法(在开头)向数组添加新元素,并“反向位移”旧元素   ------ 向 fruits 添加新元素 "Lemon" -- 返回新数组的长度
​
splice() 方法可用于向数组 删除,替换,添加 元素  ---- fruits.splice(2, 2, "Lemon", "Kiwi");  ------ ['Banana','Orange','Lemon','Kiwi'] ----- 返回删除的值
​
concat() 方法通过 合并(连接)现有数组来创建一个新数组 --- 不会更改现有数组。它总是返回一个新数组。以拼接任意数量的数组参数
​
slice() -----  fruits.slice(1)  方法用数组的某个片段切出新数组 --- 从数组元素 1 ("Orange")包括 1 开始切出一段数组 ---- ["Orange", "Apple", "Mango"]  ---  (1, 3) --- 会从开始参数选取元素,直到结束参数(不包括)为止。-- ["Orange", "Apple"]
​
数组排序:
sort() 方法以字母顺序对数组进行排序 --- fruits.sort();  ------  ['Apple','Banana','Mango','Orange']
---var points = [40, 100, 1, 5, 25, 10];
---points.sort(function(a, b){return a - b});   ----  [1,5,10,25,40,100]
​
reverse() 方法反转数组中的元素 ---   fruits.reverse();   ---- ['Mango','Apple','Orange','Banana']
查找最高(或最低)的数组值------在对数组进行排序之后,您能够使用索引来获得最高或最低值 // 现在 fruits[0] 包含最低值
// 而 fruits[fruits.length-1] 包含最高值
​
Math.max.apply 来查找数组中的最高值 -- Math.max.apply(null, arr) -- Math.max.apply([1, 2, 3]) 等于 Math.max(1, 2, 3)
Math.min.apply 来查找数组中的最低值 -- Math.max.apply(null, arr) -- Math.min.apply([1, 2, 3]) 等于 Math.min(1, 2, 3)
​
数组迭代:
回调函数不使用 index 和 array 参数,可以省略它们
​
forEach() 方法为每个数组元素调用一次函数(回调函数) 
fruits.forEach((item, index, array) =>{
  ......
});
​
map() 方法通过对每个数组元素执行函数来创建新数组,不会对没有值的数组元素执行函数,不会更改原始数组(对每个数组元素进行加工生成新数组)
[1,2,3].forEach((item, index, array) =>{
  return item*2;   // 将每个数组值乘以2
});
​
filter() 方法创建一个包含通过测试的数组元素的新数组(过滤出一个新数组)
[1,2,3].forEach((item, index, array) =>{
  return item>2;   // 用值大于 2 的元素创建一个新数组
});
​
reduce() 方法在每个数组元素上运行函数,以生成(减少它)单个值,在数组中从左到右工作,不会减少原始数组(累加)
[1,2,3].reduce((pre, cur, index, array)=>{return pre+cur},0)  // 6
​
every() 方法检查所有数组值是否通过测试
[1,2,3].every((item, index, array) =>{
  return item>2;   // 检查所有数组值是否大于 2   返回false
});
​
some() 方法检查某些数组值是否通过了测试
[1,2,3].some((item, index, array) =>{
  return item>2;   // 检查某些数组值是否大于 2   返回true
});
​
indexOf(item, start) 方法在数组中搜索元素值并返回第一次找到的索引,找不到返回-1, start 是从哪里开始搜索。负值将从结尾开始的给定位置开始,并搜索到结尾
fruits.indexOf("Apple"); // 0
​
find() 方法返回通过测试函数的第一个数组元素的值。
[1,2,3].find((item, index, array) =>{
  return item>2;   // 查找(返回)大于 2 的第一个元素的值
});
​
findIndex() 方法返回通过测试函数的第一个数组元素的索引
​
改变原数组:push(), pop(), shift(), unshift(), reverse(),sort(),splice()

Math 常用方法

round(x) 的返回值是 x 四舍五入为最接近的整数
    Math.round(6.8);    // 返回 7
    Math.round(2.3);    // 返回 2
​
pow(x, y) 的返回值是 x 的 y 次幂
    Math.pow(8, 2);      // 返回 64
​
sqrt(x) 返回 x 的平方根
    Math.sqrt(64);      // 返回 8
​
abs(x) 返回 x 的绝对(正)值
    Math.abs(-4.7);     // 返回 4.7
​
ceil(x) 的返回值是 x 上舍入最接近的整数
    Math.ceil(6.4);     // 返回 7
​
floor(x) 的返回值是 x 下舍入最接近的整数
    Math.floor(2.7);    // 返回 2
​
min() 和 max() 可用于查找参数列表中的最低或最高值
    Math.min(0, 450, 35, 10, -8, -300, -78);  // 返回 -300
    Math.max(0, 450, 35, 10, -8, -300, -78);  // 返回 450
​
random()返回介于 0(包括) 与 1(不包括) 之间的随机数
    Math.random();     // 返回随机数

对象常用方法

Object.getPrototypeOf方法返回参数对象的原型。这是获取原型对象的标准方法。
    var F = function () {};
    var f = new F();
    Object.getPrototypeOf(f) === F.prototype // true
几种特殊对象的方法:
    // 空对象的原型是 Object.prototype
    Object.getPrototypeOf({}) === Object.prototype // true
​
    // Object.prototype 的原型是 null
    Object.getPrototypeOf(Object.prototype) === null // true
​
    // 函数的原型是 Function.prototype
    function fun() {}
    Object.getPrototypeOf(fun) === Function.prototype // true
    
Object.setPrototypeOf 方法为参数对象设置原型,返回该参数对象。它接受两个参数,第一个是现有对象,第二个是原型对象。
方法和new出来的对象类似
    var a = {};
    var b = {x: 1};
    Object.setPrototypeOf(a, b);
​
    Object.getPrototypeOf(a) === b // true
    a.x // 1
​
Object.create()方法接受一个对象为参数,然后以它为原型,返回一个实例对象。该实例完全继承原型对象的属性、方法
    // 原型对象
      var A = {
        print: function () {
          console.log('hello');
        }
      };
​
      // 实例对象
      var B = Object.create(A); //通过对象上的create方法,B继承拥有了A的属性以及方法
​
      Object.getPrototypeOf(B) === A // true
      B.print() // hello
      B.print === A.print // true
      注意:
        1、create方法必须提供对象原型,参数为空或者参数不是对象,代码会报错
        2、create()方法生成的新对象,动态继承了原型。在原型上添加或修改任何方法,会立刻反映在新 对象之上。相当于浅拷贝
​
Object.prototype.isPrototypeOf() 实例对象的isPrototypeOf方法,用来判断该对象是否为参数对象的原型。
    console.log(Object.prototype.isPrototypeOf({})) // true
    console.log(Object.prototype.isPrototypeOf([])) // true
    console.log(Object.prototype.isPrototypeOf(/xyz/)) // true
    console.log(Object.prototype.isPrototypeOf(Object.create(null))) // false
    由于Object.prototype处于原型链的最顶端,所以对各种实例都返回true,只有直接继承自null的对象除外。
​
Object.getOwnPropertyNames方法返回一个数组,成员是参数对象本身的所有属性的键名,不包含继承的属性键名。
    Object.getOwnPropertyNames([1,2,3])    // 属性键名:['0', '1', '2', 'length']
​
Object.prototype.hasOwnProperty()  对象实例的hasOwnProperty方法返回一个布尔值,用于判断某个属性定义在对象自身,还是定义在原型链上。
    Date.hasOwnProperty('length') // true
    Date.hasOwnProperty('toString') // false
​
in 运算符和 for…in 循环  in运算符返回一个布尔值,表示一个对象是否具有某个属性。它不区分该属性是对象自身的属性,还是继承的属性。
    'length' in Date // true
    'toString' in Date // true
    //in运算符常用于检查一个属性是否存在。
    //获得对象的所有可遍历属性(不管是自身的还是继承的),可以使用for...in循环。
    var o1 = { p1: 123 };
    var o2 = Object.create(o1, {
      p2: { value: "abc", enumerable: true }
    });
    for (p in o2) {
      console.info(p); //p1 p2
    } 
ES6:  
Object.is用来比较两个值是否严格相等,与严格比较运算符(===)的行为基本一致
    let a = {major:'英语',class:'五年一班'};
    let aClone = { ...a };//使用扩展运算符将对象a的数据复制到aClone1中
    console.log(aClone === a); //false
    console.log(Object.is(aClone,a)) //false,使用对象上的is进行判断是否相同
​
Object.assign()方法用于对象的合并,将源对象(source)的所有可枚举属性,复制到目标对象(target)。
    const target = { a: 1 };
    const source1 = { b: 2 };
    const source2 = { c: 3,d:4 };
    Object.assign(target, source1, source2);
    console.log(target);// { a: 1, b: 2, c: 3, d: 4 }
    const source = { a: { b: 'hello' } }
    let obj = Object.assign(target, source)
    console.log(obj) //  { a: { b: 'hello' }} key相同时,后出现的value将会覆盖前边的value值
    注意:
      1、如果目标对象与源对象有同名属性,或多个源对象有同名属性,则后面的属性会覆盖前面的属性。
      2、Object.assign()方法实行的是浅拷贝,而不是深拷贝。也就是说,如果源对象某个属性的值是对象,
      那么目标对象拷贝得到的是这个对象的引用。
      
Object.getOwnPropertyDescriptors()方法,返回指定对象所有自身属性(非继承属性)的描述对象
​
Object.setPrototypeOf方法的作用与__proto__相同,用来设置一个对象的原型对象(prototype) 返回参数对象本身。它是 ES6 正式推荐的设置原型对象的方法。
    let proto = {};
    let obj = {x:10};
    Object.setPrototypeOf(obj,proto)
    proto.y = 20;
    proto.z = 30;
    console.log(obj.x) //10
    console.log(obj.y) //20
    console.log(obj.z) //30
    console.log(proto) //{ y: 20, z: 30 }
​
Object.getPrototypeOf,该方法与Object.setPrototypeOf配套,用于查询读取一个对象的原型对象
​
Object.keys方法,返回一个数组,成员是参数对象自身的(不含继承的)所有可遍历(enumerable)属性的键名。
    var obj = { foo: 'bar', baz: 42 };
    Object.keys(obj)
    // ["foo", "baz"]
​
Object.values方法返回一个数组,成员是参数对象自身的(不含继承的)所有可遍历(enumerable)属性的键值。
    const obj = { foo: 'bar', baz: 42 };
    Object.values(obj)
    // ["bar", 42]
    
Object.entries()方法返回一个数组,成员是参数对象自身的(不含继承的)所有可遍历(enumerable)属性的键值对数组(二维数组)。
    const obj = { foo: 'bar', baz: 42 };
    Object.entries(obj)
    // [ ["foo", "bar"], ["baz", 42] ]
​
Object.fromEntries()和Object.entries()配套,是将特定的数组对象转换成对象格式    
    const arr = [ [ 'foo', 'bar' ], [ 'baz', 42 ] ]
    /*数组对象中的数组只能有两个值,是类似键值对格式的数组,如果有多的将会被忽略不纳入转换
    的对象数据中,以前两个数据为准进行数据格式的转换*/
    const arr1 = [ [ 'foo', 'bar','obj' ], [ 'baz', 42,'name','jerry' ] ] 
    console.log(Object.fromEntries(arr)) //{ foo: 'bar', baz: 42 }
    console.log(Object.fromEntries(arr1))//{ foo: 'bar', baz: 42 } 两个数组得到的是一样的
 

字符串常用方法

字符串方法:
所有字符串方法都会返回新字符串。它们不会修改原始字符串
indexOf() 方法返回字符串中指定文本首次出现的索引(位置)
​
lastIndexOf() 方法返回指定文本在字符串中最后一次出现的索引       如果未找到文本, indexOf() 和 lastIndexOf() 均返回 -1
两种方法都接受作为检索起始位置的第二个参数。
​
search() 方法搜索特定值的字符串,并返回匹配的位置 
    indexOf() 与 search()区别在于:
    search() 方法无法设置第二个开始位置参数。
    indexOf() 方法无法设置更强大的搜索值(正则表达式)。
​
提取部分字符串:
    slice(start, end) ---  提取字符串的某个部分并在新字符串中返回被提取的部分。从start索引开始,不包括end
    substring(start, end)  ---  substring() 类似于 slice()。不同之处在于 substring() 无法接受负的索引。
    substr(start, length)  ---  substr() 类似于 slice()。不同之处在于第二个参数规定被提取部分的长度。
​
replace() 方法用另一个值替换在字符串中指定的值 只替换首个匹配  不会改变调用它的字符串。它返回的是新字符串 大小写有别
​
toUpperCase() 把字符串转换为大写
toLowerCase() 把字符串转换为小写
​
concat() 连接两个或多个字符串
​
提取字符串字符的安全方法:
    charAt(position)   ---  返回字符串中指定下标(位置)的字符串
    var str = "HELLO WORLD";
    str.charAt(0);            // 返回 H
    
    charCodeAt(position)  ---  charCodeAt() 方法返回字符串中指定索引的字符 unicode 编码
    var str = "HELLO WORLD";
    str.charCodeAt(0);         // 返回 72
​
split() 将字符串转换为数组
​
字符串搜索:
match() 方法根据正则表达式在字符串中搜索匹配项,并将匹配项作为 Array 对象返回
includes() 如果字符串包含指定值返回 true   ---  string.includes(searchvalue, start)  (搜索值,索引)
startsWith() 如果字符串以指定值开头,则返回 true,否则返回 false   区分大小写  string.startsWith(searchvalue, start)
endsWith() 如果字符串以指定值结尾,则返回 true,否则返回 false  string.endsWith(searchvalue, length) 区分大小写

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值