Stavin Li的博客

容器属性：flex-direction 主轴方向flex-wrap 是否换行 默认rowflex-flow direction 和 wrap 的简写 justify-content 项目在主轴上对齐方式align-items 项目在交叉轴上对其方式align-content 定义多根轴线的对齐方式项目属性：1.order 排列顺序2.flex-grow3.flex-shrink4.flex-basis5.align-selfflex-grow 计算方式父元素宽度 500px，

//改造前：axios(url).then().catch().finally()//改造后：let data = function(){}let error= function(){}let end= function(){}try{ let ans = await axios(url) data()}catch(e){ error(e)}end()

1.抽牌算法function foo(data){ let list = [] while(data.length>0){ let index = Math.floor(Math.random()*data.length) let ans = data.splice(index,1) list.push(...ans) } return list}2.洗牌算法function foo(data){ let list = [].concat(data)

题干：A1，B1为矩形rect1 任意对角线上的两点A2，B2为矩形rect2 任意对角线上的两点求两个矩形的重叠面积解题思路大值取小，小值取大右边minX-左边maxX就是宽,然后乘以上边minY - 下边maxY代码如下function getArea(A1,B1,A2,B2){ let rectInfo1 = getRectInfo(A1,B1) let rectInfo2 = getRectInfo(A2,B2) let maxX = Math.min(rectI

ES5 的继承实质是先创造子类的实例对象this，然后再将父类的方法添加到this上面（Parent.apply(this)）。ES6 的继承实质是先将父类实例对象的属性和方法，加到this上面（所以必须先调用super方法），然后再用子类的构造函数修改this。...

一.设计模式1.单例模式保证一个类仅有一个实例，并提供一个访问它的全局访问点。x.getInstance = (function(){ let instance = null return function(name){ if(!instance){ instance = new X(name) } return instance }})()2.策略模式定义一系列的算法，把它们一个个封装起来，并且使他们可以相互替换，如表单校验var strategies =

Write an algorithm to determine if a number is “happy”.A happy number is a number defined by the following process: Starting with any positive integer, replace the number by the sum of the squares of its digits, and repeat the process until the number eq.

只要存在循环引用 JSON.stringify 一定会报错function isLoop(obj){ let flag = false function check(obj, pObj){ let pObj = pObj || [obj] for(let key in obj){ if(typeof obj[key] === 'object'){ pObj.forEach(item=>{ if(item === obj[key]){ obj[k.

const tree = [ {id: -1,parentId: null}, {id: 0,parentId: -1}, {id: 1,parentId: -1}, {id: 2,parentId: -1}, {id: 3, parentId: 2}, {id: 4, parentId: 3},]转化为[{"id":-1,"children":[{"id":0},{"id":1},{"id":2,"children":[{"id":3,"children":[{"id":4}

浅拷贝：只复制指向某个对象的指针，而不复制对象本身，新旧对象还是共享同一块内存Object.assign()扩展运算符...深拷贝：新旧对象不共享内存，修改新对象不会改到旧对象。JSON.parse(JSON.stringify()) 缺点 a.循环引用报错 b.不能拷贝function等第三方库lodash手写递归function deepClone(target, map = new Map()){ if(typeof target === 'object' &&

含义：把接受多个参数的函数变换成接受一个单一参数(最初函数的第一个参数)的函数，并且返回接受余下的参数且返回结果的新函数的技术。作用：惰性求值实例：add(1,2,3)=>add(1)(2)(3)function curry(fn, args = []){ let len = fn.length return function(...cargs){ args.push(...cargs) if(args.length < len){ return curr

/**有一组 url 的数组：array = [url1, url2…]*一个拉取url的fetch方法，返回promise：fetch(url).then();实现execute方法，同时最多只能有 limit 个 fetch 可以同时执行。*并且下载的尽可能快，在1个fetch 下载完成后就马上开始下一个待下载的url。*/function execute(urls, limit){}...

前端无法运用加减乘除，大小于，所有计算通过后端，实现add()function addRemote(a,b){ return new Promise((resolve)=>{ setTimeout(()=>{ resolve(a+b) }) })}function add(data){ //此处书写 if(data.length === 1){ return data[0] } let list = [] let other

实现以下的add()的方法output()时打印前面的参数之)add(1,2).add(3).add(4).output()let list = []function add(...args){ list.push(...args) return list}Array.prototype.add = function(...args){ this.push(...args) return this}Array.prototype.output = function(){ retu

公式适用于svg，坐标原点在左上角1. 两点之间距离计算勾股定理function radius(a, b, c, d) { //(a,b)(c,d) var row = Math.pow(a - c, 2) var col = Math.pow(b - d, 2) return Math.sqrt(row + col)}2. 两点之间角度计算三角函数 atanfunction angle(a, b, c, d) { var diff_x = a - c;

旧异步函数function foo(url,cb){ }实现效果let foo2 = bar(foo)foo2(url).then(res=>{})求解函数bar (面试官应该是想要这个结果????吧)function bar(fn){ return function(url,cb){ return new Promise((resolve)=>{ fn(url,(res)=>{ resolve(res) }) }) }}

任务调度器class TaskManager{ list = []; count= 0; constructor(num){ this.num = num } async addTask(fn){ this.count>=this.num?await new Promise(resolve=>{this.list.push(resolve)}):"" this.count++ var result = await fn() this.count-- if(th

实现man.addSleep(1000).eatFood(‘haobao’).addSleep(1000).eatFood(‘gg’)class LazyMan{ constructor(){ this.promise = Promise.resolve() } addSleep(time){ this.promise = this.promise.then(()=>{ return new Promise(resolve=>{ setTimeout(()=&g.

// class TaskManager {// addTask: ( fn: () => Promise<T> ) => Promise<T>// }// 任务调度类，实例化后可以通过 taskManager.addTask添加任务，添加的任务可以通过.then拿到结果// 同时执行的任务数量不能超过5个// 示例// const tm = new TaskManager(5)// tm.addTask(() => Promise.resol

1.判断素数function isPrinme(n){ if(n===0||n===1) return false if(n===2) return true for(let i = 2; i <= Math.sqrt(n); i++){ if(n % i === 0){ return false } } return true}2.求n以内的所有素数function getPrinmes(n){ let set = new Set() for(let i =

1.命名规范，如BEMBEM 的意思就是块（block）、元素（element）、修饰符（modifier）。是由 Yandex 团队提出的一种前端命名方法论。2.css in js使用 js 语言写 css，完全不需要些单独的 css 文件，所有的 css 代码全部放在组件内部，以实现 css 的模块化。CSS in JS 其实是一种编写思想，目前已经有超过 40 多种方案的实现，最出名的是 styled-components。3. css modules使用JS编译CSS文件，使其具备

Object.createObject.create = function(proto){ var foo = function(){} foo.prototype = o return new foo()}instanceoffunction instanceof(l,r){ r = l.prototype l = l.__proto__ while(true){ if(l === null){ return false } if(l === r){

1.页面iframe访问跨域网站baiduhtml<iframe id="iframe" src="http://www.baidu.com" frameborder="0"></iframe>javascriptlet iframe = document.getElementById('iframe')2.打印访问内容1.查看是否可以访问documentconsole.log(iframe.contentWindow.document) //结果如下图:可以访问

1.Object() 说明Object 是一个构造函数，函数也是对象，具有__proto__属性所以Object.__proto__ === Function.prototype ,因此Object instanceof Function === true根据原型链原理，顶端是Object.prototype,所以 Function.prototype.__proto__ === Object.prototype，因此Object instanceof Object === true2.Functi

1.null 表示没有对象，即此处不应该有值。用法：a.作为函数的参数，表示该函数参数不是一个对象b.作为对象原型链的终点 2.undefined表示没有值，即此处应该有值，但是没有定义。用法：a.变量被声明，没有赋值，该变量等于undefinedb.函数调用时，应该提供的参数没有提供，该参数等于undefinedc.对象没有赋值的属性 d.没有返回值的函数...

1.num++ 运算之后num+1let num = 0 let val = num++ //val:0 num:12.++num 运算之前num+1let num1 = 0 let val1 = num1++ //val1:1 num:1

左右双指针1.求和function sum(arr,target){ let left = 0,right = arr.length-1 while(left<right){ if(arr[left]+arr[right]>target){ right-- }else if(arr[left]+arr[right]<target){ left++ }else if(arr[left]+arr[right]==target){

1.Array.isArray() 用于判断一个对象是否为数组。如果对象是数组返回 true，否则返回 false。Array.isArray([]) // true2.constructor 属性返回对创建此对象的函数的引用。[].constructor === Array //true3.instanceof 运算符用于检测构造函数的 prototype 属性是否出现在某个实例对象的原型链上[] instanceof Array //true4.调用Object上原型to.

冒泡排序通过相邻元素的比较和交换，使得每一趟循环都能找到未有序数组的最大值或最小值。// 最好：O(n)，只需要冒泡一次数组就有序了。// 最坏：O(n²)// 平均：O(n²)function bubbleSort(arr){ for(let i = 0,len = arr.length; i<len; i++){ for(let j = 0; j<len-i-1; j++){ if(arr[j]>arr[j+1]){ [arr[j],arr[j+1]].

节流 ：在单位时间内，只触发一次function throttle(fn,delay=500){ let flag = true return (...args)=>{ if(!flag) return flag = false setTimeout(()=>{ fn.apply(this,args) flag = true },delay) }}防抖：事件触发n秒后再执行回调，n秒内触发，重新计时function debounce(fn,d.

/** Vue源码 296行 * Check if two values are loosely equal - that is, * if they are plain objects, do they have the same shape? */function isObject(data){ return typeof data === 'object' && data !== null}function looseEqual(a,b){ if(a===.

Array.prototype.reduce = function(func,prev){ for(let i = 0 ; i < this.length;i++){ if(prev === undefined){ prev = fn(this[i],this[i+1],i,this) }else{ prev = fn(prev,this[i],i,this) } return prev }}Array.prototype.forEa

let list = new Set()let observer = fn => list.add(fn)function observered(obj){ return new Proxy(obj,{ set(target,propKey,value,receiver){ const result = Reflect.set(target,propKey,value,receiver) list.forEach(fn=>fn()) return result }

const resolvePromise = (promise2,x,resolve,reject) => { if(promise2 === x){ return reject(new TypeError('Chaining cycle detected for promise #<Promise>')) } let called; if(typeof x === 'function' || (typeof x === 'object' && typeof x

((win,doc){ const docEl = document.documentElement, calc = function(){ let clientWidth = docEl.clientWidth if(clientWidth>=750){ docEl.style.fontSize = '100px' }else{ docEl.style.fontSize = 100 * clientWidth / 750 + 'px' } } window.ad

Function.prototype.mybind = function(context,...args){ var self = this//保存被调函数 var fbound = function(){ //执行被调函数 return self.apply( //判断是不是new this instanceof self ? this : context, //参数合并 args.concat(...arguments) ) } fbound.prototyp

function getJSON(url){ return new Promise((resolve,reject)=>{ const handler = function(){ if(this.readyState !== 4) return if(this.status === 200| | this.status === 304){ resolve(this.response) }else{ reject(new Error(this.statusText

class Emmiter{ constructor(){ this.eventList = {} //事件调度中心 } on(type,func){//订阅 if(!this.eventList[type]){ this.eventList[type] = [] } this.eventList[type].push(func) } emit(type,val){//发布 if(!this.eventList[type]) return this.eventLis

function Man(name){ this.name = name}Man.prototype.someThing = function(){}1.原型链继承缺点：1.子类实例化，无法向父类传参2.共用一个原型对象function Parent(){}Parent.prototype = new Man("1")const p1 = new Parent()const p2 = new Parent()2.经典继承（构造函数继承）缺点：1.原型链断裂2.子类无法继承父类

function mynew(func){ //1.首先，创建一个空对象，且继承构造函数的原型对象 let obj = Object.create(func.prototype) //2.构造函数被执行，this指针指向上面创建的空对象 let result = obj.call(obj,arguments) //3.如果执行结果返回的是一个对象或者函数，则返回执行结果，否则返回第一步空对象 let isObject = typeof result === "object" &&