float js 正则 验证_原生js的常用方法

以下是个人总结，也有一些是大神的，现在放到一起，方便以后查阅（有不对的地方，还望大家能够提出，我会尽快加以改正）。

一、!!强制转boolean
根据真值，假值 判断，返回true，false 假值：0 “” null undefined false NaN

1. 例如：
2. var nu=null;
3. var nul="";
4. var str="abcd";
5. console.log(!!nu) // false;
6. console.log(!!nul) // false;
7. console.log(!!str) // true;

二、+obj 强制转Number
将对象强制转number,如果是纯数字的“88”字符串，可转为number

1. var a="88";
2. console.log(+a) =>88
3. //但是如果是混合类型的字符串，则会转为NaN
4. var b="1606e";
5. console.log(+b) => NaN

三、不可靠的undefined 可靠的void 0
在JavaScript中，假设我们想判断一个是否是 undefined，那么我们通常会这样写：

1. if(a === undefined){
2. dosomething
3. }

//但是在`javascript`中，`undefined`是不可靠的

例如：
当undefined在函数内，并且是在局部变量是可以赋上值

1. function foo2(){
2. var undefined=1;
3. console.log(undefined)
4. }
5. foo2(); =>1;

但是当在函数内定义一个全局变量，并不能给赋上值

1. var undefined;
2. function foo2(){
3. undefined=1;
4. console.log(undefined)
5. }
6. foo2() // undefined
7. void 0或者 void (0)：

最常见的用法是通过void 0 运算来获得 undefined，表达式为 0 时的运算开销最小：
那在以后需要判断值为undefined的时候，可以直接用void 0或者void (0)

四、字符串也是有length属性的！
我们知道所有的array都是有length,属性，就算事空数组，length 是0，那么字符串有没有呢？接下来我们来验证一下：

1. var str="sdfsd5565s6dfsd65sd6+d5fd5";
2. console.log(str.length) // 26

结果是有的，所以我们在判断类型时，不能单纯拿有没有length属性来判断是不是数组了，我们可以用下面的方法：

1. var obj=[1,2] ;
2. console.log(toString.call(obj) === '[object Array]');

五、生成一个随机数组(创建数组，sort排序)
在项目中有时候我们需要一个随机打乱的数组，那么下面我们来实现以下：
先来创建一个数组：

1. var arr=[];
2. for(var i=0;i<10;i++){
3. arr.push(i)
4. }
5. console.log(arr) // [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]

接下来我们来打乱它：

1. arr.sort(()=>{
2. return Math.random() - 0.5
3. }) // [1, 0, 2, 3, 4, 6, 8, 5, 7, 9]

第二种打乱方法：

1. arr.sort((a,b)=>{
2. return a>Math.random()*10;
3. }) // [1, 2, 0, 6, 4, 3, 8, 9, 7, 5]

我们以前的正常排序是这样的：

1. arr.sort(function(a,b){
2. return b-a
3. });

解析：
先说正常的排序：
a,b表示数组中的任意两个元素，若return > 0 b前a后；reutrn < 0 a前b后；a=b时存在浏览器兼容 ，a-b输出从小到大排序，b-a输出从大到小排序。
然后再说我们打乱的方法：
创建数组不用说，接下来就是用js的sort方法 来实现，Math.random()实现一个随机0-1之间的小数 然后再减去0.5，这时就会根据return比较后得到的值排，所以说就会生成不是正常从大到小或者从小到大的排序。

第二个打乱的方法同样是遵循sort的方法，将a,b传进去 然后和随机数做比较，关于比较的方法不太清楚。

六、去除前后、前、后 所有空格
这是专门为去除空格写的一套方法，适用于各种情况，所有空格,前后空格，前空格，后空格。

var strr=" 1 ad dertasdf sdfASDFDF DFG SDFG "
// type 1-所有空格 2-前后空格 3-前空格 4-后空格

1. function trim(str,type){
2. switch (type){
3. case 1:return str.replace(/s+/g,"");
4. case 2:return str.replace(/(^s*)|(s*$)/g, "");
5. case 3:return str.replace(/(^s*)/g, "");
6. case 4:return str.replace(/(s*$)/g, "");
7. default:return str;
8. }
9. }
10. console.log( trim(strr,1)) // "1addertasdfsdfASDFDFDFGSDFG"

解析：
这个方法用的是正则的匹配格式,后面我会把正则单独拿出来总结一个系列，敬请期待！！！

1. s ：空格符，Tab,换页符，换行符
2. S ：非s的所有内容
3. /g : 全局匹配
4. ^ : 匹配在行首
5. $ : 匹配在行尾
6. + ：重复次数>0
7. * ：重复次数>=0
8. | : 或者

replace(a,b)：方法用于在字符创中用一些字符替换另一些字符, 会传入两个值，将逗号前面的值a替换成逗号后面的值b

七、字母大小写切换（正则匹配，replace）
这个方法主要是给一些需要大小写转换提供的方法，主要有首字母大写，首字母小写，大小写转换，全部转大写和全部转小写。

1. type：
2. 1:首字母大写
3. 2：首页母小写
4. 3：大小写转换
5. 4：全部大写
6. 5：全部小写

原始字符串：

1. var str="sdfwwerasfddffddeerAasdgFegqer";
2. function changeCase(str,type) {
3. //这个函数是第三个大小写转换的方法
4. function ToggleCase(str) {
5. var itemText = ""
6. str.split("").forEach(
7. function (item) {
8. // 判断循环字符串中每个字符是否以a-z之间开头的并且重复大于0次
9. if (/^([a-z]+)/.test(item)) {
10. // 如果是小写，转换成大写
11. itemText += item.toUpperCase();
12. }
13. // 判断循环字符串中每个字符是否以A-Z之间开头的并且重复大于0次
14. else if (/^([A-Z]+)/.test(item)) {
15. // 如果是大写，转换成小写
16. itemText += item.toLowerCase();
17. }
18. else{
19. // 如果都不符合，返回其本身
20. itemText += item;
21. }
22. });
23. return itemText;
24. }
25. //下面主要根据传入的type值来匹配各个场景
26. switch (type) {
27. //当匹配
28. case 1:
29. return str.replace(/^(w)(w+)/, function (v, v1, v2) {
30. //v=验证本身 v1=s ; v2=dfwwerasfddffddeerAasdgFegqer
31. return v1.toUpperCase() + v2.toLowerCase();
32. });
33. case 2:
34. return str.replace(/^(w)(w+)/, function (v, v1, v2) {
35. //v=验证本身 v1=s ; v2=dfwwerasfddffddeerAasdgFegqer
36. return v1.toLowerCase() + v2.toUpperCase();
37. });
38. case 3:
39. return ToggleCase(str);
40. case 4:
41. return str.toUpperCase();
42. case 5:
43. return str.toLowerCase();
44. default:
45. return str;
46. }
47. }
48. console.log(changeCase(str,1)) =>SdfwwerasfddffddeerAasdgFegqer

解析：

1. split：用于把一个字符串分割成字符串数组
2. w: 数字0-9或字母a-z及A-Z,或下划线
3. W: 非w，除以上的特殊符号等
4. toUpperCase：转大写
5. toLowerCase：转小写
6. replace第二个参数可以是函数，函数的参数中，第一个是本身，第二个是正则匹配内容，第三个匹配剩下的内容

下面我们就通过小实验来验证一下：
网上有说replace是可以有4个参数的，但是我并没有验证到第四个代表的意义，前三个已经验证，第一个参数为验证本身，第二个正则匹配结果，第三为第二个匹配完剩下的值。

八、循环n次传入的字符串 str为传入随意字符串，count为循环的次数

1. var str="abc";
2. var number=555;
3. function repeatStr(str, count) {
4. //声明一个空字符串，用来保存生成后的新字符串
5. var text = '';
6. //循环传入的count值，即循环的次数
7. for (var i = 0; i < count; i++) {
8. //循环一次就把字符串+到我们事先准备好的空字符串上
9. text += str;
10. }
11. return text;
12. }
13. console.log(repeatStr(str, 3)) // "abcabcabc"
14. console.log(repeatStr(number, 3)) // "555555555"

解析：根据count循环的次数，在循环体内复制，return 返回+=后的值

九、查找字符串的A内容替换成B内容

1. let str="abacdasdfsd" function replaceAll(str,AFindText,ARepText){
2. raRegExp = new RegExp(AFindText,"g");
3. return str.replace(raRegExp,ARepText);
4. }
5. console.log(replaceAll(str,"a","x")) // xbxcdxsdfsd
6. str：需要编辑的字符串本身
7. AFindText:需要替换的内容
8. ARepText:被替换成的内容

解析：创建正则，匹配内容，替换

十、检测常用格式，邮箱，手机号，名字，大写，小写,在表单验证时，我们经常会需要去验证一些内容，举例几个常用的验证

1. function checkType (str, type) {
2. switch (type) {
3. case 'email':
4. return /^[w-]+(.[w-]+)*@[w-]+(.[w-]+)+$/.test(str);
5. case 'phone':
6. return /^1[3|4|5|7|8][0-9]{9}$/.test(str);
7. case 'tel':
8. return /^(0d{2,3}-d{7,8})(-d{1,4})?$/.test(str);
9. case 'number':
10. return /^[0-9]$/.test(str);
11. case 'english':
12. return /^[a-zA-Z]+$/.test(str);
13. case 'chinese':
14. return /^[u4E00-u9FA5]+$/.test(str);
15. case 'lower':
16. return /^[a-z]+$/.test(str);
17. case 'upper':
18. return /^[A-Z]+$/.test(str);
19. default :
20. return true;
21. }
22. }
23. console.log(checkType ('hjkhjhT','lower')) //false

解析：

1. checkType ('hjkhjhT','lower')'需要验证的字符串'，'匹配的格式'
2. email：验证邮箱
3. phone：验证手机号
4. tel：验证座机号
5. number：验证数字
6. english：验证英文字母
7. chinese：验证中文字
8. lower：验证小写
9. upper：验证大写

JS返回浏览器历史第一页：

我在浏览器控制台敲了 window.history 其实我想看看还有哪些API，他输出了以下信息，我看到length 这个属性让我眼前一亮，其他2个我不关心。

1. {
2. length: 2,
3. scrollRestoration: "auto",
4. state: null
5. }

web前端开发需要视频教程以及资料：

　　百度网盘链接：http://mrw.so/6elsE1提取码: ae4c　

我尝试用length 去回退， 不成功！

window.history.go(-2);

我再尝试用length去减1, 成功了， 我猜应该是跟新标签页有关吧。那我不管了，我已经有答案了

window.history.go(-1);

最后代码

1. var historyLen = window.history;
2. window.history.go(-(historyLen - 1));

测试了3个浏览器， 都是第一次打开浏览器测试

1. Chrome 会直接返回到新标签页
2. Safari 我这里测试是返回到百度，可能是我的设置问题
3. Firefox 直接关闭浏览器

作者：学致前端