js经常使用内置对象及方法

前言

经常使用内置对象及方法有：Array数组对象、Math方法、String方法、日期对象的方法。

1、Array 数组对象

一、push() 在数组尾部添加一个或者多个元素，而且返回数组的新长度

arr=[1,2,3]
 arr.push("a","b"); //插入字符串  arr.push(6); //在数组的尾部插入一个新元素  arr.push(6,7,8); //在数组的尾部插入多个新元素  a=arr.push(6,7,8); //经过添加到尾部元素后返回数组的新长度  console.log(arr);  console.log(a); 复制代码

会返回数组的新长度

二、unshift() 在数组头部添加一个或者多个元素，而且返回数组的新长度

arr=[1,2,3]
 arr.unshift(0); //在数组的头部插入一个新元素  arr.unshift(-3,-2,-1,0); //在数组的头部插入多个新元素  var a=arr.unshift(-3,-2,-1,0); //返回数组的新长度  console.log(arr);  console.log(a); 复制代码

会返回数组的新长度

三、pop() 删除数组尾部的最后一个元素，而且将这个被删除的元素返回

arr=[1,2,3,4,5,6]
 arr.pop(); //pop中没有参数,删除数组的最尾部一个元素  var a=arr.pop(); //pop删除数组 的最尾部一个元素，而且将被删除的元素返回  console.log(arr);  console.log(a); 复制代码

将这个被删除的元素返回

四、shift() 删除数组的第一个元素，而且返回被删除的元素

arr=[1,2,3,4,5,6]
 arr.shift(); //将数组的第一个元素删除  var a=arr.shift(); //将数组的第一个元素删除，而且返回这个被删除的元素  console.log(arr);  console.log(a); 复制代码

返回被删除的元素

无论删除仍是添加都会改变数组的长度

五、concat() 数组的合并，合并后会返回一个新数组，原来的两个数组不会变化

var arr=[1,2,3,4];
 var arr1=[5,6,7,8];  var arr2=arr.concat(arr1); // 数组的合并，合并后会返回一个新数组，原来的两个数组不会变化  console.log(arr2);  var arr3=arr.concat(0,-1,-2); // 数组除了能够合并数组，也能够合并元素，将多个元素与原数组合并，返回新数组  console.log(arr3)  var arr4=arr.concat(0,arr1,["A","B"]); // concat既能够合并元素，也能够合并数组  console.log(arr4)  var arr5=arr.concat(); // 若是直接使用concat，就能够完成数组的复制功能  console.log(arr5) 复制代码

六、join() 将数组的每一个元素以指定的字符链接造成新字符串返回

var arr=[1,2,3,4,5]; // join就是将数组的每一个元素以指定的字符链接造成新字符串返回
 var str=arr.join( ); // 将数组合并为字符串返回，默认使用逗号,链接  console.log(str);  var str=arr.join("|"); // 在这里join的参数是字符串的链接符v  console.log(str);  var str=arr.join(""); // ""做为链接符，会将数组元素首尾相连成为字符串  console.log(str); 复制代码

七、splice() 这个方法能够从指定的位置删除给定数量的元素，而且在这个位置插入须要的元素，而且返回被删除的元素组成的新数组

splice(从什么位置开始,删除多少个元素,要插入的元素);

1）splice 刪除所有数组返回值

var arr1=arr.splice(); // 没有任何参数时,返回一个空数组
 console.log(arr1);  第一个参数是0，表示从第0位开始，第二个参数删除多少个没有填，意味着删除到尾部  var arr1=arr.splice(0); // 将全部数据转移到新数组  console.log(arr1); 复制代码

2）splice 能够从前向后，也能够从后向前

var arr1=arr.splice(0,3); // 从第0位开始删除3个元素，返回到新数组arr1
 var arr1=arr.splice(-2); // 从第几位开始能够是负数，从后向前数（倒数）,由于没有给要删除的数量，所以删除到尾部  var arr1=arr.splice(0,1,-1); // 从数组的第0位开始，删除1个元素，而且在这个位置插入一个元素 -1,替换  var arr1=arr.splice(-1,1,0); // 数组的最后一位替换位0  var arr1=arr.splice(2,2,10,11); // 将数组中第二位开始两位元素替换为10，11 复制代码

3）splice 能够插入一个，能够插入多个元素

var arr=[1,2,3,4,5];
 arr.splice(2,0,-1); // 在数组的第二位插入一个元素 -1  console.log(arr);  arr.splice(2,0,-1,-2,-3,-4); // 在数组的第二位插入多个元素  console.log(arr); 复制代码

八、slice(start,end) 按指定位置截取复制数组的内容，返回新数组，不会改变原数组

从下标 start 开始，截取到 end，包括 start 但不包括 end。第二个参数不写，默认截取到尾部，只能从前向后截取

var arr1=arr.slice(1,4); // 从第1位开始截取到第4位以前
 var arr1=arr.slice(); // 复制数组arr  var arr1=arr.slice(0); // 复制数组  var arr1=arr.slice(3); //从第三位截取到尾部复制  var arr1=arr.slice(-2); //从倒数第二位开始截取到尾部  var arr1=arr.slice(-3,-1); //从倒数第三位到倒数第一位 复制代码

九、indexOf(要查询得元素,从什么位置开始查询) 位置就是下标

在数组中查找元素，找到返回元素下标，找不到返回-1，查询到第一个后，就返回下标再也不继续查询

1）不能查询对象

var arr=[{a:1},{a:2},{a:3},{a:4}];
 var index=arr.indexOf({a:1}); // 这是错误得，查找不到，由于查找得是新对象,地址不一样  console.log(index); 复制代码

查询不到返回-1

2）查询全部相同的元素

var arr=[1,3,1,2,3,5,2,3,4,6];
 var index=arr.indexOf(3); // 这样只能查询到第一个3 （下标为1）  console.log(index);  var index=arr.indexOf(3,2); // 这样只能查询到第二个3 （下标为4）  console.log(index); 复制代码

查询所有相同的元素利用循环查询

var arr=[1,3,1,2,3,5,2,3,4,6];
 var index=0; // 使用循环，查询到数组中全部为3的元素，并打印下标  while(true){  index=arr.indexOf(3,index);  console.log(index);  if(index===-1) break; // 查询到最后，查不到时返回-1 若是为-1 跳出循环，再也不查询  index++;  } 复制代码

十、Array.from(相似于数组的列表) 转为数组

1）根据标签名获取到标签列表 （获取到的是列表，不是数组，不能直接使用数组的方法

var divs=document.getElementsByTagName("div"); // 获取html元素标签名是div的元素
  divs.pop()；// 错误，不是数组不能直接使用数组的方法   var arr=Array.from(divs); // ES6 的写法，把divs这个列表，转为数组  // ES5写法 => var arr=Array.prototype.slice.call(divs); 复制代码

2）给全部 div 元素添加点击事件

var divs=document.getElementsByTagName("div");
 var arr=Array.from(divs); // 把获取到的全部div转成数组   for(var i=0;i<arr.length;i++){ // 遍历数组给每一个div添加点击事件  arr[i].onclick=clickHandler;  }  function clickHandler(){  console.log(this);  var index=arr.indexOf(this);  console.log(index); // 这样就能够判断点击得是列表中得第几个元素  } 复制代码

十一、lastIndexOf(查找得元素，从什么位置开始查找) 从后向前查找

var arr=[1,3,1,2,3,5,2,3,4,6];
 var index=arr.lastIndexOf(3);  console.log(index); // 打印下标 7 复制代码

十二、遍历数组（forEach 和 map）

1）forEach

arr.forEach(function(数组中的元素，每一个元素对应的下标，数组自身){ })

var arr=[1,2,3,5,6,7,8,9];
 arr.forEach(function(a,b,c){  console.log(a,b,c);  }) 复制代码

forEach没有返回值，使用return无效

2）map会返回一个与原数组长度相等的新数组

arr.map(function(item,index,arr){ })

var arr=[3,5,7,9,1,2,4];
 var arr2=arr.map(function(item,index,arr){  // console.log(item,index,arr);  // return "a";  return item+10; // 在map中使用return 就是在对应的下标中添加对应的数据  });  console.log(arr2); 复制代码

// 遍历数组arr，将大于4的元素生成一个新的数组（新数组中会有undefined）
 var arr=[1,3,5,7,2,4,6,8];  var arr1=arr.map(function(item){  if(item>4){  return item;  }  });  console.log(arr1); 复制代码

map有返回值，与原数组等长的新数组，元素内容由return肯定，不写return返回undefined

1三、arr.sort() 排序，仅能10之内数字

缺点：按字符排序 sort(function(后一项,前一项){}) 仅适用于数值

1）数值排序

var arr=[1,3,5,7,2,4,6,8];
 arr.sort(function(a,b){  return a-b; // 从小到大  // return b-a; // 从大到小  })  console.log(arr); 复制代码

2）字符排序，先把字符转换成Unicode编码

var arr=["n","c","g","h","a","j","y","k"];
 arr.sort(function(a,b){ // 将字符排序  console.log(a.charCodeAt(0),b.charCodeAt(0)); // str.charCodeAt(0) => 将str字符串的第0项转换为Unicode编码  return a.charCodeAt(0)-b.charCodeAt(0); // a-z  // return b.charCodeAt(0)-a.charCodeAt(0); // z-a  })  console.log(arr); 复制代码

1四、some()

判断数组中是否存在知足条件的元素，若是有就返回true，若是没有就返回false
遍历数组，若是有一个知足条件的元素，都会直接返回true，不继续向后遍历

var arr=[1,4,6,2,7,9,0];
 var bool=arr.some(function(item,index,arr){ // 遍历数组，是否存在大于5的元素  return item>5;  });  console.log(bool); 复制代码

1五、every()

var bool=arr.every(function(item,index,arr){ });
判断数组中是否每个都知足条件，若是有一个不知足条件，直接跳出，全部都知足时返回为ture

var arr=[1,4,6,2,7,9,0];
 var bool=arr.every(function(item,index,arr){ // 判断数组中 是否全部的元素都大于2  return item>2;  });  console.log(bool); 复制代码

1六、filter()

要求是将数组中大于5的返回到一个新数组
首先想到map，map只能实现原数组和新数组长度相同

var arr1=arr.filter(function(item,index,arr){
 return item>5;  });  console.log(arr1); 复制代码

1七、reduce()

从数组的第1位开始遍历，第0位没有遍历，下标从1开始
刚开始value是数组的第0项，后面每次value都是undefined
若是在函数中使用return 就会将返回值在下次数组的遍历中赋予value

var arr=[10,3,4,7,3,5,8,9];
 arr.reduce(function(value,item,index,arr){  // 循环的次数是数组的个数-1  // value就是上次遍历return的值，第0次遍历时（最开始时是数组的第0项）  console.log(value);  return value+1  }) 复制代码

累积相加数组元素求和
reduce返回的是一个值，就是遍历到最后一次return出来的值

var arr=[10,3,4,7,3,5,8,9];
 var sum=arr.reduce(function(value,item){  return value+item;  });  console.log(sum); 复制代码

但愿求累积相加数组元素求和，在基数100的前提下，100就是初始值

var arr=[10,3,4,7,3,5,8,9];
 var sum=arr.reduce(function(value,item){  // 函数后面的参数就是累加的初始值  console.log(value);  return value+item;  },100); 复制代码

1八、Array.isArray()

用来判断是否是数组

var arr=[1,2,3,4];
 var obj={a:1};  console.log(typeof arr);  // 判断元素是不是数组，若是是数组返回true不然返回false，ES6  console.log(Array.isArray(arr));  console.log(Array.isArray(obj)); 复制代码

2、Math方法

一、π和根号2

Math.PI; // Π
 Math.SQRT2; // 根号2 常量，只能使用不能修改 复制代码

二、取整

1）向下取整 Math.floor()

a=Math.floor(25.6);
 console.log(a); 复制代码

2）向上取整 Math.ceil()

b=Math.ceil(25.6);
 console.log(b); 复制代码

三、四舍五入 Math.round()

方法存在偏差

c=Math.round(25.5);
 console.log(c); 复制代码

负数的四舍五入，通常都是转换为正数处理

四、最大值和最小值

1）最小值Math.min()

c=Math.min(4,7,8,3,1,9,6,0,3,2)
 console.log(c) 复制代码

2）最大值 Math.max()

c=Math.max(4,7,8,3,1,9,6,0,3,2)
 console.log(c) 复制代码

五、随机数 Math.random

c=Math.random()*10+1; // 随机1-10之间的任意数
 console.log(c) 复制代码

随机的数不是一个整数通常作取整处理

c=Math.random()*10+1;
 console.log(Math.floor(c)); // 向下取整 复制代码

六、其余的方法

3、String 字符串方法

一、charAt()

获取下标位置的字符，和str[1]; 同样的

var str="abcdef";
 console.log(str.charAt(3)); 复制代码

二、charCodeAt()

将下标位置的字符转为Unicode编码

var str="abcdef";
 console.log(str.charCodeAt(2)); 复制代码

三、String.fromCharCode()

将Unicode编码转为字符串

n=String.fromCharCode(65); // 将Unicode编码转为字符串
 console.log(n); 复制代码

四、str.concat()

链接字符串，效果等同于拼接符+

var str="abc";
 var str1="def";  var str2=str.concat(str1); // var str2=str+str1; 这个等同于concat  console.log(str2); 复制代码

五、 indexOf() 、lastIndexOf()

和数组中indexOf相同查找字符所在下标

var arr=[
 {id:1001,name:"计算机",price:4999},  {id:1002,name:"电机",price:1999},  {id:1003,name:"记事本",price:9},  {id:1004,name:"课本",price:99},  {id:1005,name:"计算器",price:149},  ];   // 模糊查找  var arr1=arr.filter(function(item){  return item.name.indexOf("本")>-1  });  console.log(arr1); 复制代码

六、replace()

替换，相似于数组中的splice();
replace不修改原字符的内容，会返回一个被修改后的新字符串
若是出现两个相同的元素，那么只修改第一次被查找到的元素

var str="abcdecf";
 var str1=str.replace("c","z");  str.replace()  console.log(str,str1); 复制代码

七、slice(start,end)

slice (从下标几开始，到下标几以前结束) 截取复制字符串
容许有负值，负值表示从后向前

var str="abcdecf";
 var s=str.slice(1,2);  console.log(s); 复制代码

八、substring()

var str="abcdecf";
 var s=str.substring(2,4); // 和slice类似  // substring不容许负数，全部的负值指0以前，所以负数都是0  // 能够逆向截取赋值  var s=str.substring(4,2);  console.log(s); 复制代码

九、substr (从下标几开始，截取长度);

var str="abcdecf";
 var s=str.substr(-2,5); //从下标几开始，截取长度  console.log(s); 复制代码

十、split(分隔符) 将字符串以分隔符进行分割转换为数组

var str="a,b,c,d,e,f";
 var arr=str.split(",");  console.log(arr); 复制代码

十一、reverse()；数组元素倒序或者反转，这是一个数组方法

var str="abcdefg";
 var str1=str.split("").reverse().join(""); // 连缀  console.log(str1) 复制代码

十二、字符串转换大小写

1）str.toLowerCase转为小写

console.log("ABC".toLowerCase()); // 将字符串转换成小写
复制代码

2）str.toUpperCase转为大写

console.log("abc".toUpperCase()); // 将字符串转换成大写
复制代码

3、日期对象

一、建立日期对象

var date=new Date(); // 建立日期对象
复制代码

二、获取日期

var date=new Date(); 
 date.getFullYear(); // 获取年份  date.getYear(); // 获取的年份是从1900年开始计算的，有问题  date.getMonth()+1; // 获取月份 从0开始  date.getDate(); // 获取日期  date.getDay(); // 获取星期 从0开始 0就是星期日 1是星期1  date.getHours(); // 获取小时  date.getMinutes(); // 获取分钟  date.getSeconds(); // 获取秒  date.getMilliseconds()；// 获取毫秒  console.log(date); 复制代码

二、以上日期都可设置

var date=new Date(); 
 date.setFullYear(2021);  date.setMonth(12); // 1月，进位了年份+1 是从0开始的;  date.setDate(40); // 设置进位了  date.setHours(date.getHours() + 2); // 设置为如今时间的2小时后  date.getUTCFullYear(); // 凡是带有UTC都是格林尼治时间  date.toString(); // 直接转换为字符串  date.toLocaleString(); // 转换为本地（windows上）设置格式时间字符串  date.toUTCString(); // 转换为格林尼治时间字符串  console.log(date); 复制代码

三、时间戳

date.getTime(); // 毫秒数，是计算从1970年1月1日 00：00：00 到如今的毫秒数 
复制代码

时间会一直流逝，这个数据将会一直变大，每毫秒获取值都不一样，所以这个数字永远不重复
浏览器认为每次请求的地址若是相同时，会先查看浏览器缓存是否存在，若是有就用本地缓存
能够经过时间戳使每次访问的地址都不一样，避免浏览器使用本地缓存

本文使用 mdnice 排版