当前位置: 首页 > Web前端 > HTML

11个JS常用技巧

时间:2023-03-28 19:12:36 HTML

鍦ㄦ垜浠棩甯哥殑寮€鍙戣繃绋嬩腑锛岀粡甯镐細閬囧埌鏁板瓧鍜屽瓧绗︿覆鐨勮浆鎹紝妫€鏌ュ璞′腑鏄惁鏈夊搴旂殑鍊硷紝鏉′欢鎿嶄綔瀵硅薄鏁版嵁锛岃繃婊ゆ暟缁勪腑鐨勯敊璇€硷紝绛夌瓑銆傚湪杩欓噷锛屾垜鏁寸悊浜嗕竴浜涘父鐢ㄧ殑tips锛屼篃鏄垜鏈€鍠滄鐨勨潳锔忥紝鍙互璁╂垜浠殑浠g爜鏇寸簿绠€锛屾洿绠€娲侊紝涔熼潪甯稿疄鐢ㄣ€傞€氳繃鏉′欢鍒ゆ柇缁欏璞℃坊鍔犲睘鎬onstisValid=false;constage=18;//鎴戜滑鍙互閫氳繃鎵╁睍杩愮畻绗︾粰瀵硅薄娣诲姞灞炴€onstperson={id:'ak001',name:'ak47',...(isValid&&{isActive:true}),...((age>18||isValid)&&{cart:0})}console.log('person',person)妫€鏌ュ璞′腑鏄惁瀛樺湪灞炴€onstperson={id:'ak001',name:'ak47'}console.log('浜哄悕');//trueconsole.log(浜茶嚜'isActive');//閿欒鐨勮В鏋勮祴鍊糲onstproduct={id:'ak001',name:'ak47'}const{name:weaponName}=product;console.log('weaponName:',weaponName);//weaponName:ak47//閫氳繃鍔ㄦ€侀敭瑙f瀯璧嬪€糲onstextractKey='name';const{[extractKey]:data}=product;console.log('鏁版嵁锛?,鏁版嵁);//data:ak47寰幆閬嶅巻瀵硅薄鐨勯敭鍜屽€糲onstproduct={id:'ak001',name:'ak47',isSale:false}Object.entries(product).forEach(([key,value])=>{if(['id','name'].includes(key)){console.log('key:',key,'value:',value)}})//key:idvalue:ak001//key:namevalue:ak47浣跨敤鍙€夐摼锛圤ptionalchaining锛夐伩鍏嶈闂璞″睘鎬ф椂鎶ラ敊constproduct={id:'ak001',name:'ak47'}console.log(product.sale.isSale);//鎶涘嚭閿欒console.log(product?.sale?.isSale);//undefined娉ㄦ剰鈿狅笍锛氬湪瀹為檯浣跨敤鍦烘櫙涓紝鏈変簺鍦烘櫙瀵逛簬鎴戜滑鎯宠鑾峰彇鐨勫睘鎬ф潵璇村苟涓嶆槸蹇呴』鐨勩€傛垜浠彲浠ラ€氳繃涓婅堪鏂规硶閬垮厤鎶ラ敊锛涗絾鏄湁浜涘睘鎬у湪鏌愪簺鍦烘櫙涓嬫槸蹇呴』鐨勶紝鍚﹀垯浼氬奖鍝嶆垜浠殑瀹為檯鍔熻兘銆傝繖鏃跺€欒繕鏄皾璇曠粰鍑烘槑纭殑閿欒淇℃伅鏉ヨВ鍐宠繖涓敊璇殑鍙戠敓6.妫€鏌ユ暟缁勪腑falsy鐨勫€糲onstfruitList=['apple',null,'banana',undefined];//杩囨护鎺塮alsy鐨勫€糲onstfilterFruitList=fruitList.filter(Boolean);console.log('filterFruitList:',filterFruitList);//filterFruitList:['apple','banana']//妫€鏌ユ暟缁勪腑鏄惁鏈夌湡鍊糲onstisAnyFruit=fruitList.some(Boolean);console.log('isAnyFruit:',isAnyFruit);//isAnyFruit:true7.鏁扮粍鍘婚噸constfruitList=['apple','mango','banana','apple'];constuniqList=[...newSet(fruitList)]console.log('uniqList:',uniqList);//uniqList:['apple','mango','banana']鍒ゆ柇鏄惁涓烘暟缁勭被鍨媍onstfruitList=['apple','mango'];console.log锛堟按鏋滃垪琛ㄧ被鍨嬶級锛?/瀵硅薄鎺у埗鍙?log(Array.isArray(fruitList));//鐪?銆傛暟瀛?瀛楃涓茬被鍨嬭浆鎹onstpersonId='007';console.log('personId:',+personId,'type:',typeof+personId);//personId:7type:numberconstpersonId=119;console.log('personId:',personId+'','type:',typeof(personId+''));//personId:119type:string鑱槑鍦颁娇鐢∟ull鍊煎悎骞???)letdata=undefined??'noData;console.log('data:',鏁版嵁);//鏁版嵁锛歯oDatadata=null??'noData';console.log('data:',data);//鏁版嵁锛歯oDatadata=0??鏃犳晥鐨勶紵锛熲€滄棤鏁版嵁鈥濓紱鎺у埗鍙般€傛棩蹇楋紙'鏁版嵁锛?锛屾暟鎹級;//data:0//褰撴垜浠牴鎹彉閲忔湰韬垽鏂椂data??='noData';console.log('data:',data);//data:noData鍜宱r(||)杩愮畻绗︽湁浠€涔堝尯鍒紵\or杩愮畻绗﹂拡瀵筬alsy鍊硷紙0,'',null,undefined,false,NaN锛夛紝绌哄€煎悎骞跺彧瀵筺ull鍜寀ndefined鏈夋晥锛涢€氳繃!!杩涜甯冨皵杞崲console.log('thisisnotempty:',!!'')//thisisnotempty:falseconsole.log('thisisnotempty:',!!'Data')//thisisnotempty:true鏈€鍚庡笇鏈涜繖浜涘皬鎶€宸ц兘澶熷澶у鐨勬棩甯稿紑鍙戞湁鎵€甯姪銆傚鏋滀綘鏈夋洿濂界殑鏂规硶锛屾杩庣暀瑷€鍒嗕韩馃槉