「已注销」-CSDN博客

原创前端性能优化汇总

1. 对于静态资源文件采用“强缓存”和“协商缓存”，目的：让页面第二次及以后加载更快扩展：描述强缓存和协商缓存(请求头和响应头字段)；如何保证服务器资源更新后,客户端可以抛开本地缓存,从服务器获取最新的信息；2. 在直接操作DOM的时候，要减少DOM的重排(或回流)，目的：提高页面重新渲染的性能+ 尽可能使用vue/react等框架,避免直接操作DOM+ 读写分离「扩展：浏览器的渲染队列机制」+ 样式集中修改+ 批量新增元素，基于文档碎片或者字符串拼接等方式，统一插入到页面中

2021-10-04 11:49:37 234

原创检测数据类型的通用办法，已封装

(function () { var getProto = Object.getPrototypeOf; var class2type = {}; var toString = class2type.toString; //Object.prototype.toString var hasOwn = class2type.hasOwnProperty; //Object.prototype.hasOwnProperty var fnToString = hasOwn.

2021-09-12 13:52:15 196

原创面试题：重写instructor

/* // 面试题：重写 instanceof // obj:要检测的实例对象「原始值类型检测结果都是false」// Ctor:要检测的构造函数// 原理：一级级的去查找obj的原型链，如果其中某一次查找的内容正好是Ctor.prototype，则结果是true；如果找到Object.prototype还没有出现Ctor.prototype，则结果是false...var instance_of = function instance_of(obj, Ctor) { // 校验Ctor的.

2021-09-12 13:49:39 188

原创超详细！检测数据类型常见的四种方法是什么？他们的区别是什么？

/* * 数据类型检测： * + typeof * typeof [value] -> 返回一个字符串，其次字符串中包含了对应的数据类型 * 特点： * @1 typeof null -> "object" * @2 typeof不能细分对象类型，除函数对象会返回“function”，检测其余对象都是返回“object”「含：非标准特殊对象 new Number(1) 等」 * @3 基于typeof检测一个未被声.

2021-09-12 13:34:59 520

原创浏览器的底层渲染机制及页面运行时的性能优化

编写一个页面所需的技术栈： HTML & CSS 「less/sass/stylus...」开发者按照W3C规范去编写代码，浏览器本身也是按照W3C规范去编译解析我们的代码，最后渲染出我们想要的效果!! javascript 「ES6+/XMLHttpRequest/vue/react...」开发者按照ECMAScript-262规范去开发代码，浏览器也按照这个规范来解析浏览器内核：谷歌：blink（webkit内核的分支） Safari：w...

2021-09-05 13:45:52 245

原创从正则的含义到正反向预查和捕获

正则构成：元字符和修饰符正则含义：正则是专门用来处理字符串的一种技术。这个处理包含两方面的：1.正则匹配，判断某一个字符串是否符合规则2.正则捕获，把符合规则的字符串捕获到创造正则的两种方式：字面量和构造函数let obj={}//字面量let obj2=new Object()//构造函数正则匹配let obj={qq:'hello'}let reg=/jchckhello/let t_str=JSON.stringify(obj); //使用对象方法把对象转为..

2021-09-02 18:28:49 298

原创两种方法获取一个字符串中出现次数最多的字符

第一种方法let str = 'sdfgsgsdgfsgfsfgsgfssfgsrger34tyj'; // 使用一个对象去存储各个不同的字符，把字符当作了对象的属性名，属性值用来存储该字符出现的次数 function fn(str) { let obj = {} for (let i = 0; i < str.length; i++) { let key = str[i]; if (obj[k

2021-09-01 23:03:52 5923

原创如何用正则写千分符？/ 千分符正则表达式

let reg = /\d(?=(\d{3})+$)/g //前边一个数字这个数字的后边必须是三位三位的数字，还得是以这个位三位的数字结尾 //123432 let str = '123456789000000' let res = str.replace(reg, function(a, b) { // console.log(arguments) return a + ',' }) console.l.

2021-09-01 20:31:17 454

原创如何用正则验证身份证号码？ / 正则验证身份证号码

let a = '61352719931022045X' let age = /^\d{17}[\d|X]/ // let age = /^\d{17}[\dX]/ // let age = /^\d{17}[0-9X]/ console.log(age.test(a))这个正则表达式是验证18位身份证号码，以17位数字开头，最后一位是数字或者X...

2021-09-01 20:27:03 753

原创如何用正则验证手机号？11位手机号用正则这样写即可！

let num = 13456782222; let aa = /^1[35789]\d{9}$/; console.log(aa.test(num))以1开头，第二位是35789中的任意一位，以9位数字结尾。这样就是11位手机号的正则写法

2021-09-01 20:18:55 7243

原创手撕内置new / 手写内置new

/*进阶：重写内置NEW*/ function Dog(name) { this.namer = name; } Dog.prototype.bark = function() { console.log('wangwang'); } Dog.prototype.sayName = function() { console.log('my name is ' + this.name); } /*.

2021-09-01 20:11:05 159

原创手撕内置call / 如何手写内置call

Function.prototype.call = function call(context, ...params) { // this->fn context->obj params->[10,20] //目的：把fn{this}执行，让其this指向obj{context}，并且把10/20{params}传递给他，最后把fn执行的结果返回 //额外处理：如果context是原始值类型，是无法设置属性的，此时我们需要把原始值类型变为对象类型 if (.

2021-09-01 20:08:24 119

原创手撕bind怎么写/手写bind

Function.prototype.bind = function bind(context, ...params) { // this->fn context->obj params->[10/20] let self = this; return function proxy() { // this->document return self.call(context, ...params); };};// .

2021-09-01 20:03:12 95