ฉันใช้ babel6 และสำหรับโครงการสัตว์เลี้ยงของฉันฉันกำลังสร้างกระดาษห่อหุ้มสำหรับ XMLHttpRequest สำหรับวิธีการที่ฉันสามารถใช้ได้:
open = (method, url, something) => {
return this.xhr.open(method, url, something);
}
แต่สำหรับฟังก์ชันลูกศรคุณสมบัติไม่ทำงาน
งานนี้:
get status() { return this.xhr.status; }
แต่ฉันไม่สามารถใช้
get status = () => this.xhr.status;
นี่คือเจตนา?
getเป็นส่วนหนึ่งของอ็อบเจ็กต์ลิเทอรัลหรือนิยามคลาสการกำหนดตัวแปรไม่ใช่ ทำไมคุณถึงคิดว่ามันควรจะทำงานเหมือนกัน?
status => this.xhr.status(ไวยากรณ์ c # 7) หรืออาจget status() => this.xhr.statusจะเป็นน้ำตาลทางไวยากรณ์ที่ยอดเยี่ยมสำหรับการอ่านง่าย แต่ Javascript ไม่ใช่ typescript ยังไม่รองรับ
คำตอบ:
ตามไวยากรณ์ ES2015 คุณสมบัติบนตัวอักษรของวัตถุสามารถเป็นหนึ่งในสี่สิ่งเท่านั้น:
PropertyDefinition :
- IdentifierReference
- PropertyName
:AssignmentExpression- MethodDefinition
ประเภทเดียวที่อนุญาตให้นำหน้าgetคือMethodDefinition :
MethodDefinition :
- PropertyName
(StrictFormalParameters){FunctionBody}- GeneratorMethod
getPropertyName(){FunctionBody}setPropertyName ( PropertySetParameterList){FunctionBody}
อย่างที่คุณเห็นgetแบบฟอร์มเป็นไปตามไวยากรณ์ที่ จำกัด มากซึ่งต้องเป็นแบบฟอร์ม
get NAME () { BODY }
get NAME = ...ไวยากรณ์ไม่อนุญาตให้มีฟังก์ชั่นของรูปแบบ
คำตอบที่ได้รับการยอมรับนั้นยอดเยี่ยมมาก จะเป็นการดีที่สุดหากคุณต้องการใช้ไวยากรณ์ของฟังก์ชันปกติแทน"ไวยากรณ์ของฟังก์ชันลูกศร" ที่กะทัดรัด
แต่บางทีคุณอาจชอบฟังก์ชั่นลูกศร บางทีคุณอาจจะใช้ฟังก์ชั่นลูกศรด้วยเหตุผลอื่นที่ไวยากรณ์การทำงานตามปกติไม่สามารถแทนที่ ; คุณอาจต้องการโซลูชันอื่น
ตัวอย่างเช่นฉันสังเกตเห็นการใช้ OP thisคุณอาจต้องการผูกthisศัพท์ aka "non-binding of this" ) และฟังก์ชันลูกศรเหมาะสำหรับการผูกศัพท์นั้น
คุณยังคงสามารถใช้ฟังก์ชันลูกศรกับ getter ผ่านทางObject.definePropertyเทคนิค
{
...
Object.defineProperty(your_obj, 'status', {
get : () => this.xhr.status
});
...
}
ดูกล่าวถึงobject initializationเทคนิค (aka get NAME() {...})ครับdefinePropertyเทคนิค (akaget : ()=>{} ) มีความแตกต่างอย่างมีนัยสำคัญอย่างน้อยหนึ่งข้อโดยdefinePropertyต้องใช้ตัวแปรที่มีอยู่แล้ว:
การกำหนด getter บนวัตถุที่มีอยู่
คือมีObject.definePropertyคุณต้องแน่ใจว่าyour_obj(ในตัวอย่างของฉัน) มีอยู่และจะถูกบันทึกลงตัวแปร (ในขณะที่มีobject-initializationคุณสามารถส่งคืนวัตถุที่แท้จริงในการเริ่มต้นวัตถุของคุณ: {..., get(){ }, ... }) ข้อมูลเพิ่มเติมObject.definePropertyโดยเฉพาะที่นี่
Object.defineProperty(...)ดูเหมือนว่าจะมีการรองรับเบราว์เซอร์ที่เทียบเท่ากับget NAME(){...}ไวยากรณ์ เบราว์เซอร์ที่ทันสมัย IE 9
get status() { return this.xhr.status; }
this ต้องเป็นวัตถุที่คุณget status() { ... }กำหนดไว้ แต่ของฉัน this อาจเป็นอย่างอื่นเนื่องจากความแตกต่างของการผูกศัพท์ใช่ไหม?
thisไม่ใช่สิ่งที่ฉันต้องการในตัวเข้าถึง ( thisประโยชน์การผูกมัดของฟังก์ชันลูกศรดูเหมือนจะเข้ามามีบทบาทเมื่อส่งผ่านฟังก์ชันไปรอบ ๆ เช่นเดียวกับตัวจัดการเหตุการณ์และการเรียกกลับ)
()=>{}สำหรับการเรียกกลับที่ผมผ่านไปสัญญา$http(...).then((promise_result)=> this...}))เช่น ถ้าฉันไม่ใช้ fat-arrow thisจะแสดงถึง global Windowobject ไม่ค่อยมีประโยชน์ แต่ฉันไม่ค่อย (ไม่เคย?) ใช้()=>{}เป็นฟังก์ชันสำหรับ "get accessor" อย่างที่คุณพูด ... อย่างน้อยthisข้างในget()ก็จะแสดงถึงวัตถุที่get()กำหนดไว้ (ซึ่งมีประโยชน์มากกว่าWindowดังนั้นจึงไม่จำเป็นต้องใช้ ฟังก์ชัน fat-arrow!)
definePropertyวิธีการจะเป็นประโยชน์ในการวนลูป ตอนนี้ฉันเพิ่งใช้มันเพื่อแสดงคุณสมบัติบางอย่างของวัตถุที่ถูกแยกออกจากวัตถุที่มีอยู่
(method, url, something) => this.xhr.open(method. url, something)คุณก็สามารถพูดได้