js疑難雜癥

JS的類型

1.基本類型有: String、Number、Boolean、Undefined、Null
2.復(fù)雜類型有:Function、RegExp、Array、Object、Date、Error
3.全局?jǐn)?shù)據(jù)類型:Math

JS閉包

閉包簡(jiǎn)單的說(shuō)就是一個(gè)函數(shù)能訪問(wèn)外部函數(shù)的變量,這就是閉包,比如說(shuō):

function a(x){
       var str=3;
      function b(y){
          console.log(x+y+str);
     }
}

要理解閉包,首先必須理解Javascript特殊的變量作用域。變量的作用域無(wú)非就是兩種: 全局變量和局部變量;js中的特殊就在于它們兩個(gè)內(nèi)部的函數(shù)是可以訪問(wèn)外部全局變量的,但是外部是無(wú)法訪問(wèn)函數(shù)內(nèi)的局部變量的比如:

//訪問(wèn)外部函數(shù)
var str = 123;
function test(){
  console.log(str)
}
test()//結(jié)果為 123
-----------
//訪問(wèn)內(nèi)部函數(shù)
function test2(){
  var str2 = 234
}
test2();
console.log(str2)//報(bào)錯(cuò)‘str2 is not defined’

注意 :在訪問(wèn)內(nèi)部函數(shù)的時(shí)候 如果申明變量沒(méi)有使用 var 或者 let(ES6語(yǔ)法) 申明 ,js會(huì)認(rèn)為這是一個(gè)全局變量,所以可以直接訪問(wèn)比如:

function test3(){
  str3 = 234
}
test3();
console.log(str3)//結(jié)果為 234

現(xiàn)實(shí)中的各種需求有時(shí)候也不講道理的,可能你就真的需要去訪問(wèn)閉包里面的函數(shù)來(lái)達(dá)到你想要的效果,這時(shí)也難不住我們各路大神,比如:

function fn1(){
  var numb = 8899;
  function fn2(){
        console.log(numb)
    }
  return fn2
}
var fn3 = fn1();
fn3()

上面的函數(shù)運(yùn)行時(shí)fn3()的結(jié)果就是 8899; 運(yùn)用閉包的函數(shù)特點(diǎn),可以訪問(wèn)父級(jí)函數(shù)的值, 當(dāng)運(yùn)行fn3的時(shí)候相當(dāng)于運(yùn)行了fn1,fn2可以直接獲取fn1的局部變量,然后fn1直接返回fn2的值,這樣當(dāng)運(yùn)行fn3的時(shí)候就得到了numb的值了

為什么會(huì)這樣呢?原因就在于f1是f2的父函數(shù),而f2被賦給了一個(gè)全局變量,這導(dǎo)致f2始終在內(nèi)存中,而f2的存在依賴于f1,因此f1也始終在內(nèi)存中,不會(huì)在調(diào)用結(jié)束后,被垃圾回收機(jī)制(garbage collection)回收;
參考:http://www.jb51.net/article/24101.htm
什么是閉包:
當(dāng)內(nèi)部函數(shù) 在定義它的作用域 的外部 被引用時(shí),就創(chuàng)建了該內(nèi)部函數(shù)的閉包 ,如果內(nèi)部函數(shù)引用了位于外部函數(shù)的變量,當(dāng)外部函數(shù)調(diào)用完畢后,這些變量在內(nèi)存不會(huì)被 釋放,因?yàn)殚]包需要它們.

標(biāo)志性的閉包函數(shù)題:

var  str = '全局變量';
var Fn = {
    str:'局部變量',
    getStr: function(){
      return function(){
        return this.str
      }
  }
}
console.log(Fn.getStr()())//結(jié)果為 ’全局變量‘

js函數(shù)繼承

參考鏈接:https://www.zhihu.com/question/41466747/answer/132562725
1.原型繼承
比如:

function a(name){
  this.name = name
}
a.prototype.consName = function(){
  console.log(this.name)
}
function b(age){
  this.age = age
}

 b.prototype = new a('hh')
var c = new b(12)
console.log(c.name)//結(jié)果'hh'
console.log(c.age)//結(jié)果為12
c.conName()//結(jié)果為hh

這樣b通過(guò)原型繼承了a,在new b的時(shí)候,c中有個(gè)隱藏的屬性__proto__指向構(gòu)造函數(shù)的prototype對(duì)象,在這里是a對(duì)象實(shí)例,a對(duì)象里面也有一個(gè)隱藏的屬性__proto__,指向a構(gòu)造函數(shù)的prototype對(duì)象,這個(gè)對(duì)象里面又有一個(gè)__proto__指向Objectprototype

這種方式有2個(gè)缺點(diǎn),第一個(gè)缺點(diǎn)是所有子類共享父類實(shí)例,如果某一個(gè)子類修改了父類,其他的子類在繼承的時(shí)候,會(huì)造成意想不到的后果。第二個(gè)缺點(diǎn)是在構(gòu)造子類實(shí)例的時(shí)候,不能給父類傳遞參數(shù)。

2.構(gòu)造函數(shù)繼承

function a(name){
  this.name = name
}
function b(age,name){
  this.age = age;
  a.call(this,name)
}
var c = new b(12,'hha')
c.age//結(jié)果為12
c.name//結(jié)果為hha
注意,在確定需要將(call())a對(duì)象給b時(shí), b()的參數(shù)必須要帶上,否則會(huì)顯示為空,或者你訪問(wèn)一個(gè)不存在的參數(shù)會(huì)顯示未定義

采用這種方式繼承是把a(bǔ)中的屬性加到this上面,這樣name相當(dāng)于就是b的屬性。這種方法的缺點(diǎn)是父類的prototype中的函數(shù)不能復(fù)用。

js執(zhí)行順序

js中國(guó) 函數(shù)(function)的優(yōu)先級(jí)要高于var變量申明;
例如:

var name = 'hello';
(function(){
  if(typeof name === 'undefined'){
    console.log('123'+name)
}else{
  console.log('234'+name)  
}
})()
結(jié)果為:234hello
var name = 'hello';
(function(){
  if(typeof name === 'undefined'){
    var name = 'world';
    console.log('123'+name)
}else{
  console.log('234'+name)  
}
})()
結(jié)果為 :123world;

注意: 一般函數(shù)內(nèi)部 使用變量會(huì)優(yōu)先使用函數(shù)內(nèi)部(相同于全局變量名稱)的局部變量,
所以情況一 沒(méi)有局部變量,自執(zhí)行函數(shù)會(huì)直接使用 全局變量 ,而全局變量namehello;所以結(jié)果為234hello;
情況二 自執(zhí)行函數(shù)執(zhí)行的時(shí)候 name值未申明所以 是未定義,結(jié)果為123world

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 閉包(closure)是Javascript語(yǔ)言的一個(gè)難點(diǎn),也是它的特色,很多高級(jí)應(yīng)用都要依靠閉包實(shí)現(xiàn)。 一、變量...
    zock閱讀 1,118評(píng)論 2 6
  • 大家好,我是IT修真院北京分院25期的學(xué)員,一枚正直純潔善良的web前端程序員 今天給大家分享一下,修真院官網(wǎng)js...
    be684ac78b0c閱讀 351評(píng)論 0 0
  • ● 閉包基礎(chǔ) ● 閉包作用 ● 閉包經(jīng)典例子 ● 閉包應(yīng)用 ● 閉包缺點(diǎn) ● 參考資料 1、閉包基礎(chǔ) 作用域和作...
    lzyuan閱讀 1,033評(píng)論 0 0
  • 我先后在A、B兩家公司工作,由于這兩家公司同屬一個(gè)行業(yè),創(chuàng)業(yè)時(shí)間差不多,且公司風(fēng)格迥異,使我有極大的興趣觀察思考兩...
    Helus閱讀 1,013評(píng)論 0 3
  • 又是新的一年,開(kāi)始工作的時(shí)候,每個(gè)人想必都給自己定下了很多的小目標(biāo),為了是讓自己有更多奮斗的方向,但是每個(gè)人的運(yùn)勢(shì)...
    霓繁花閱讀 289評(píng)論 0 0

友情鏈接更多精彩內(nèi)容