是嚴格模式。 es6類別和模組的內部,預設就是嚴格模式,所以不需要使用「use strict」指定運作模式;只要程式碼寫在類別或模組之中,就只有嚴格模式可用。考慮到未來所有的程式碼,其實都是運行在模組之中,所以ES6實際上把整個語言升級到了嚴格模式。
本教學操作環境:windows7系統、ECMAScript 6版、Dell G3電腦。
es6的Class類別詳解
#class基本語法
JavaScript 語言中,產生實例物件的傳統方法是透過建構函式和原型的組合模式。ES6 提供了更接近傳統語言(java)的寫法,引入了Class(類別)這個概念,作為物件的模板。透過class關鍵字,可以定義類別。
class point{ constructor(x,y){ this.x=x; this.y=y; } play(){ console.log("我会玩"); } }
ES6 的class可以看作只是一個語法糖,它的絕大部分功能,ES5 都可以做到,新的class寫法只是讓物件原型的寫法更加清晰、更像物件導向程式設計的文法而已。
註:「語法糖」:是由英國電腦科學家彼得·約翰·蘭達(Peter J. Landin)發明的術語,指電腦語言中添加的某種語法,這種語法對語言的功能並沒有影響,但更方便程式設計師使用。
ES6 的class與ES5寫法的幾個核心注意點: ES5 的建構子Point,對應 ES6 的Point類別的建構方法。 類別的所有方法都定義在類別的prototype屬性上面。 定義「類別」的方法的時候,前面不需要加上function這個關鍵字,直接把函數定義放進去了就可以了 方法之間不需要逗號分隔,加了會報錯 ES6的class使用方法與ES5的建構子一模一樣
//类的所有方法都定义在类的prototype属性上面。 class piont{ constructor(){ // } play(){ } } //上述代码等价于 point.prototype={ constructor() { }, play(){ }; } //在类的实例上面调用方法,其实就是调用原型上的方法。 class Ba{ // } let b=new Ba(); b.constructor===Ba.prototype.constructor//true
另外:ES5 的建構子Point,對應 ES6 的Point類別的建構方法。
由於類別的方法都定義在prototype物件上面,所以類別的新方法可以加入prototype物件上面。 Object.assign方法可以很方便地一次向類別新增多個方法。
class ponit{ constructor(){ } } Object.assign(Point.prototype,{ play(){ }; }) //Class直接定义的方法之间不需要逗号分隔,加了会报错. 但是这里是Object.assign的方法格式, 这里面需要往Point.prototype里面添加的方法就需要符合对象的默认格式
類別的內部所有定義的方法,都是不可列舉的(non-enumerable)。透過Object.assign方法往類別的原型上新增的方法,constructor不可枚舉, 其他的可以枚舉
Class的基本語法之constructor
constructor方法是類別的預設方法,透過new指令產生物件實例時,自動呼叫該方法。一個類別必須有constructor方法,如果沒有明確定義,一個空的constructor方法會被預設為添加。
constructor方法預設回傳實例物件(即this),完全可以指定傳回另外一個物件 (得是在創造class時就定義設定的, 在創造完class後,透過Object.assign的方式是沒法改變建構子的回傳值的).
Class的基本語法之類別的調用方式
類別必須使用new調用,否則會報錯。這是它跟普通建構函式 ( 普通建構函式完全可以當做普通函式使用 ) 的一個主要區別,後者不用new也可以執行。
Class的基本語法之getter和setter
與ES5 一樣,在「類別」的內部可以使用get和set關鍵字,對某個屬性設定存值函數和取值函數,攔截該屬性的存取行為。
class demo{ constructor(age){ this.age=agie; this._age=age; } get age(){ return this._age; } set age(value){ this._age=value; console.log("年龄"+value); } } let kevin=new demo(9); kevin.age=18; console.log(kevin.age);
Class的基本語法之類的屬性名稱
在上面程式碼中, Square類別的方法名稱getArea,是從表達式得到的。
Class的基本語法的特別注意點
(1)嚴格模式
類別和模組的內部,預設就是嚴格模式,所以不需要使用use strict指定運行模式。只要你的程式碼寫在類別或模組之中,就只有嚴格模式可用。考慮到未來所有的程式碼,其實都是運行在模組之中,所以 ES6 實際上把整個語言升級到了嚴格模式。
(2)不存在提升
new foo(); class foo{};
上面程式碼中,Foo類別使用在前,定義在後,這樣會報錯,因為ES6 不會把類別的宣告提升到程式碼頭部。
(3)name 屬性
class point{ } point.name//point
由於本質上,ES6 的類別只是 ES5 的建構子的一層包裝,所以函數的許多特性都被Class繼承,包括name屬性。
(4)this 的指向
類別的方法內部如果含有this,它預設指向類別的實例。但是,必須非常小心,一旦單獨使用該方法,很可能會報錯。
printName方法中的this,默认指向Logger类的实例。但是,如果将这个方法提取出来单独使用,this会指向该方法运行时所在的环境(由于 class 内部是严格模式,所以 this 实际指向的是undefined),从而导致找不到print方法而报错。
解决办法:
一个比较简单的解决方法是,在构造方法中绑定this,这样就不会找不到print方法了。
另一种解决方法是使用箭头函数。箭头函数位于构造函数内部,它的定义生效的时候,是在构造函数执行的时候。这时,箭头函数所在的运行环境,肯定是实例对象,所以this会总是指向实例对象。
class Logger{ constructor(){ this.printName=this.printName.bind(this); //但是请注意bind之后返回的函数里面的this就永久锁死了问题:!!! !!! 坚决别用 } } //箭头函数 class Obj{ constructor(){ this.getThis=()=>this; } } let o=new Obj(); o.getThis()===o//true
Class的静态属性和方法
类相当于实例的原型,所有在类中定义的方法,都会被实例继承。如果在一个方法前,加上static关键字,就表示该方法不会被实例继承,而是直接通过类来调用,这就称为“静态方法”。
class Person{ static sum=0; constructor(){ this.add(); } add(){ Person.sum++; } } let kaiwen=new Person(); console.log("当前的聊天室人数为:"+Person.sum); //作用:当没有实例化的时候,我们可以通过静态的属性和方法去获取一些信息 // 注意,如果静态方法包含this关键字,这个this指的是类,而不是实例。静态方法可以与非静态方法重名。
父类的静态方法,可以被子类继承静态方法也是可以从super对象上调用的。
class Person{ constructor(name){ this.name=name; this.sex="男"; } } class Student extends Person{ constructor(name,age){ super(name); this.age=age; } } let s=new Student("张三",11); console.log(s.name); console.log(s.age); console.log(s.sex);
Class的私有方法和私有属性
私有方法和私有属性:是只能在类的内部访问的方法和属性,外部不能访问。 这是常见需求,有利于代码的封装,但 ES6 不提供,只能通过变通方法模拟实现。
_bar方法前面的下划线,表示这是一个只限于内部使用的私有方法。但是,这种命名是不保险的,在类的外部,还是可以调用到这个方法
下面代码中的写法不仅可以写私有属性,还可以用来写私有方法
class Cat{ #eyes="眼睛"; static pai(){ console.log("凯文"); } say(){ Cat.pai(); console.log("猫有一双大大的"+this.#eyes); } } let kate=new Cat(); kate.say();
私有属性也可以设置 getter 和 setter 方法。
私有属性不限于从this引用,只要是在类的内部,实例也可以引用私有属性。
构造函数的新属性
ES6 为new命令引入了一个new.target属性,该属性一般用在构造函数之中,返回new命令作用于的那个构造函数。如果构造函数不是通过new命令调用的,new.target会返回undefined,因此这个属性可以用来确定构造函数是怎么调用的。
私有属性也可以设置 getter 和 setter 方法。
私有属性不限于从this引用,只要是在类的内部,实例也可以引用私有属性。
【相关推荐:javascript视频教程、编程视频】
以上是es6的class是嚴格模式嗎的詳細內容。更多資訊請關注PHP中文網其他相關文章!

useState允許在函數組件中添加狀態,是因為它消除了類組件與函數組件之間的障礙,使後者同樣強大。使用useState的步驟包括:1)導入useState鉤子,2)初始化狀態,3)使用狀態和更新函數。

React的視圖關注性通過引入額外工具和模式來管理複雜應用狀態。 1)React本身不處理狀態管理,專注於將狀態映射到視圖。 2)複雜應用需使用如Redux、MobX或ContextAPI來解耦狀態,使管理更結構化和可預測。

IntegratingReactwithotherlibrariesandframeworkscanenhanceapplicationcapabilitiesbyleveragingdifferenttools'strengths.BenefitsincludestreamlinedstatemanagementwithReduxandrobustbackendintegrationwithDjango,butchallengesinvolveincreasedcomplexity,perfo

TomakeReactapplicationsmoreaccessible,followthesesteps:1)UsesemanticHTMLelementsinJSXforbetternavigationandSEO.2)Implementfocusmanagementforkeyboardusers,especiallyinmodals.3)UtilizeReacthookslikeuseEffecttomanagedynamiccontentchangesandARIAliveregio

React應用的SEO可以通過以下方法解決:1.實施服務器端渲染(SSR),如使用Next.js;2.使用動態渲染,如通過Prerender.io或Puppeteer預渲染頁面;3.優化應用性能,利用Lighthouse進行性能審計。

React'sstrongCommunityAndecoSystemoffernumerBeneFits:1)age awealthoflibrariesandgithub; 2)AwealthoflibrariesandTools,sustasuicomponentLibontlibemontLibrariesLikeChakaAkraUii; 3)

ReactNativeischosenformobiledevelopmentbecauseitallowsdeveloperstowritecodeonceanddeployitonmultipleplatforms,reducingdevelopmenttimeandcosts.Itoffersnear-nativeperformance,athrivingcommunity,andleveragesexistingwebdevelopmentskills.KeytomasteringRea

在React中正確更新useState()狀態需要理解狀態管理的細節。 1)使用函數式更新來處理異步更新。 2)創建新狀態對像或數組來避免直接修改狀態。 3)使用單一狀態對像管理複雜表單。 4)使用防抖技術優化性能。這些方法能幫助開發者避免常見問題,編寫更robust的React應用。


熱AI工具

Undresser.AI Undress
人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover
用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool
免費脫衣圖片

Clothoff.io
AI脫衣器

Video Face Swap
使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱門文章

熱工具

SAP NetWeaver Server Adapter for Eclipse
將Eclipse與SAP NetWeaver應用伺服器整合。

MinGW - Minimalist GNU for Windows
這個專案正在遷移到osdn.net/projects/mingw的過程中,你可以繼續在那裡關注我們。 MinGW:GNU編譯器集合(GCC)的本機Windows移植版本,可自由分發的導入函式庫和用於建置本機Windows應用程式的頭檔;包括對MSVC執行時間的擴展,以支援C99功能。 MinGW的所有軟體都可以在64位元Windows平台上運作。

VSCode Windows 64位元 下載
微軟推出的免費、功能強大的一款IDE編輯器

禪工作室 13.0.1
強大的PHP整合開發環境

SublimeText3 英文版
推薦:為Win版本,支援程式碼提示!