工作中遇到的小知识点 ---查漏补缺 (1)

1、jQuery.extend() // jQuery 库中将一个或多个对象合并成目标对象对象的方法

// $.extend( flag, target, obj1, ...objN )
// flag 表示是否深度合并，可以省略
// target 目标对象、 obj1，objN 要一起合并的对象
var object1 = {
	apple: 0,
	banana: { weight: 52, price: 100 },
	cherry: 97
	};
	var object2 = {
	banana: { price: 200 },
	durian: 100
	}; 
	// 未深度合并, 同名属性后者覆盖前者
	$.extend(object1, object2) // { apple: 0, banana:{price:200}, cherry: 97, durian: 100 } 
	// ES6 可用扩展符进行合并 {...object1, ...object2}
	
// 深度合并
	$.extend( true, object1, object2 ); // {"apple":0,"banana":{"weight":52,"price":200},"cherry":97,"durian":100}

2、navigator.platform

// navigator是一个全局对象， navigator.platform() 返回浏览器操作系统平台(例：“MacIntel”, “Win32”, 等)

3、 邮箱、账号、手机号和电话的正则表达式验证方法

 // 邮箱验证: AAAA@BBBB.CCC, AAAA以字母数字开头，之后包括字母数字下划线和短线“-”组成，BBBB由字母，数字，CCC域名后缀 2-4 个字母组成
 let EmailReg = /^([a-zA-Z]|[0-9])(\w|\-)+@[a-zA-Z0-9]+\.([a-zA-Z]{2,4})$/;
 
 // 账号验证： 字母、数字、下划线组成，字母开头，4-16位。
 let acNoReg = /^[a-zA-Z](\w{3, 15})$/;
 
 // 手机号验证： 11位数字，1开头
 let tel = /^1\d{10}$/;
 // 电话号码： 区号+号码； 区号0开头，3-4位，号码7-8位；区号和号码之间有或没有 "-" 连接
 let phone = /^0\d{3, 4}-?\d{7, 8}$/;

4、 React setState修改数组中的数据，视图不更新；给节点增加key值，修改数组数据，同时动态改变key值，已达到视图更新的目的（不是很好）

5、babel-polyfill: 工作用的浏览器环境并不支持ES6新增的属性方法，因此引入babel-polyfill，为当前环境提供一个垫片。

polyfill：指的是“用于实现浏览器不支持原生功能的代码”，　
安装命令----cnpm install --save babel-polyfill
引 入----import 'babel-polyfill';

6、 移动端开发时，date对象在ios和安卓上存在的兼容性问题：

 // 安卓和苹果上new Date("2020/03/26 21:13:40") 都是可以正常执行的
 // 安卓上 new Date("2020-03-26 21:13:40") 是能够正常执行的，但是苹果上并不行，因此考虑到兼容性，需要对时间格式进行处理
 
 let time= "2020-03-26 21:13:40";
 
 time= time.replace(/\-/g,"/");
  
 time = new Date(time)

7、同样是移动端，安卓和ios的兼容性问题：安卓上input输入框中光标的高度字体大小一致，但是ios中input中光标与行高一致；

8、在移动端做一个信息录入并在pc端输出的功能时，出现换行并不能再pc端显示而是转换成了空格，可采用以下办法：

给外层容器设置 white-space: pre-wrap;的css样式，保留空白及换行符。

9、underscore库：

underscore网址

underscore是同jQuery类似的js第三方库，jQuery是统一了不同浏览器之间的差异，而underscore则是提供了一系列较完善的函数式编程的接口。
　　在数组中可以使用arr.map()遍历，但是对象则没有这种方法，而underscore则提供了这个方法能够遍历；
　　同时对于不支持ES6 的环境，underscore同样支持；
　　jQuery把自身绑定到唯一的全局变量 $上，而underscore则是绑定到 _上；

// 数组
_.map([1, 2, 3], (x) => x * x); // [1, 4, 9]

// 对象
_.map({ a: 1, b: 2, c: 3 }, (v, k) => k + '=' + v); // ['a=1', 'b=2', 'c=3']

10、 indexOf(target，start)

一般我们只是习惯只传入一个参数，第二个参数表示开始查找的位置：从start位开始

11、 Promise.resolve

promise回调中的参数 resolve 和 reject 只会更改 promise 的状态 但是不会中断 resolve 下面代码的执行

function pm() {
        const n = 3;
        return new Promise((resolve, reject) => {
          if (n == 3) {
            resolve(n);
          }
          console.log("122222");
        });
      }
      pm().then((n) => {
        console.log(n);
      });

// 先输出'122222' 后输出3

12、antd的动态主题与craco-antd不能一起使

欢迎指正，一起讨论学习