- 博客(47)
- 收藏
- 关注
RSS订阅原创 async/await函数需要trycatch吗？
写异步函数的时候，promise 和 async 两种方案都非常常见，甚至同一个项目里，不同的开发人员都使用不同的习惯, 不过关于两者的比较不是本文关注的重点，只总结为一句话：“async 是异步编程的终极解决方案”。当使用 async 函数的时候，很多文章都说建议用 try catch 来捕获异常, 可是实际上我看了很多项目的代码，遵循的并不是严谨，很多都没有用，甚至 catch 函数都没写，这是为什么呢？
2023-08-09 19:49:56
199
原创 浅析理解vue3的设计与实现（1）-------vue3在设计时做了哪些“取舍”
从vue3学习者的角度来看，应该先从全局的角度对框架的设计有清楚认知，不用纠结于一些小细节。框架在进行设计时，都会有一些取舍，vue3也不例外。命令式or声明式？极致性能or保持可维护性？运行时or编译时？命令式和声明式命令式框架的特点是关注过程，声明式框架的特点是关注结果。区别我们在具体的例子中看下：-获取id为app的标签-添加他的文本内容为 hello world-为其绑定点击事件-当点击时弹出提示：ok这里我们使用声明式框架jquery的代码来实现下：$('#app')//获取节
2022-03-13 23:47:49
947
原创 浏览器缓存
浏览器缓存分为强缓存和协商缓存。当客户端请求某个资源时，获取缓存的流程如下先根据这个资源的一些 http header 判断它是否命中强缓存，如果命中，则直接从本地获取缓存资源，不会发请求到服务器；当强缓存没有命中时，客户端会发送请求到服务器，服务器通过另一些request header验证这个资源是否命中协商缓存，称为http再验证，如果命中，服务器将请求返回，但不返回资源，而是告诉客户端直接从缓存中获取，客户端收到返回后就会从缓存中获取资源；强缓存和协商缓存共同之处在于，如果命中缓存，服务器都不会
2020-09-14 08:24:31
161
1
原创 JS 数组和对象的遍历方式，以及几种方式的比较
通常我们会用循环的方式来遍历数组。但是循环是 导致js 性能问题的原因之一。一般我们会采用下几种方式来进行数组的遍历for in循环for循环forEach这里的 forEach回调中两个参数分别为 value，indexforEach 无法遍历对象let xmObj = { name: 'xiaoming', sex: '男', aeg: 23 };// 将 Generator 函数加到对象的Symbol.iterator属性上面xmObj[Symbol.iterator] = objG
2020-09-09 08:37:32
470
原创 如何通过JS判断一个数组
instanceof方法instanceof 运算符是用来测试一个对象是否在其原型链原型构造函数的属性var arr = [];arr instanceof Array; // trueconstructor方法constructor属性返回对创建此对象的数组函数的引用，就是返回对象相对应的构造函数var arr = [];arr.constructor == Array; //true最简单的方法这种写法，是 jQuery 正在使用的Object.prototype.toStrin
2020-09-08 11:25:23
85
原创 js延迟加载的方式有哪些
设置var xhr = new XMLHttpRequest();xhr.open(“get”, “file1.js”, true);xhr.onreadystatechange = function(){if (xhr.readyState == 4){if (xhr.status >= 200 && xhr.status < 300 || xhr.status == 304){var script = document.createElement (“sc
2020-09-08 08:27:42
97
原创 eval是做什么的
它的功能是把对应的字符串解析成JS代码并运行应该避免使用eval，不安全，非常耗性能（2次，一次解析成js语句，一次执行）由JSON字符串转换为JSON对象的时候可以用eval，var obj =eval(’(’+ str +’)’)...
2020-09-07 21:54:30
112
原创 JavaScript有几种类型的值
栈：原始数据类型（Undefined，Null，Boolean，Number、String）堆：引用数据类型（对象、数组和函数）两种类型的区别是：存储位置不同；原始数据类型直接存储在栈(stack)中的简单数据段，占据空间小、大小固定，属于被频繁使用数据，所以放入栈中存储；引用数据类型存储在堆(heap)中的对象,占据空间大、大小不固定,如果存储在栈中，将会影响程序运行的性能；引用数据类型在栈中存储了指针，该指针指向堆中该实体的起始地址。当解释器寻找引用值时，会首先检索其在栈中的地址，取得地址后从
2020-09-07 21:53:26
100
原创 说说你对promise的了解
依照 Promise/A+ 的定义，Promise 有四种状态：pending: 初始状态, 非 fulfilled 或 rejected.fulfilled: 成功的操作.rejected: 失败的操作.settled: Promise已被fulfilled或rejected，且不是pending另外， fulfilled与 rejected一起合称 settledPromise 对象用来进行延迟(deferred) 和异步(asynchronous) 计算Promise 的构造函数构造一
2020-09-07 21:39:11
196
原创 常见兼容性问题？
png24位的图片在iE6浏览器上出现背景，解决方案是做成PNG8浏览器默认的margin和padding不同。解决方案是加一个全局的*{margin:0;padding:0;}来统一,，但是全局效率很低，一般是如下这样解决：body,ul,li,ol,dl,dt,dd,form,input,h1,h2,h3,h4,h5,h6,p{margin:0;padding:0;}IE下,event对象有x,y属性,但是没有pageX,pageY属性Firefox下,event对象有pageX,pag
2020-09-07 21:35:04
92
原创 javascript有哪些方法定义对象
对象字面量： var obj = {};构造函数： var obj = new Object();Object.create(): var obj = Object.create(Object.prototype);Object.create()方法创建一个新对象，使用现有的对象来提供新创建的对象的__proto__。可以使用该方法实现继承// 子类续承父类Rectangle.prototype = Object.create(Shape.prototype);Rectangle.prot
2020-09-07 21:32:00
126
原创 offsetWidth/offsetHeight,clientWidth/clientHeight与scrollWidth/scrollHeight的区别
offsetWidth/offsetHeight返回值包含content + padding + border，效果与e.getBoundingClientRect()相同clientWidth/clientHeight返回值只包含content + padding，如果有滚动条，也不包含滚动条scrollWidth/scrollHeight返回值包含content + padding + 溢出内容的尺寸...
2020-09-07 21:28:26
113
原创 常见web安全及防护原理
sql注入原理就是通过把SQL命令插入到Web表单递交或输入域名或页面请求的查询字符串，最终达到欺骗服务器执行恶意的SQL命令总的来说有以下几点永远不要信任用户的输入，要对用户的输入进行校验，可以通过正则表达式，或限制长度，对单引号和双"-"进行转换等永远不要使用动态拼装SQL，可以使用参数化的SQL或者直接使用存储过程进行数据查询存取永远不要使用管理员权限的数据库连接，为每个应用使用单独的权限有限的数据库连接不要把机密信息明文存放，请加密或者hash掉密码和敏感的信息XSS原理及防范Xss
2020-09-07 08:45:07
314
原创 说说你对AMD和Commonjs的理解
CommonJS是服务器端模块的规范，Node.js采用了这个规范。CommonJS规范加载模块是同步的，也就是说，只有加载完成，才能执行后面的操作。AMD规范则是非同步加载模块，允许指定回调函数AMD推荐的风格通过返回一个对象做为模块对象，CommonJS的风格通过对module.exports或exports的属性赋值来达到暴露模块对象的目的...
2020-09-07 08:25:01
160
原创 XML和JSON的区别？
数据体积方面JSON相对于XML来讲，数据的体积小，传递的速度更快些。数据交互方面JSON与JavaScript的交互更加方便，更容易解析处理，更好的数据交互数据描述方面JSON对数据的描述性比XML较差传输速度方面JSON的速度要远远快于XML...
2020-09-05 09:52:57
84
原创 那些操作会造成内存泄漏？
JavaScript 内存泄露指对象在不需要使用它时仍然存在，导致占用的内存不能使用或回收未使用 var 声明的全局变量闭包函数(Closures)循环引用(两个对象相互引用)控制台日志(console.log)移除存在绑定事件的DOM元素(IE)setTimeout 的第一个参数使用字符串而非函数的话，会引发内存泄漏垃圾回收机制各大浏览器通常采用的垃圾回收有两种方法：标记清除、引用计数标记清除当变量进入执行环境时，将这个变量标记为“进入环境”。当变量离开执行环境时，则将其标记为“离开环
2020-09-05 09:34:47
270
原创 跨域问题的解决方案
首先了解下浏览器的同源策略 同源策略/SOP（Same origin policy）是一种约定，由Netscape公司1995年引入浏览器，它是浏览器最核心也最基本的安全功能，如果缺少了同源策略，浏览器很容易受到XSS、CSFR等攻击。所谓同源是指"协议+域名+端口"三者相同，三者有一个不相同那么便非同源跨域问题解决方式1.第一种：通过服务端代理请求。如PHP，服务端语言php是没有跨域限制的。让服务器去别的网站获取内容然后返回页面。第二种：jsonp跨域jsonp跨域就是利用scr
2020-09-05 08:27:15
76
原创 Ajax原理
Ajax的原理简单来说是在用户和服务器之间加了—个中间层(AJAX引擎)，通过XmlHttpRequest对象来向服务器发异步请求，从服务器获得数据，然后用javascript来操作DOM而更新页面。使用户操作与服务器响应异步化。这其中最关键的一步就是从服务器获得请求数据Ajax的过程只涉及JavaScript、XMLHttpRequest和DOM。XMLHttpRequest是ajax的核心机制var xhr = null;xhr = new XMLHttpRequest()/** 2. 连接服务
2020-09-04 10:05:30
73
原创 new操作符具体干了什么呢?
var obj = new Base();具体执行过程如下：var obj = {};obj.proto = Base.prototype;Base.call(obj);第一行，我们创建了一个空对象obj第二行，我们将这个空对象的__proto__成员指向了Base函数对象prototype成员对象第三行，我们将Base函数对象的this指针替换成obj，然后再调用Base函数，于是我们就给obj对象赋值了一个id成员变量，这个成员变量的值是”base”...
2020-09-04 09:51:27
93
原创 事件模型
W3C中定义事件的发生经历三个阶段：捕获阶段（capturing）、目标阶段（targetin）、冒泡阶段（bubbling）冒泡型事件：当你使用事件冒泡时，子级元素先触发，父级元素后触发捕获型事件：当你使用事件捕获时，父级元素先触发，子级元素后触发DOM事件流：同时支持两种事件模型：捕获型事件和冒泡型事件阻止冒泡：在W3c中，使用stopPropagation()方法；在IE下设置cancelBubble = true阻止捕获：阻止事件的默认行为，例如click - 后的跳转。在W3c中，使用p
2020-09-04 09:26:24
87
原创 谈谈This对象的理解
this总是指向函数的直接调用者（而非间接调用者）如果有new关键字，this指向new出来的那个对象在事件中，this指向触发这个事件的对象，特殊的是，IE中的attachEvent中的this总是指向全局对象Windowthis是函数运行时自动生成的一个内部对象，只能在函数内部使用，但总指向调用它的对象。通过以下几个例子加深对this的理解。（1）作为函数调用var name = 'Jenny';function person() { return this.name;}con
2020-09-04 09:02:56
1160
原创 Javascript如何实现继承？
构造继承function SuperType() { this.colors = ['red', 'green', 'blue']}function ChildType() { SuperType.call(this);}let instance1 = new ChildType();instance1.colors.push('yellow');console.log(instance1.colors); // ["red", "green", "blue", "yellow"
2020-09-04 08:49:30
89
原创 json_encode的数据格式化的两种格式[]和{}
如果array是一个下标从0开始的连续数组，json_encode的结果是一个用[]包裹的字符串 $arr6 = array('11','22','33'); echo('<pre>'); echo json_encode($arr6);//["11","22","33"]如果array不是从0开始，或者不是连续的数组，那么返回的是{}包裹的keyvalue字符串 $arr6 = array('11','22','33'); $arr6[6] = '.
2020-07-28 19:39:08
597
原创 区别重绘和重排
当Dom的变化影响到了元素的几何属性（宽和高等）——比如说修改了边框的宽度，或者是修改了高度，又或者给文章增加了内容导致元素的高度增加等，会引起浏览器进行重新计算元素的几何属性，同样，其他元素的几何属性和位置也会因此受到影响。浏览器会使渲染树中受到影响的部分失效。并重新构建渲染树，这个过程称为重排。 完成重排之后，浏览器会重新绘制受影响的元素，这个过程被称为重绘。 并不是所有的Dom变化会影响元素的几何属性，例如，改变背景色，不会影响元素的几何属性，因此，这个时候是不会发生重排，仅仅会发生重绘，因为，.
2020-07-28 19:23:17
335
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人