当前位置: 首页 > 科技观察

从Vue.js的源码中,我从友达

时间:2023-03-13 20:01:16 科技观察

学了一些精妙的方法,事不宜迟。一起来试试友达教的这些妙法吧!您一定会在工作中使用它们。Immediatelyexecutefunction页面加载后只执行一次的设置函数。(function(a,b){console.log(a,b);//1,2})(1,2);通常,全局变量作为参数传递给立即执行的参数,这样在函数内部不用,也可以使用window访问。(function(global){console.log(global);//窗口对象})(this);多层嵌套三元运算符三元运算符的嵌套写法导致代码可读性差,适合简单的业务场景,可以尝试使用。vara=1;varb=0;a==1?(b==2?(b=3):(b=1)):"";console.log(b);//1冻结对象不能指定添加、删除和修改对象。varemptyObject=Object.freeze({key:"1",});emptyObject.name="maomin";deleteemptyObject.key;emptyObject.key="2";console.log(emptyObject);密封对象只能用于指定对象的更改不能添加或删除。varsealObject=Object.seal({key:3,});sealObject.name="maomin";deletesealObject.key;sealObject.key=4;console.log(sealObject);//4检查是否为原值functionisPrimitive(值){return(typeofvalue==="string"||typeofvalue==="number"||//$flow-disable-linetypeofvalue==="symbol"||typeofvalue==="boolean");}快速检测是物体吗?当我们知道原始值时,它主要用于区分对象和原始值。functionisObject(obj){returnobj!==null&&typeofobj==="object";}console.log(isObject(true));//假检测目标类型var_toString=Object.prototype.toString;functiontoRawType(value){return_toString.call(value).slice(8,-1);}console.log(toRawType([]));//数组检查目标是否为有效的数组索引functionisValidArrayIndex(val){varn=parseFloat(String(val));returnn>=0&&Math.floor(n)===n&&isFinite(val);}判断是否是Promise对象functionisDef(v){returnv!==undefined&&v!==null;}functionisPromise(val){return(isDef(val)&&typeofval.then==="function"&&typeofval.catch==="function");}varpromiseObj=newPromise(function(resolve,reject){//一个耗时的异步操作resolve("success");//data处理完成//reject('failure')//数据处理错误}).then((res)=>{console.log(res);},//成功(err)=>{console.log(err);}//fail);console.log(isPromise(promiseObj));//真正的对象转为字符串var_toString=Object.prototype.toString;functionisPlainObject(obj){return_toString.call(obj)==="[object对象t]";}functiontoString(val){returnval==null?"":Array.isArray(val)||(isPlainObject(val)&&val.toString===_toString)?JSON.stringify(val,null,2):String(val);}console.log(toString({name:1}));//{"name":1}转为数字将输入值转为数字持久化如果转换失败,则原始字符返回字符串。functiontoNumber(val){varn=parseFloat(val);returnisNaN(n)?val:n;}检查key是否在创建的Map对象中functionmakeMap(str,expectsLowerCase){varmap=Object.create(null);varlist=str.split(",");for(vari=0;i-1){returnarr.splice(index,1);}}}console.log(remove([1,2],1));//[1]检测对象中是否存在指定的keyvarhasOwnProperty=Object.prototype.hasOwnProperty;functionhasOwn(obj,key){returnhasOwnProperty.call(obj,key);}console.log(hasOwn({name:1},"name"));//true将类数组对象转换为真正的数组函数toArray(list,start){start=start||0;vari=list.长度开始;varret=newArray(i);while(i--){ret[i]=list[i+start];}returnret;}console.log(toArray({0:42,1:52,2:63,length:3}));//[42,52,63]将属性混合到目标对象中functionextend(to,_from){for(varkeyin_from){to[key]=_from[key];}returnto;}console.log(extend({name:1},{name1:2}));//{name:1,name1:2}将对象数组合并为一个对象functionextend(to,_from){for(varkeyin_from){to[key]=_from[key];}return;}functiontoObject(arr){vars={};for(vari=0;i0;varisEdge=UA&&UA.indexOf("edge/")>0;varisAndroid=(UA&&UA.indexOf("android")>0)||weexPlatform==="android";varisIOS=(UA&&/iphone|ipad|ipod|ios/.test(UA))||weexPlatform==="ios";varisChrome=UA&&/chrome\/\d+/.test(UA)&&!isEdge;varisPhantomJS=UA&&/phantomjs/.test(UA);varisFF=UA&&UA.match(/firefox\/(\d+)/);JS构造函数中的方法与构造函数的prototype属性的方法对比定义在构造函数内部的方法,会在它的每一个实例上克隆该方法;在构造函数的原型属性上定义的方法将与其所有实例共享该方法,但不是在每个实例上。如果我们的应用程序需要创建很多新对象,而这些对象有很多方法,为了节省内存,我们建议将这些方法定义在构造函数的原型属性上。当然,在某些情况下,我们需要在构造函数中定义某些方法,这一般是因为我们需要访问构造函数内部的私有变量。functionA(){this.say=function(){console.log(1);};}vara=newA();a.say();functionB(){}B.prototype.say=function(){console.log(2);};varb=newB();b.say();varc=newB();c.say();获取标签内容(含标签).innerHTML;}}字符串哈希值functionhash(str){varhash=5381;vari=str.length;while(i){hash=(hash*33)^str.charCodeAt(--i);}returnhash>>>0;}console.log(hash("222sd"));//164533792