手撕代码
手撕代码
Doe
这个作者很懒,什么都没留下…
展开
-
鼠标点击dom获取的e的坐标
一、clientX、clientY点击位置距离当前body可视区域的x,y坐标二、pageX、pageY对于整个页面来说,包括了被卷去的body部分的长度三、screenX、screenY点击位置距离当前电脑屏幕的x,y坐标四、offsetX、offsetY相对于带有定位的父盒子的x,y坐标五、x、y和screenX、screenY一样六、面试题:实现页面上拖拽div container的效果<head> <meta charset=.原创 2022-02-26 08:54:23 · 349 阅读 · 0 评论 -
实现一个双向绑定
defineProperty 版本// 数据const data = { text: 'default'};const input = document.getElementById('input');const span = document.getElementById('span');// 数据劫持Object.defineProperty(data, 'text', { // 数据变化 --> 修改视图 set(newVal) { input.value原创 2022-02-16 19:40:34 · 344 阅读 · 0 评论 -
实现一个JS函数柯里化
function curry(fn, args) { var length = fn.length; var args = args || []; return function(){ newArgs = args.concat(Array.prototype.slice.call(arguments)); if (newArgs.length < length) { return curry.call(this,fn,.原创 2022-02-16 19:33:24 · 351 阅读 · 0 评论 -
拓扑排序JS实现
1 定义在一个表示工程的有向图中,用顶点表示活动,用弧表示活动之间的优先关系,这样的有向图为顶点表示活动的网,称为AOV网(Activity On Vertex Network)设G={V,E}是一个具有n个顶点的有向图,V中的顶点序列v1、v2… 满足若从顶点vi到vj有一条路径,则在顶点序列中顶点vi必须在顶点vj之前,则称这样的顶点序列为一个拓扑序列拓扑排序就是对一个有向图构造拓扑序列的过程,构造时会有两个结果,如果此网的全部顶点都被输出,则说明它是不存在环(回路)的AOV网;如果输出顶原创 2022-02-11 16:19:13 · 617 阅读 · 0 评论 -
手写 forEach
Array.prototype.forEach = function(fn, thisArg) { var _this; if (typeof fn !== "function") { throw "参数必须为函数"; } if (arguments.length > 1) { _this = thisArg; } if (!Array.isArray(arr)) { throw .原创 2021-11-26 20:53:25 · 482 阅读 · 0 评论 -
js 手写 map 函数
map()函数理解map函数是Array对象的一个方法,它可以返回一个新数组,不修改原来的数组。array.map((item,index,arr)=>{})map回调函数的三个参数,item是必须的,代表数组的每个元素,index可选,元素的下标值,arr可选,代表元素所属于的数组对象。每个元素都要执行回调函数的内容,返回一个新的数组。比如:var array=[1,2,3]var new_array=array.map((item,index)=>{转载 2021-11-26 17:16:37 · 360 阅读 · 0 评论 -
手写filter
Array.prototype.filter = function(fn, thisArg) { var _this; if (typeof fn !== "function") { throw "参数必须为函数"; } //get array going to be iterated let arr = this; if (!Array.isArray(arr)) { throw "只能对数组使用forEach方法"; } if (arguments..转载 2021-11-26 17:04:39 · 84 阅读 · 0 评论 -
JS中类数组转换为数组
1. Array.from()是ES6中的方法,用于将类数组转换为数组。let arrayLike = { '0': 'a', '1': 'b', '2': 'c', length: 3};// ES5的写法var arr1 = [].slice.call(arrayLike); // ['a', 'b', 'c']// ES6的写法let arr2 = Array.from(arrayLike); // ['a', 'b', 'c']2、如果原创 2021-11-26 16:31:17 · 939 阅读 · 0 评论 -
add(1,2,3)(1)(2)(3)(4,5,6)(7,8)() === 42
. 函数curry化的实现:console.log(add(1, 2, 3)(1)(2)(3)(4, 5, 6)(7, 8)());//42 function add() { // 思路:当传递参数的时候,开始计算;没有参数的时候,返回计算结果 let _list = []; _list = _list.concat([].slice.call(arguments)) return function () { let args = [].slice.c.原创 2021-11-25 22:13:29 · 273 阅读 · 0 评论 -
手写bind、apply和call
apply这里的obj.fn是存储this的,因为比如func.myApply(xxx)里面this就指向func把函数存起来,作为obj的一个属性,这样函数里的this当你通过obj.fn调用时,就指向了obj Function.prototype.myApply = function(obj, args) { obj.fn = this; let res; if (args && args.length) { res转载 2021-11-17 22:20:14 · 61 阅读 · 0 评论 -
js数组扁平化
1、手写flat function flatten(arr) { let ans = []; for (let item of arr) { if (Array.isArray(item)) { ans = ans.concat(flatten(item)); } else { ans = ans.concat(item); } } return ans; } console.log(fla.原创 2021-11-17 19:49:18 · 67 阅读 · 0 评论 -
js手写浅深拷贝
浅拷贝:function shallowCopy(obj) { let cloneObj = {}; for (let i in obj) { cloneObj[i] = obj[i]; } return cloneObj;}深拷贝:function deepCopy(obj) { let cloneObj; if (typeof obj === "object") { cloneObj = obj.constructor === Array ? [原创 2021-11-17 17:08:54 · 73 阅读 · 0 评论 -
JavaScript手写new方法
正常使用的new方法function father(name){ this.name=name; this.sayname=function(){ console.log(this.name) }}var son=new father('kimi')dog.sayname();手写一个new方法function father(name){ this.name=name; this.sayname=function(){转载 2021-11-17 16:27:15 · 161 阅读 · 0 评论 -
手写一个定时器
每隔一段时间wait执行一个函数 执行一定次数times次<script> function repeat(fun, times, wait) { return function (content) { let count = 0; let interval = setInterval(() => { count = count + 1; fun(content); if (count === tim原创 2021-11-17 15:45:20 · 188 阅读 · 0 评论 -
鼠标点击获取ul中li中的文字
一般方法<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title.原创 2021-11-17 09:46:24 · 355 阅读 · 0 评论 -
手写js的instanceof
function Instanceof(obj, pro) { obj = obj.__proto__; pro = pro.prototype; while (obj) { if (obj === pro) return true; obj = obj.__proto__; } return false;}console.log(Instanceof([], Function));原文:手写js的instanceof方法_GC.的博客-CSDN博客..转载 2021-11-16 22:09:48 · 56 阅读 · 0 评论 -
数组去重的方法
1、filterfunction unique(arr){ return arr.filter(function(item,index,arr){ return arr.indexOf(item, 0) === index; })}2、ES6 Setfunction unique (arr) { return Array.from(new Set(arr))}3、lastIndexOffunction unique(arr) { .原创 2021-11-16 16:59:35 · 57 阅读 · 0 评论 -
防抖和节流
防抖(不传参)let input = document.getElementById('input');let content = document.getElementById('content');//将this绑定到input上,并传递参数input.onkeyup = debounce(show, 1000).bind(input);function show() { content.innerHTML += this.value + '<br/>';}f原创 2021-11-10 17:25:46 · 63 阅读 · 0 评论