6绉岼avaScript缁ф壙鏂瑰紡鍙婁紭缂虹偣

Posted 2020-12-21

鏍囩锛?a href='http://www.mamicode.com/so/1/%e8%af%b4%e6%98%8e' title='璇存槑'>璇存槑   浠ｇ爜   tps   鎺ユ敹   lan   缁撴灉   瀹炵幇   css   杈撳嚭   

鍙嬫儏鎻愮ず锛氭兂瑕佹洿濂界殑鐞嗚Вjs缁ф壙鏂瑰紡锛岄』浜嗚В鏋勯€犲嚱鏁般€佸師鍨嬪璞°€佸疄渚嬪寲瀵硅薄銆佸師鍨嬮摼绛夋蹇?/p>

绗竴绉嶏細鍘熷瀷閾剧户鎵?/strong>
鍒╃敤鍘熷瀷閾剧殑鐗圭偣杩涜缁ф壙

function Parent(){
    this.name = 鈥榳eb鍓嶇鈥?
    this.type = [鈥?span class="hljs-string">js鈥?鈥?span class="hljs-string">html鈥?鈥?span class="hljs-string">css鈥榏;
}
Parent.prototype.Say=function(){
    console.log(this.name);
}
function Son(){};
Son.prototype = new Parent();
son1 = new Son();
son1.Say();

浠ヤ笂渚嬪瓙瑙ｉ噴锛?br>鈶犲垱寤轰竴涓彨鍋歅arent鐨勬瀯閫犲嚱鏁帮紝鏆備笖绉颁负鐖舵瀯閫犲嚱鏁帮紝閲岄潰鏈変袱涓睘鎬ame銆乼ype
鈶￠€氳繃Parent鏋勯€犲嚱鏁扮殑灞炴€?鍗冲師鍨嬪璞?璁剧疆Say鏂规硶锛屾鏃讹紝Parent鏈?涓睘鎬у拰1涓柟娉?br>鈶㈠垱寤轰竴涓彨鍋歋on鐨勬瀯閫犲嚱鏁帮紝鏆備笖绉颁负瀛愭瀯閫犲嚱鏁?  
鈶ｈ缃甋on鐨勫睘鎬?鍗冲師鍨嬪璞?鍊间负鐖舵瀯閫犲嚱鏁癙arent鐨勫疄渚嬪璞★紝鍗冲瓙鏋勯€犲嚱鏁癝on缁ф壙浜嗙埗鏋勯€犲嚱鏁癙arent锛屾鏃禨on涔熸湁2涓睘鎬у拰1涓柟娉?br>鈶ゅSon鏋勯€犲嚱鏁拌繘琛屽疄渚嬪寲锛岀粨鏋滆祴鍊肩粰鍙橀噺son1锛屽嵆son1涓哄疄渚嬪寲瀵硅薄锛屽悓鏍锋嫢鏈?涓睘鎬у拰1涓柟娉?br>鈶ヨ緭鍑簊on1鐨凷ay鏂规硶锛岀粨鏋滀负"web鍓嶇"
浼樼偣锛氬彲浠ュ疄鐜扮户鎵?br>缂虹偣锛?br>鈶犲洜涓篠on.prototype(鍗冲師鍨嬪璞?缁ф壙浜哖arent瀹炰緥鍖栧璞★紝杩欏氨瀵艰嚧浜嗘墍鏈塖on瀹炰緥鍖栧璞￠兘涓€鏍凤紝閮藉叡浜湁鍘熷瀷瀵硅薄鐨勫睘鎬у強鏂规硶銆備唬鐮佸涓嬶細

son1 = new Son();
son2 = new Son();
son1.type.push(鈥?span class="hljs-string">vue鈥?;
console.log(son1.type);//[鈥楯S鈥?鈥?span class="hljs-comment">html鈥?鈥?span class="hljs-comment">css鈥?鈥?span class="hljs-comment">vue鈥榏
console.log(son2.type);//[鈥楯S鈥?鈥楬TML鈥?鈥楥SS鈥?鈥榁UE鈥榏

缁撴灉son1銆乻on2閮芥槸[鈥楯S鈥?鈥楬TML鈥?鈥楥SS鈥?鈥榁UE鈥榏
鈶on鏋勯€犲嚱鏁板疄渚嬪寲瀵硅薄鏃犳硶杩涜鍙傛暟鐨勪紶閫?/p>

绗簩绉嶏細鏋勯€犲嚱鏁扮户鎵?/strong>
閫氳繃鏋勯€犲嚱鏁癱all鏂规硶杩涜缁ф壙锛岀洿鎺ユ潵鐪嬩唬鐮侊細

function Parent(){
    this.name = 鈥榳eb鍓嶇鈥?
    this.type = [鈥楯S鈥?鈥楬TML鈥?鈥楥SS鈥榏;
}
function Son(){
    Parent.call(this);
}
son1 = new Son();
son1.type.push(鈥榁UE鈥?;
console.log(son1.type);//[鈥楯S鈥?鈥楬TML鈥?鈥楥SS鈥?鈥榁UE鈥榏
son2 = new Son();
console.log(son2.type);//[鈥楯S鈥?鈥楬TML鈥?鈥楥SS鈥榏

浠ヤ笂渚嬪瓙瑙ｉ噴锛?br>鈶犲垱寤虹埗绾ф瀯閫犲嚱鏁癙arent锛屾湁name銆乼ype涓や釜灞炴€?br>鈶″垱寤哄瓙绾ф瀯閫犲嚱鏁癝on锛屽嚱鏁板唴閮ㄩ€氳繃call鏂规硶璋冪敤鐖剁骇鏋勯€犲嚱鏁癙arent锛屽疄鐜扮户鎵?br>鈶㈠垎鍒垱寤烘瀯閫犲嚱鏁癝on鐨勪袱涓疄渚嬪寲瀵硅薄son1銆乻on2锛屽son1鐨則ype灞炴€ф柊澧炲厓绱狅紝son2娌℃湁鏂板锛岀粨鏋滀笉涓€鏍凤紝璇存槑瀹炵幇浜嗙嫭绔?br>浼樼偣锛?br>鈶犲疄鐜板疄渚嬪寲瀵硅薄鐨勭嫭绔嬫€э紱
鈶¤繕鍙互缁欏疄渚嬪寲瀵硅薄娣诲姞鍙傛暟

function Parent(name){
    this.name = name;
}
function Son(name){
    Parent.call(this,name);
}
son1 = new Son(鈥楯S鈥?;
console.log(son1);//JS
son2 = new Son(鈥楬TML鈥?;
console.log(son2);//HTML

缂虹偣锛?br>鈶犳柟娉曢兘鍦ㄦ瀯閫犲嚱鏁颁腑瀹氫箟锛屾瘡娆″疄渚嬪寲瀵硅薄閮藉緱鍒涘缓涓€閬嶆柟娉曪紝鍩烘湰鏃犳硶瀹炵幇鍑芥暟澶嶇敤
鈶all鏂规硶浠呬粎璋冪敤浜嗙埗绾ф瀯閫犲嚱鏁扮殑灞炴€у強鏂规硶锛屾病鏈夊姙娉曡皟鐢ㄧ埗绾ф瀯閫犲嚱鏁板師鍨嬪璞＄殑鏂规硶

 

绗笁绉嶏細缁勫悎缁ф壙
鍒╃敤鍘熷瀷閾剧户鎵垮拰鏋勯€犲嚱鏁扮户鎵跨殑鍚勮嚜浼樺娍杩涜缁勫悎浣跨敤锛岃繕鏄湅浠ｇ爜锛?/p>

function Parent(name){
    this.name = name;
    this.type = [鈥楯S鈥?鈥楬TML鈥?鈥楥SS鈥榏;
}
Parent.prototype.Say=function(){
    console.log(this.name);
}
function Son(name){
    Parent.call(this,name);
}
Son.prototype = new Parent();
son1 = new Son(鈥樺紶涓夆€?;
son2 = new Son(鈥樻潕鍥涒€?;
son1.type.push(鈥榁UE鈥?;
son2.type.push(鈥?span class="hljs-string">php鈥?;
console.log(son1.type);//[鈥楯S鈥?鈥楬TML鈥?鈥楥SS鈥?鈥榁UE鈥榏
console.log(son2.type);//[鈥楯S鈥?鈥楬TML鈥?鈥楥SS鈥?鈥?span class="hljs-comment">php鈥榏
son1.Say();//寮犱笁
son2.Say();//鏉庡洓

浠ヤ笂渚嬪瓙瑙ｉ噴锛?br>鈶犲垱寤轰竴涓彨鍋歅arent鐨勬瀯閫犲嚱鏁帮紝閲岄潰鏈変袱涓睘鎬ame銆乼ype
鈶￠€氳繃Parent鏋勯€犲嚱鏁扮殑灞炴€?鍗冲師鍨嬪璞?璁剧疆Say鏂规硶锛屾鏃讹紝Parent鏈?涓睘鎬у拰1涓柟娉?br>鈶㈠垱寤哄瓙绾ф瀯閫犲嚱鏁癝on锛屽嚱鏁板唴閮ㄩ€氳繃call鏂规硶璋冪敤鐖剁骇鏋勯€犲嚱鏁癙arent锛屽疄鐜扮户鎵?br>鈶ｅ瓙鏋勯€犲嚱鏁癝on缁ф壙浜嗙埗鏋勯€犲嚱鏁癙arent锛屾鏃禨on涔熸湁2涓睘鎬у拰1涓柟娉?br>鈶ゅ垎鍒垱寤烘瀯閫犲嚱鏁癝on鐨勪袱涓疄渚嬪寲瀵硅薄son1銆乻on2锛屼紶涓嶅悓鍙傛暟銆佺粰type灞炴€ф柊澧炰笉鍚屽厓绱犮€佽皟鐢ㄥ師鍨嬪璞ay鏂规硶
浼樼偣锛?br>鈶犲埄鐢ㄥ師鍨嬮摼缁ф壙锛屽疄鐜板師鍨嬪璞℃柟娉曠殑缁ф壙
鈶″埄鐢ㄦ瀯閫犲嚱鏁扮户鎵匡紝瀹炵幇灞炴€х殑缁ф壙锛岃€屼笖鍙互鍙傛暟
缁勫悎鍑芥暟鍩烘湰婊¤冻浜咼S鐨勭户鎵匡紝姣旇緝甯哥敤
缂虹偣锛?br>鏃犺浠€涔堟儏鍐典笅锛岄兘浼氳皟鐢ㄤ袱娆＄埗绾ф瀯閫犲嚱鏁帮細涓€娆℃槸鍦ㄥ垱寤哄瓙绾у師鍨嬬殑鏃跺€欙紝鍙︿竴娆℃槸鍦ㄥ瓙绾ф瀯閫犲嚱鏁板唴閮?/p>

 

绗洓绉嶏細鍘熷瀷寮忕户鎵?/strong>
鍒涘缓涓€涓嚱鏁帮紝灏嗗弬鏁颁綔涓轰竴涓璞＄殑鍘熷瀷瀵硅薄

function fun(obj) {
    function Son(){};
    Son.prototype = obj;
    return new Son();
}        
var parent = {
    name:鈥樺紶涓夆€?}
var son1 = fun(parent);
var son2 = fun(parent);
console.log(son1.name);//寮犱笁
console.log(son2.name);//寮犱笁

浠ヤ笂渚嬪瓙瑙ｉ噴锛?br>鈶犲垱寤轰竴涓嚱鏁癴un锛屽唴閮ㄥ畾涔変竴涓瀯閫犲嚱鏁癝on
鈶″皢Son鐨勫師鍨嬪璞¤缃负鍙傛暟锛屽弬鏁版槸涓€涓璞★紝瀹屾垚缁ф壙
鈶㈠皢Son瀹炰緥鍖栧悗杩斿洖锛屽嵆杩斿洖鐨勬槸涓€涓疄渚嬪寲瀵硅薄
浼樼己鐐癸細璺熷師鍨嬮摼绫讳技

骞垮窞VI璁捐鍏徃https://www.houdianzi.com

绗簲绉嶏細瀵勭敓缁ф壙
鍦ㄥ師鍨嬪紡缁ф壙鐨勫熀纭€涓婏紝鍦ㄥ嚱鏁板唴閮ㄤ赴瀵屽璞?/p>

function fun(obj) {
    function Son() { };
    Son.prototype = obj;
    return new Son();
}
function JiSheng(obj) {
    var clone = fun(obj);
    clone.Say = function () {
        console.log(鈥樻垜鏄柊澧炵殑鏂规硶鈥?;
    }
    return clone;
}
var parent = {
    name: 鈥樺紶涓夆€?}
var parent1 = JiSheng(parent);
var parent2 = JiSheng(parent);
console.log(parent2.Say==parent1.Say);// false

浠ヤ笂渚嬪瓙瑙ｉ噴锛?br>鈶犲啀鍘熷瀷寮忕户鎵跨殑鍩虹涓婏紝灏佽涓€涓狫iSheng鍑芥暟
鈶″皢fun鍑芥暟杩斿洖鐨勫璞¤繘琛屽寮猴紝鏂板Say鏂规硶锛屾渶鍚庤繑鍥?br>鈶㈣皟鐢↗iSheng鍑芥暟涓ゆ锛屽垎鍒祴鍊肩粰鍙橀噺parent1銆乸arent2
鈶ｅ姣攑arent1銆乸arent2锛岀粨鏋滀负false锛屽疄鐜扮嫭绔?br>浼樼己鐐癸細璺熸瀯閫犲嚱鏁扮户鎵跨被浼硷紝璋冪敤涓€娆″嚱鏁板氨寰楀垱寤轰竴閬嶆柟娉曪紝鏃犳硶瀹炵幇鍑芥暟澶嶇敤锛屾晥鐜囪緝浣?/p>

杩欓噷琛ュ厖涓€涓煡璇嗙偣锛孍S5鏈変竴涓柊鐨勬柟娉昈bject.create()锛岃繖涓柟娉曠浉褰撲簬灏佽浜嗗師鍨嬪紡缁ф壙銆傝繖涓柟娉曞彲浠ユ帴鏀朵袱涓弬鏁帮細绗竴涓槸鏂板璞＄殑鍘熷瀷瀵硅薄锛堝彲閫夌殑锛夛紝绗簩涓槸鏂板璞℃柊澧炲睘鎬э紝鎵€浠ヤ笂闈唬鐮佽繕鍙互杩欐牱锛?/p>

function JiSheng(obj) {
    var clone = Object.create(obj);
    clone.Say = function () {
        console.log(鈥樻垜鏄柊澧炵殑鏂规硶鈥?;
    }
    return clone;
}
var parent = {
    name: 鈥樺紶涓夆€?}
var parent1 = JiSheng(parent);
var parent2 = JiSheng(parent);
console.log(parent2.Say==parent1.Say);// false

 

绗叚绉嶏細瀵勭敓缁勫悎缁ф壙
鍒╃敤缁勫悎缁ф壙鍜屽瘎鐢熺户鎵垮悇鑷紭鍔?br>缁勫悎缁ф壙鏂规硶鎴戜滑宸茬粡璇翠簡锛屽畠鐨勭己鐐规槸涓ゆ璋冪敤鐖剁骇鏋勯€犲嚱鏁帮紝涓€娆℃槸鍦ㄥ垱寤哄瓙绾у師鍨嬬殑鏃跺€欙紝鍙︿竴娆℃槸鍦ㄥ瓙绾ф瀯閫犲嚱鏁板唴閮紝閭ｄ箞鎴戜滑鍙渶瑕佷紭鍖栬繖涓棶棰樺氨琛屼簡锛屽嵆鍑忓皯涓€娆¤皟鐢ㄧ埗绾ф瀯閫犲嚱鏁帮紝姝ｅソ鍒╃敤瀵勭敓缁ф壙鐨勭壒鎬э紝缁ф壙鐖剁骇鏋勯€犲嚱鏁扮殑鍘熷瀷鏉ュ垱寤哄瓙绾у師鍨嬨€?/p>

function JiSheng(son,parent) {
    var clone = Object.create(parent.prototype);//鍒涘缓瀵硅薄
    son.prototype = clone;      //鎸囧畾瀵硅薄
    clone.constructor = son;     //澧炲己瀵硅薄
}
function Parent(name){
    this.name = name;
    this.type = [鈥楯S鈥?鈥楬TML鈥?鈥楥SS鈥榏;
}
Parent.prototype.Say=function(){
    console.log(this.name);
}
function Son(name){
    Parent.call(this,name);
}
JiSheng(Son,Parent);
son1 = new Son(鈥樺紶涓夆€?;
son2 = new Son(鈥樻潕鍥涒€?;
son1.type.push(鈥榁UE鈥?;
son2.type.push(鈥楶HP鈥?;
console.log(son1.type);//[鈥楯S鈥?鈥楬TML鈥?鈥楥SS鈥?鈥榁UE鈥榏
console.log(son2.type);//[鈥楯S鈥?鈥楬TML鈥?鈥楥SS鈥?鈥楶HP鈥榏
son1.Say();//寮犱笁
son2.Say();//鏉庡洓

浠ヤ笂渚嬪瓙瑙ｉ噴锛?br>鈶犲皝瑁呬竴涓嚱鏁癑iSheng锛屼袱涓弬鏁帮紝鍙傛暟1涓哄瓙绾ф瀯閫犲嚱鏁帮紝鍙傛暟2涓虹埗绾ф瀯閫犲嚱鏁?br>鈶″埄鐢∣bject.create()锛屽皢鐖剁骇鏋勯€犲嚱鏁板師鍨嬪厠闅嗕负鍓湰clone
鈶㈠皢璇ュ壇鏈綔涓哄瓙绾ф瀯閫犲嚱鏁扮殑鍘熷瀷
鈶ｇ粰璇ュ壇鏈坊鍔燾onstructor灞炴€э紝鍥犱负鈶腑淇敼鍘熷瀷瀵艰嚧鍓湰澶卞幓榛樿鐨勫睘鎬?br>浼樼己鐐癸細
缁勫悎缁ф壙浼樼偣銆佸瘎鐢熺户鎵跨殑鏈夌偣锛岀洰鍓岼S缁ф壙涓娇鐢ㄧ殑閮芥槸杩欎釜缁ф壙鏂规硶

以上是关于6绉岼avaScript缁ф壙鏂瑰紡鍙婁紭缂虹偣的主要内容，如果未能解决你的问题，请参考以下文章

妯℃澘璁捐鏃剁編宸ョ殑甯哥敤鎿嶄綔鏂瑰紡

65.django涓璫srftoken璺ㄧ珯璇锋眰浼€犵殑鍑犵鏂瑰紡

缁ф壙涓殑this

Android寮€鍙戣皟鐢╳ebservice鏂瑰紡涔嬩竴

Docker闀滃儚涓庡埗浣滅殑涓夌鏂瑰紡

Mac涓畨瑁卋rew鏈€绠€鍗曠殑鏂瑰紡