JavaScript中class類的介紹

class的概念

一、我們?yōu)槭裁匆玫絚lass類?

因為通過class類來創(chuàng)建對象九孩,使得開發(fā)者不必寫重復的代碼先馆,以達到代碼復用的目的。它基于的邏輯是躺彬,兩個或多個對象的結構功能類似煤墙,可以抽象出一個模板,依照模板復制出多個相似的對象。就像汽車制造商一遍一遍地復用相同的模板來制造大量的汽車車宪拥,我們暫且把class理解為一個模板.
但是為什么我們不用function函數(shù)用來重復使用呢仿野?因為funcion聲明是需要狀態(tài)提升的,而class不是江解,class需要先聲明再使用设预。

二、class類的語法

class Student{
    constructor(name,age,sex){
        this.name = name
        this.age= age
        this.sex = sex
    }

    read(){console.log(this.name+this.age+this.sex)}
}
var Tom =new Student('tom',21,'男')
Tom.read()

Tom是通過類Student實例化出來的對象犁河。對象Tom是按照Student這個模板鳖枕,實例化出來的對象魄梯。實例化出來的對象擁有預先定制好的結構和功能。

2.1 constructor 構造方法

constructor方法是一個特殊的方法宾符,用來創(chuàng)建并初始化一個對象酿秸。在一個class中只能有一個命名為constructor的特殊方法,如果包含多個將會報錯魏烫。

constructor中可以通過super關鍵字辣苏,調(diào)用父類的constructor方法。

2.2 static (靜態(tài)方法)

通過static關鍵字為一個class創(chuàng)建靜態(tài)方法

 class student{
      //靜態(tài)屬性
      static p = 2;
      //構造方法
      constructor(name,age,sex){
          this.name=name
          this.age=age
          this.sex=sex
      }
     //實例方法     dream(){console.log('月薪過萬哄褒。')}
  }
  // 靜態(tài)屬性調(diào)用
  console.log(student.p)
2.3 類的繼承 extends
class A {
     constructor(){
            this.name = 'Marry'
            this.age= 18
        }
    read(){console.log(this.name+this.age)}
}
class B extends A {
    constructor(props) {
        super(props)
    }
    s(){
        console.log(this.name+this.age)
    }
}
var b = new B();
b.s()

當實例 b 調(diào)用 s 方法時稀蟋,b 本身沒有 name和age,會根據(jù)繼承找到A

2.4“this”指向問題

class中的this指向?qū)嵗龝r的對象呐赡。

2.5 super( )關鍵字

關鍵字super用于調(diào)用父類相應的方法退客,這是相較于原型繼承的一個好處

三.總體的寫法

// 創(chuàng)建一個類存放特有的屬性和方法,用來實例對象链嘀。
class Student{
   // 靜態(tài)屬性只屬于Student的屬性
   static s = "180";
   // 靜態(tài)方法只屬于Student的方法
   static m(){
       console.log("靜態(tài)方法")
   }
   // 構造方法
   constructor(props){
       //實例屬性
       this.name=props.name;
       this.age=props.age;
       this.sex=props.sex;
   }
   // 實例方法
   students(){
       console.log(this.name+this.age+this.sex)

   }
}
// 靜態(tài)屬性調(diào)用
console.log(Student.s)
// 實例化對象
var S1 = new Student('tom',21,'男');
// 調(diào)用方法
S1.students()
?著作權歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末萌狂,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子怀泊,更是在濱河造成了極大的恐慌茫藏,老刑警劉巖,帶你破解...
    沈念sama閱讀 217,734評論 6 505
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件霹琼,死亡現(xiàn)場離奇詭異务傲,居然都是意外死亡,警方通過查閱死者的電腦和手機碧囊,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,931評論 3 394
  • 文/潘曉璐 我一進店門树灶,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人糯而,你說我怎么就攤上這事〔淳剑” “怎么了熄驼?”我有些...
    開封第一講書人閱讀 164,133評論 0 354
  • 文/不壞的土叔 我叫張陵,是天一觀的道長烘豹。 經(jīng)常有香客問我瓜贾,道長,這世上最難降的妖魔是什么携悯? 我笑而不...
    開封第一講書人閱讀 58,532評論 1 293
  • 正文 為了忘掉前任祭芦,我火速辦了婚禮,結果婚禮上憔鬼,老公的妹妹穿的比我還像新娘龟劲。我一直安慰自己胃夏,他們只是感情好,可當我...
    茶點故事閱讀 67,585評論 6 392
  • 文/花漫 我一把揭開白布昌跌。 她就那樣靜靜地躺著仰禀,像睡著了一般。 火紅的嫁衣襯著肌膚如雪蚕愤。 梳的紋絲不亂的頭發(fā)上答恶,一...
    開封第一講書人閱讀 51,462評論 1 302
  • 那天,我揣著相機與錄音萍诱,去河邊找鬼悬嗓。 笑死,一個胖子當著我的面吹牛裕坊,可吹牛的內(nèi)容都是我干的烫扼。 我是一名探鬼主播,決...
    沈念sama閱讀 40,262評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼碍庵,長吁一口氣:“原來是場噩夢啊……” “哼映企!你這毒婦竟也來了?” 一聲冷哼從身側響起静浴,我...
    開封第一講書人閱讀 39,153評論 0 276
  • 序言:老撾萬榮一對情侶失蹤堰氓,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后苹享,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體双絮,經(jīng)...
    沈念sama閱讀 45,587評論 1 314
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,792評論 3 336
  • 正文 我和宋清朗相戀三年得问,在試婚紗的時候發(fā)現(xiàn)自己被綠了囤攀。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 39,919評論 1 348
  • 序言:一個原本活蹦亂跳的男人離奇死亡宫纬,死狀恐怖焚挠,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情漓骚,我是刑警寧澤蝌衔,帶...
    沈念sama閱讀 35,635評論 5 345
  • 正文 年R本政府宣布,位于F島的核電站蝌蹂,受9級特大地震影響噩斟,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜孤个,卻給世界環(huán)境...
    茶點故事閱讀 41,237評論 3 329
  • 文/蒙蒙 一剃允、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦斥废、人聲如沸椒楣。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,855評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽撒顿。三九已至,卻和暖如春荚板,著一層夾襖步出監(jiān)牢的瞬間凤壁,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 32,983評論 1 269
  • 我被黑心中介騙來泰國打工跪另, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留拧抖,地道東北人。 一個月前我還...
    沈念sama閱讀 48,048評論 3 370
  • 正文 我出身青樓免绿,卻偏偏與公主長得像唧席,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子嘲驾,可洞房花燭夜當晚...
    茶點故事閱讀 44,864評論 2 354

推薦閱讀更多精彩內(nèi)容

  • Class 學過Java的小伙伴會發(fā)現(xiàn), 這個class和Java里的class基本語法并沒有什么區(qū)別... 下面...
    劉翾閱讀 974評論 2 2
  • Scala與Java的關系 Scala與Java的關系是非常緊密的L视础! 因為Scala是基于Java虛擬機辽故,也就是...
    燈火gg閱讀 3,444評論 1 24
  • 1. ES6 Class 類 ES6 提供了更接近傳統(tǒng)語言的寫法徒仓,引入了 Class(類)這個概念,作為對象的模板...
    時光如劍閱讀 674評論 0 10
  • class的基本用法 概述 JavaScript語言的傳統(tǒng)方法是通過構造函數(shù)誊垢,定義并生成新對象掉弛。下面是一個例子: ...
    呼呼哥閱讀 4,092評論 3 11
  • Class 簡介 類的由來 JavaScript 語言中,生成實例對象的傳統(tǒng)方法是通過構造函數(shù)喂走。下面是一個例子 上...
    五十嵐色葉閱讀 328評論 0 2