a = 'leetcodeisacommunityforcoders';
function deal(str) {
const arr = str.split('');
const delArr=['a','e','i','o','u'];
// console.log(arr, 1);
for (let i = 0; i < arr.length; i++) {
// console.log(arr[i], 12, arr[i] === 'a');
// if (arr[i] === 'a' || arr[i] === 'e' || arr[i] === 'i' || arr[i] === 'o' || arr[i] === 'u') {
// arr.splice(i, 1);
// // console.log(arr, 11);
// }
if( delArr.includes(arr[i]) && arr.indexOf(arr[i])!==-1){
arr.splice(i,1);
}
}
return arr;
}
deal(a);
a.replaceAll(/[aeiou]/g,'');
const arr = [[1, 2, 2], [3, 4, 5, 5], [6, 7, 8, 9, [11, 12, [12, 13, [14]]]], 10];
function flatten(arr) {
let tem = [];
for (let i = 0; i < arr.length; i++) {
const item = arr[i];
if (Array.isArray(item)) {
tem = tem.concat(flatten(item));
} else {
// if (tem.indexOf(item) > -1) continue;
tem.push(item);
}
}
return tem;
}
flatten(arr);
function flatten(arr) {
for (let i = 0; i < arr.length; i++) {
if (Array.isArray(arr[i])) {
arr = arr.concat(arr[i]);
arr.splice(i, 1);
}
}
return arr;
}
flatten(arr);
const nums1 = [1, 2, 3];
const nums2 = [2, 3, 4];
let tem = [];
nums2.forEach((item) => {
// if (nums1.includes(item)) {
// tem.push(item);
// }
if(nums1.indexOf(item)!==-1){
tem.push(item)
}
});
console.log(tem);
for foreach 性能比较，无额外的函数调用栈和上下文
foreach Array.foreach(currentValue,index,arr)
function find(S,T){
if(S.length for(let i=0;i if(S.slice(i,i+T.length)===T){ return i; } } return -1; } find('sahdhsddsdsdqqwqw','hdh') function rotate(arr,k){ const len=arr.length; const step=k%len; return arr.slice(-step).concat(arr.slice(0,len-step)) } rotate([1,2,3,4,5,6],5) function debounce(){ let timer:any; return function(val:any){ clearTimeout(timer); timer=setTimeout(()=>{ console.log(val) },500) } } [...Array(100).keys()].filter((item)=>{ const aa=new Array(item.toString().split('').reverse().join('')); // console.log(typeof(aa),new Array(aa)) console.log(item,aa.join(''),Number(aa.join(''))) return item.toString().length>1 && item===Number(aa.join('')) }) arr = [1, 2, [3, [4, 5]], 6, 8, 3]; Array.form(new Set(arr.flat(Infinity))).sort((a, b) => { return a - b; }); arr=[1,3,4,2,7,5] function maopao(arr) { if (arr.length < 1) return; console.time('time1'); const arr1 = [...arr]; let isOk = true; for (let i = 0; i < arr1.length - 1; i++) { for (let j = i + 1; j < arr1.length; j++) { if (arr1[i] > arr1[j]) { const temp = arr1[i]; arr1[i] = arr1[j]; arr1[j] = temp; isOk = false; }else{ isOk=true; } } if (isOk) { continue; } } console.timeEnd('time1'); return arr1; } maopao(arr); const obj = { 1: 222, 2: 333, 3: 444 }; const res = Array.from({ length: 12 }).map((item, index) => obj[index + 1] || null); function byte(str) { const arr = str.split(''); const newArr = arr.map((item,index) => { console.log(item,item.toString(),typeof(item)) return item.toString() === item.toUpperCase() ? item.toLowerCase() : item.toUpperCase(); }); console.log(newArr) return newArr.join(''); } console.log(byte('aBc')); function zero(arr) { const len = arr.length; let j = 0; for (let i = 0; i < len - j; i++) { if (arr[i] === 0) { arr.push(0); console.log('arr1', arr); arr.splice(i, 1); console.log('arr2', arr); i--; j++; } } return arr; } arr = [0, 2, 1, 0, 3]; zero(arr); function *DFS(tree){ yield tree; let children=tree.children; for(let i in tree){ yield *DFS(children[i]) } } console.log([...DFS(tree)]) webpack 依赖的收集 配置入口进来做递归解析最后生成一个依赖图，dev-server运行的时候每次都去重新收集所有依赖，terser 只在打包压缩时候才会运行，在dev的时候是没有办法进行缓存的 。bable-loader可以进行缓存设置，但是一般项目为了加快构建速度，都会默认不去处理node_modules里面的依赖，所以第三方的依赖包无法被编译缓存 html: link ref 等属性 link同时加载 @import页面加载完毕后被加载；link方式的样式的权重高于@import的权重； link是html标签，@import是IE5以上使用 重绘和回流 function fillNum(num){ const nums=num.toString(); const len=Number(nums).toString(2).length; console.log("==>",len,nums.toString(2)); let i=len; let arr=[]; if(i<8){ while(8-i){ arr.push(0) i++; } let val=nums.toString(2).split(""); console.log("val===>",arr,val) arr=arr.concat(val) console.log("arr===>",arr) }else{ return Number(nums).toString(2); } return arr.join(''); } var b="192.168.1.1"; var arr=b.split("."); var len=arr.length; var str=""; for(let i=0;i console.log(arr[i],Number(arr[i]).toString(2)) str=str+"-"+fillNum(arr[i]); } console.log(str) const sleep=(time)=>{ return new Promise(resolve=>{ setTimeout(resolve,time) }) } sleep(1000).then(()=>{ console.log(112) }) arr=[1,32,4,2,45,33,23] arr.sort((a,b)=>{ return a-b; }) function zeroMove(arr){ const len=arr.length; let j=0; for(let i=0;i if(arr[i]===0){ arr.push(0); arr.splice(i,1) i--; j++ } } return arr; } zeroMove([0,2,2,0,22,0,1]) function add(...arg){ console.log("===>",...arg) let sum=0; const addInner=(...arg)=>{ console.log("pp=>",...arg) arg.forEach(i=>(sum+=i)); return addInner; } addInner.toString=()=>sum; return addInner(...arg); } function ans(arr,target){ const len=arr.length; // let map={}; let map=new Map(); for(let i=0;i // map[arr[i]]=i; map.set(arr[i],i) } console.log(map) console.log(map.get(1)) for(let j=0;j var d=target-arr[j]; console.log("d===>",d) const value=map.get(d); console.log("111===>",j,value) if(value && value !==j){ return [j,value] } // var jj=arr.indexOf(d); // if(jj!==-1){ // return [j,jj] // } } return "404"; } ans([1,2,3,4,7],9) 1234 function reverseNum(num){ const num1=Math.floor(num/10); const num2=num%10; if(num1<1){ return num; }else{ return `${num2}${reverseNum(num1)}` } } reverseNum(1234) function reverseStr(str){ const newStr=str.split('').reverse(); console.log("newStr===>",newStr); const bb=Array.from(new Set(newStr)); console.log("newStr2===>",new Set(newStr)); const fv=bb.join('') console.log(bb,fv) return fv; } reverseStr('abddddbs') const rsort=()=>{ return () } rsort(()=>Math.random-0.5) function numToStep(num){ let count=0; while(num!==0){ if(num%2===0){ num=num/2; }else{ num--; } count++; } return count; } numToStep(8); /** * @param {number} num * @return {number} */ var numberOfSteps = function (num) { const binStr = num.toString(2); const arr = binStr.match(/1/g); if (arr) { console.log(num,binStr,arr); return binStr.length + arr.length - 1 } else { return 0; } }; a=1234; let str=a.toString(); let sum=0; let pro=1; for(let i=0;i sum+=parseInt(str[i]); pro*=parseInt(str[i]) } console.log(pro,sum,pro-sum) address = "255.100.50.0" address.replaceAll('.',"[.]") let i=0; let map=new Map(); function encode(url){ map.set(i,url); return "http://tinyurl.com/" + i++; } function decode(url){ return map.get(parseInt(url.replace("http://tinyurl.com/", ""))) } function Permutation(str){ let res=[]; if(str.length===0){ return str } Permution(str,0,str.length,res); return res; } function Permution(str,start,end,res){ if(start=end-1){ res.push(str); return; }else{ for(let i=start;i if(i !==start && str[i]!==str[start]){ continue; }else{ let tem=str[i]; str[i]=str[start]; str[start]=tem; Permution(str,start+1,str.length,res); } } } } var permutation = function(S) { const ret = [] const remove = (chars, i) => chars.filter((c, idx) => i !== idx) const proc = (chars, v) => { console.log("===>",chars,v) if (v.length === S.length) { console.log("结果===》",v,S) ret.push(v) return } for (let i = 0; i < chars.length; i++) { console.log("111===>",chars,remove(chars, i),`${v}${chars[i]}`) proc(remove(chars, i), `${v}${chars[i]}`) } } proc([...S], ''); return ret; }; function printNum(nums){ let total=1; while(nums--){ total*=10; } for(let i=1;i console.log(i) } } printNum(2) function fibler(nums){ let f0=0; let f1=1; let res=0; if(nums<1){ return nums; } while(--nums){ res=f0+f1; f0=f1; f1=res; } return res; } fibler(4); var name="jack"; function person(name){ this.name=name; console.log("===>",this.name); console.log("window===>",this); return name; } var a=person('lily'); console.log("name===>",name) console.log("a===>",a) var b=new person("fred"); console.log("b===>",b); class A{} class B extends A{} const a=new A(); const b=new B(); console.log(a.__proto__===A.prototype) console.log(b.__proto__===B.prototype) console.log(B.__proto__) console.log(B.prototype.__proto__) console.log(b.__proto__.__proto__) function Node(data,left,right){ this.data=data; this.left=left; this.right=right; } Node.prototype.show=function(){ return this.data } function BST(){ this.root=null; } BST.prototype.insert=function(data){ console.log("data==>",data) var node=new Node(data,null,null); console.log("node==>",node) if(this.root===null){ console.log("thisroot==>",this.root) this.root=node; }else{ var current=this.root; var parent; while(true){ parent=current; console.log("parent0==>",parent,data,current.data,data if(data current=current.left; if(current===null){ parent.left=node; break; } }else{ current=current.right; if(current===null){ parent.right=node; break; } } } console.log("parent==>",parent) } } BST.prototype.perOrder=function(node){ if(node){ console.log(node.show()+"===>"+node); this.perOrder(node.left); this.perOrder(node.right) console.log(node.left+"===>"+node.left); } } var bst=new BST(); var nums=[10,3,18,2,4,13,21,9,8,9]; for(let i=0;i bst.insert(nums[i]) } bst.perOrder(bst.root) /* 高阶组件 很好的模式，作用、局限性、如何实现 定义：一个react组件包裹着另外一个组件，这种模式通常用函数来实现，基本上是一个类工厂 */ /* fiber作用 1，概念： react 执行渲染的一种新的调度策略，js是单线程的，一旦组件开始更新，主线程会一只控制着，这时候如果在执行交互操作，就会卡顿 一个组件可以对应多个fiber render函数中创建的react element树在第一次渲染时候创建一颗结构一摸一样的fiber节点树。不同的react element类型对应不同的fiber节点类型。一个 react element的工作就由他对应的fiber节点来负责 react fiber重构了这种方式，渲染过程采用切片的方式，每执行一会，就歇一会。如果有优先级更高的任务到来以后就会先去执行，降低页面发生卡顿的可能性。使得react对动画等实时性要求较高的场景体验更好 2，什么是fiber 当JS处理大型计算的时候会导致页面出现卡顿，更严重的就是假死。 ===》动画丢帧、不连贯。用户体验差。 解决： 大型计算===》拆小型计算===》执行顺序异步调用，这样就不会长时间霸占线程 UI也能在两次计算执行间隙进行更新，从而与用户及时反馈。 3.从how ===》when how如何用哪个最少的DOM操作成本来update视图 when 何时update视图那一部分 优先级 type priortylevel=0|1|2|3|4|5; 动画和页面交互都是优先级比较高的，这也是fiber能够使得动画、布局、页面交互变得流畅的原因之一 可以把priority分为同步和异步两个类别，同步优先级的任务会在当前帧完成。 4，基本原则 调和:找出要做的更新工作，计算阶段、计算结果可以被缓存，也可以被打断 交付：需要提交所有更新并渲染，为了防止页面抖动被设置为不能打断 5，数据结构： 链表，指向第一个子节点和相邻的兄弟节点 更新队列：updateQueue,一个链表 每个fiber都有一个属性updateQueue指向其对应的更新队列 6执行流程： 用户操作setState==>enqueSetState方法 7，有什么影响： 1）需要关注react为任务片设置的优先级，特别是页面用动画的情况 2）如果一直有更高级别的任务，那么fiber算法会执行级别更高的任务，执行完毕后再通过callback回到之前渲染一般的组件从头开始渲染 （看起来放弃已经渲染完的生命周期，会有点不合理，反而增加渲染时长） 3，compoenntWillMount componentWillReceiveProps componentWillUpdate几个生命周期不再安全，由于任务执行过程可以被打断，这几个生命周期可能会执行多次 如果包含ajax会有意想不到的BUG。尽量采用纯函数 */