- 博客(20)
- 收藏
- 关注
RSS订阅原创 题目：产生10个随机数[1,2,3,4, 10, 11, 4, 20],结果[[1,2,3,4], [10,11],[20]]
// start 开始值 end 结束值 （区间） length 随机个数Array.prototype.random = (start, end, length) => { let i = 0 const results = [] while(i < length) { const random = ~~(Math.random() * end) + 1 rando...
2019-10-18 11:37:22
296
原创 Promise all race finally实现
Promise.allPromise.all = function (args) { const results = [] return new Promise((resolve, reject) => { const next = () => { args.shift().then(val => { ...
2019-10-18 10:46:55
352
原创 设计 LazyMan 类
实现以下功能:LazyMan('Tony');// Hi I am TonyLazyMan('Tony').sleep(10).eat('lunch');// Hi I am Tony// 等待了10秒...// I am eating lunchLazyMan('Tony').eat('lunch').sleep(10).eat('dinner');// Hi I am To...
2019-10-17 15:52:56
328
原创 类数组和数组
Arraylike类数组有着数组一样的数据，但是没有数组的实力方法，并且是一个Object。// 一个伪数组var a = { 0: 1, 1: 2, length: 2}// 题目var a = { 2: 3, 3: 4, length: 2, push: Array.prototype.push, splice: Array.prototype.splice}a...
2019-10-16 18:53:33
129
原创 隐式转换
隐式转换：转成string格式 ：（+字符串连接符）转成number格式：关系运算符转成boolean： !当存在字符串的时候，‘+’为字符串连接符，‘1’+true // 1true当不存在字符串而是数字和其他类型，此时的‘+’为运算符1 + ...
2019-10-11 20:24:00
153
原创 IIFE非匿名函数
var b = 10;(function b() { b = 20; console.log(b)})()// 打印// ƒ b() {// b = 20;// console.log(b)// }声明提前：一个声明在函数体内都是可见的，函数声明优先于变量声明；function b () {} 声明优先于 b = 10在非匿名自执行函数中，函数变量为只读状态...
2019-10-11 16:32:35
389
1
原创 题目：改造代码，打印0-9
for (var i = 0; i< 10; i++){ setTimeout(() => { console.log(i); }, 1000)}// 10原因：作用域，for循环中头部使用var 定义变量i 时，它和循环体中的i 的作用域不是同级作用域，因此当for循环执行完毕后，并不会给每个循环都储存相对应的i的值。块级作用域letf...
2019-10-11 16:15:22
205
原创 算法:把俩个数组 [A1, A2, B1, B2, C1, C2] 和 [A, B, C]，合并 [A1, A2, A, B1, B2, B, C1, C2, C]
Array.prototype.reduce是个计算的好手:考虑两个数组的相似点都有相同是字母开头，可以用双重遍历正则匹配插入也可以用startsWith判断首字母；const arr1 = ["A1", "A2", "B1", "B2", "C1", "C2"]const arr2 = ["A", "B", "C"]arr1.reduce((new, cur) => [...new...
2019-10-11 15:49:07
773
原创 实现一个new
new的作用是将一个构造函数实例化简单的过程分为：创建一个新对象将新对象的__proto__指向构造函数的prototype将构造函数的this指向该对象返回新对象简单的实现：function _new (fn, ...args) { const o = {} o.__proto__ = fn.prototype fn.apply(o, args) return o}...
2019-10-10 11:25:51
155
原创 谈谈setTimeout、Promise、Async/Await 的区别
首先我们谈谈Event Loop：setTimeout是一个macro任务promise、和await后续为micro任务所以在执行顺序上会先进行同步代码，再者Promise、Async/Await，最好setTimeout。谈谈Promise、Async/Await差异promise是resolve为异步方法，将放入微任务队里里执行，但是resolve前后的正常代码为同步代码；...
2019-10-10 10:59:14
1139
原创 前端安全：几种攻击模式
1.XSS攻击主要是注入js代码，通过将js代码存入数据库或者通过修改 URL 参数的方式加入攻击代码，诱导用户访问链接从而进行攻击。防御措施：对字符串进行转义 通常来说主要针对script标签进行转义function escape(str) { str = str.replace(/&/g, '&'); str = str.replace(...
2019-10-10 10:05:54
487
原创 虚拟dom的实现和diff算法
现在主流框架都采用虚拟dom，为什么？就是快，一个真实dom的生成代价很昂贵，不过js的运行速度很快，这样我们通过对js的虚拟dom树操作，通过Diff算法来对真实dom做出相应的操作，效率事倍功半。首先看看一个虚拟dom的结构，其实就是一个js的对象，里面包含了各种需要实现的属性： const ul = { tagName: 'ul', props: { id: 'list...
2019-09-30 14:10:33
265
原创 Proxy观察者模式以及Object.defineProperty的缺点
Proxy实现观察者模式（vue3.0）vue3.0之前通过Object.defineProperty数据劫持来实现数据监听，vue3.0即将引入Proxy来实现。 //添加观察者 const queuedObservers = new Set(); const observe = fn => queuedObservers.add(fn); //创建prox...
2019-09-29 22:32:30
1187
原创 深度优先遍历DFS和广度优先遍历BFS
深度优先遍历：竖向优先遍历const data = [ { name: 'a', children: [ { name: 'b', children: [{ name: 'e' }] }, { name: 'c', children: [{ name: 'f' }] }, { nam...
2019-09-29 22:25:31
405
原创 ES6 Set Map WeakSet WeakMap区别
Set成员的值都是唯一的，没有重复的值。（如果成员是引用类型，区分唯一性通过内存地址）WeakSet与Set的区别：成员必须为对象；const a = new WeakSet()a.add(target) // target为对象WeakSet是弱引用，垃圾回收机制不考虑 WeakSet 对该对象的引用；这边讲讲垃圾回收的机制：标记清楚和引用计数。对对象的回收是通过引用计数，We...
2019-09-29 15:06:21
385
原创 for循环和forEach的速度问题
for循环是比较古老的循环方式，不少人对他的写法已经觉得厌烦，随着js的发展越来越多的遍历方式逐一诞生：forEach, map, filter，every，some，for of等等，简洁的语法让人赏心悦目。forEach代码实现： if (!Array.prototype.forEach){ Array.prototype.forEach = function(fun /*, th...
2019-09-25 11:33:56
1370
原创 谈谈箭头函数和function的区别
箭头函数和function的区别作用域：箭头函数指向其定义环境，this的指向无法通过其他方式改变；function指向其直接调用者，一般来说最通常的是window对象，对象属性则指向改对象；构造函数：箭头函数不能当做构造函数参数问题：箭头函数不存在arguments对象，用rest参数代替；原型问题：箭头函数不存在原型；箭头函数不能使用yield命令，因此箭头函数不能用作gene...
2019-09-25 09:57:16
885
原创 简单谈谈parseInt
最近面试高发题[1, 2, 3].map(parseInt) 结果和原因？结果：[1, NaN, NaN]原因： [1, 2, 3].map(parseInt) 完整形式 => [1, 2, 3].map((val, k) => parseInt(val, k))看看 parseInt的参数 第二个是进制数（默认为10），范围在2-36，当k不在这个范围,则返回NaN...
2019-09-24 18:20:30
1053
原创 谈谈防抖和节流
防抖高频触发事件，在规定时间内（比如5s）仅执行一次，该时间内再次触发重新计时，可以理解为触发一次事件的时间：time >= 5s;// 高频事件 常见的dom的事件const timer = nullconst scrollAction = () => { clearTimeout(timer) timer = setTimeout(() => { // ......
2019-09-24 16:59:37
151
原创 了解es6的flat和Set
数组去重我们一般大脑最先想到的就是遍历操作，es6可以通过Set进行去重，但是new Set的原型是Set，不是Array，必然需要进行转换；转换的方式很多，比如：1、Array.from()2、拓展运算符…针对多维数组我们转成一位数组并去重，es6的Array.prototype.flat，其实际原理使用了递归操作。创建一个新数组，其中所有子数组元素都以递归方式连接到该数组中，直到达到指...
2019-09-24 14:23:48
348
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人