自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

Yes博客

code

  • 博客(16)
  • 收藏
  • 关注

原创 解析浏览器缓存——强制缓存与协商缓存

浏览器缓存其实就是浏览器保存通过HTTP获取的所有资源,是浏览器将网络资源存储在本地的一种行为。哪些资源可以被缓存?——一些静态资源(JS CSS img图片)# 强制缓存# 协商缓存# 总结http缓存——强制缓存Cache-Control存放在Response Header中 控制强制缓存的逻辑 例如:Cache-Control: max-age=31536000(单位是秒)浏览器第一次向服务器发起请求,服务器200返回资源和Cache-Control当浏.

2021-05-25 23:01:06 268 1

原创 手写Ajax

手写Ajax//ajax的get请求const xhr = new XMLHttpRequest()//true是异步xhr.open('GET', '/data/test.json', true)xhr.onreadystatechange = function () { if (xhr.readyState === 4) { if (xhr.status === 200) { // console.log( //

2021-03-27 17:35:53 84

原创 异步经典面试题

异步经典面试题async function async1 () { console.log('async1 start') //2 await async2() // 这一句会同步执行,返回 Promise ,其中的 `console.log('async2')` 也会同步执行 // 上面有 await ,下面就变成了“异步”,类似 cakkback 的功能(微任务) console.log('async1 end') //6}async function async2

2021-03-27 14:59:07 342

原创 Promise的async/await

Promise的async/awaitasync/await以同步的语法来编写异步代码,彻底消灭啦回调函数function loadImg(src) { const promise = new Promise((resolve, reject) => { const img = document.createElement('img') img.onload = () => { resolve(img)

2021-03-27 14:43:48 141

原创 Promise三种状态

Promise三种状态// 刚定义时,状态默认为 pendingconst p1 = new Promise((resolve, reject) => {})// 执⾏ resolve() 后,状态变成 resolvedconst p2 = new Promise((resolve, reject) => { setTimeout(() => { resolve() })})// 执⾏ reject() 后,状态变成 rejectedconst p3 = ne

2021-03-27 14:25:45 3395

原创 event loop(事件循环/事件轮询)

event loop(事件循环/事件轮询)

2021-03-27 14:07:21 157

原创 手写Promise加载一张图片

手写Promise加载一张图片function loadImg(src) { const p = new Promise( (resolve, reject) => { const img = document.createElement('img') img.onload = () => { resolve(img) } img.oner

2021-03-27 13:59:31 128

原创 实际开发中闭包的应用场景

实际开发中闭包的应用场景隐藏数据// 闭包隐藏数据,只提供 APIfunction createCache() { const data = {} // 闭包中的数据,被隐藏,不被外界访问 return { set: function (key, val) { data[key] = val }, get: function (key) { return data[key]

2021-03-27 13:36:44 367 1

原创 手写bind函数

手写bind函数// 模拟 bindFunction.prototype.bind1 = function () { // 将参数拆解为数组(列表->数组) const args = Array.prototype.slice.call(arguments) // 获取 this(数组第一项) const t = args.shift() // fn1.bind(...) 中的 fn1 const self = this // 返回

2021-03-27 13:31:47 63

原创 关于this的取值

this的取值问题this取什么值是在函数执行的时候确认,不是在函数定义的时候确认!!!1.作为普通函数 = this指向window 2.使用call,apply,bind = this指向绑定的对象 3.作为对象方法 = this指向当前对象 4.在class方法中调用 = this指向实例对象 5.箭头函数 = this指向当前对象,没有对象就是上一级作用域...

2021-03-26 16:30:30 95

原创 闭包问题

闭包产生在作用域应用时的两种情况:函数作为参数被传递 函数作为返回值被返回//函数作为返回值function create() { const a = 100 return function () { console.log(a) }}const fn = create()const a = 200fn() // 100// 函数作为参数被传递function print(fn) { const a = 200 fn()

2021-03-26 16:20:00 57

原创 手写简易jquery,考虑插件和拓展性

手写简易jqueryclass jQuery { constructor(selector) { const result = document.querySelectorAll(selector) const length = result.length for (let i = 0; i < length; i++) { this[i] = result[i] } this.len

2021-03-26 16:09:10 72

原创 深拷贝

深拷贝/** * 深拷贝 * @param {Object} obj 要拷贝的对象 */function deepClone(obj = {}) { if (typeof obj !== 'object' || obj == null) { // obj 是 null ,或者不是对象和数组,直接返回 return obj; } // 初始化返回结果 let result; if (obj instanceof Array

2021-03-26 14:57:01 54

原创 HTML块状元素&内联元素

HTML块状元素&内联元素?display: block/table;div h1 h2 ... table ul ol pdisplay: inline/inline-block;span img input button

2021-03-22 14:14:15 113

原创 HTML语义化

HTML语义化让人更容易读懂,增加代码可读性; 让搜索引擎更容易读懂(SEO);

2021-03-22 14:05:52 45

原创 CSS清除浮动

CSS清除浮动.clearfix:after { content: ' '; display: table; clear: both;}.clearfix { /*兼容IE低版本*/ *zoom: 1;}清除footer的浮动,对container用clearfix

2021-03-22 13:57:53 57

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除