前端经常碰到的小知识点-----js篇

一    js

1.可视区宽和高

① document.documentElement.clientWidth  //可视区的宽度

document.documentElement.clientHeight //可视区的高度

②100 vw  //可视区的宽度

100 vh  //可视区的高度

vw : 1vw 等于视口宽度的1%

vh : 1vh 等于视口高度的1%

2.正则表达式

正则表达式描述了一种字符串匹配的模式，可以用来检查一个串是否含有某种子串，将匹配的字串替换或者从某个串中取出符合某个条件的字串。、

使用途径：1.只要按规则模糊匹配多个关键词时2.只要按规则验证字符串是否符合要求

使用方式： 1. 只用正则直接量: var reg=/正则/ig;  2. 用new: var reg=new RegExp("正则","ig");

String中常用正则API：

检索：

1.查找一个固定关键词出现的位置

var i=str.indexOf("关键词",fromi)

var i=str.lastIndexOf("关键词",fromi)

2. 判断是否包含符合规则的关键词:

var i=str.search(/正则/i)

3. 获得所有关键词的内容:

var i=str.match(/正则/ig);  如果不加g:  match也相当于search，但可获得关键词内容: [0:"关键词",index:i]

4. 即获得每个关键词的内容，又获得每个关键词的位置: reg.exec(str)

替换：

简写：将所有关键词替换为统一的替换值

str =str,replace(/正则/ig,'替换值')

高级：根据关键词的不同，替换不同的值

str = str.replace(/正则/ig,

function(kw,$1,$2,...){

return  根据kw判断返回不同替换值

)

删除：将关键词替换为 ‘’

切割：  var subStrs =str.split(/正则/)；

3.isNaN()

isNaN()函数用于检查其参数是否是非数字值。

isNaN(233);  false

isNaN(ni);  true

4.保留两位小数或取整

四舍五入：

1.var num =2.3362412322;

num = num.toFixed(2); // 输出结果为 2.34

不四舍五入：

2.Math.floor(15.66842340 * 100) / 100 // 输出结果为 15.66

3.Number(15.66842340.toString().match(/^\d+(?:\.\d{0,2})?/)) // 输出结果为 15.66

4.分享经典解决方法：

 

图一

取整

parseInt(2.56789)   //2

Math.ceil(2.567)    //2

Math.ceil(2.56789)   //3

Math.round(2.5678)   //3

m^0

m|0

m>>>0

连接:

var newArr=arr1.concat(arr2);//将arr2拼接到arr1之后，返回新数组

注意: concat无权修改原数组，只能返回新数组，必须用变量接住拼接的结果。

concat中可以是任何类型的参数，可以是数组，数字，字符串

如果 .concat(值1,值2,arr2,....);，那么.concat可以打散数组类型的参数为单个值。

截取子数组:

var subArr=arr.slice(starti,endi+1);//截取arr中starti位置开始到endi位置结束的子数组。

注意: 含头不含尾，结束位置要+1

支持负数参数:表示倒数第n个位置，其实执行的还是length-n

如果省略第二个参数，表示从starti位置直接截取到结尾。

concat和slice都不可直接修改原数组，必须使用新变量接收

删除/插入/替换数组

splice: 删除，插入，替换

删除: arr.splice(starti,n)

删除arr中starti位置开始的n个元素

注意: n是个数，不考虑含头不含尾

splice可返回删除的元素组成的临时数组。

var deletes=arr.splice(starti,n)

插入: arr.splice(starti,0,值1,值2,...)

在arr的starti位置插入值1,值2,...，原starti位置及其之后的值，都被向后顺移

注意: 0 表示不删除，只插入新值

不支持打散数组类型参数，如果传入数组，会形成子数组

替换: var deletes=arr.splice(starti,n,值1,值2,...)

先删除starti位置开始的n个，再在starti位置插入值1,值2。

注意: 删除的元素个数，和插入新值得个数，不必一致。

conca和splicet:

concat:  优: 打散数组类型参数

缺: 只能拼接在开头或结尾

splice:  优: 可指定插入位置

缺: 不支持打散数组参数