随笔分类 -  手写题

手写instanceof
摘要：function instanceOf(left,right) { let proto = left.__proto__; let prototype = right.prototype while(true) { if(proto null) return false if(proto proto 阅读全文
posted @ 2020-12-28 16:45 `Duet` 阅读(84) 评论(0) 推荐(0)
手写promise
摘要：function myPromise(constructor){ let self=this; self.status="pending" //定义状态改变前的初始状态 self.value=undefined;//定义状态为resolved的时候的状态 self.reason=undefined; 阅读全文
posted @ 2020-12-27 18:51 `Duet` 阅读(93) 评论(0) 推荐(0)
手写apply、call、bind
摘要：apply Function.prototype.myApply = function(context){ context = context || window context.fn = this var res if(arguments[1]){ res = context.fn(...argu 阅读全文
posted @ 2020-12-27 14:25 `Duet` 阅读(108) 评论(0) 推荐(0)
手写new实现
摘要：new的原理 1.创建一个空对象 2.将新对象的__proto__指向构造函数的prototype对象 3.this指向新对象，给新对象添加属性 4.返回新对象 function newFn(fn,...args){ let obj = {} obj.__proto__ = fn.prototype 阅读全文
posted @ 2020-12-24 20:21 `Duet` 阅读(101) 评论(0) 推荐(0)
手写节流throttle
摘要：节流 throttle（一段时间内只执行一次handle函数） const div1 = document.getElementById('div1') let timer = null div1.addEventListener('drag',function (e) { if (timer){ 阅读全文
posted @ 2020-12-24 17:28 `Duet` 阅读(121) 评论(0) 推荐(0)
手写防抖debounce
摘要：防抖 debounce (一段时间不触发事件才执行一次handle函数) const input1 = document.getElementById('input1') let timer = null input1.addEventListener('keyup',function () { i 阅读全文
posted @ 2020-12-24 15:58 `Duet` 阅读(189) 评论(0) 推荐(0)
手写深拷贝
摘要：function deepClone(obj={}) { if(typeof obj !== 'object' || obj == null){ // obj 是null，或者不是对象和数组，直接返回 return obj } //初始化返回结果 let result if (obj instanc 阅读全文
posted @ 2020-12-23 17:41 `Duet` 阅读(95) 评论(0) 推荐(0)
数组扁平化
摘要：function flatten(arr){ let res = []; arr.map((item)=>{ if(Array.isArray(item)){ res = res.concat(flatten(item)); }else{ res.push(item); } }); return r 阅读全文
posted @ 2020-12-23 17:04 `Duet` 阅读(95) 评论(0) 推荐(0)
数组去重
摘要：const arr = [1,2,1,2,3,4,1,5,1,2,6] //方法一 const arr1 = [...new Set(arr)] //方法二 const arr2 = Array.from(new Set(arr)) //方法三 function noDup1(arr){ let r 阅读全文
posted @ 2020-12-23 12:35 `Duet` 阅读(50) 评论(0) 推荐(0)
JSONP 跨域请求
摘要：<script> let temp = document.createElement("script"); temp.type = "text/javascript"; const callback = function(res){ alert(res); } temp.src = "http:// 阅读全文
posted @ 2020-12-22 20:32 `Duet` 阅读(57) 评论(0) 推荐(0)
原生AJAX
摘要：function ajaxRequest(method, data, withCookie){ let xhr = new XMLHttpRequest(); if(withCookie true){ //允许发送Cookie xhr.withCredentials = true; } let re 阅读全文
posted @ 2020-12-22 18:10 `Duet` 阅读(82) 评论(0) 推荐(0)
手写数组排序
摘要：//冒泡排序 function bubble(arr){ var i,j var len = arr.length for(i=0; i<len; i++){ for(j=0; j<len-i-1; j++){ if(arr[j]>arr[j+1]){ let temp = arr[j] arr[j 阅读全文
posted @ 2020-12-21 20:58 `Duet` 阅读(206) 评论(0) 推荐(0)
手动封装事件订阅
摘要：const eventList = {} const $on = (eventName,callback) => { if(!eventList[eventName]){ eventList[eventName] = [] } eventList[eventName].push(callback) 阅读全文
posted @ 2020-12-20 20:19 `Duet` 阅读(79) 评论(0) 推荐(0)
模拟Vue双向数据绑定原理
摘要：数据变页面变 1.数据变页面一定变吗？什么情况下不会变？怎么解决问题 参考{ 对象 动态添加一个属性 添加的属性没有getter和setter 数组 动态修改数组的length相关 数据的修改也不会引起页面的变化 （原因：没有getter和setter） 在生命周期的创建阶段 vue会用object 阅读全文
posted @ 2020-12-20 20:01 `Duet` 阅读(103) 评论(0) 推荐(0)