diff --git a/1-js/02-first-steps/03-strict-mode/article.md b/1-js/02-first-steps/03-strict-mode/article.md index d2f7df9fb..04b52b086 100644 --- a/1-js/02-first-steps/03-strict-mode/article.md +++ b/1-js/02-first-steps/03-strict-mode/article.md @@ -1,92 +1,89 @@ -# โหมดใหม่ "use strict" +# โหมดสมัยใหม่, "use strict" -เป็นเวลานานแล้วที่จาวาสคริปต์ออกฟีเจอร์ใหม่ๆโดยไม่มีปัญหาเรื่องความเข้ากันได้ (Compatibility) ถึงจะมีฟีเจอร์ใหม่ๆ แต่ฟีเจอร์เดิมๆก็ยังคงทำงานได้อยู่นั่นเอง +นานมาแล้วที่ JavaScript วิวัฒนาการไปโดยไม่มีปัญหาเรื่องความเข้ากันได้ (compatibility) ฟีเจอร์ใหม่ๆถูกเพิ่มเข้ามาในภาษา ในขณะที่ฟังก์ชั่นที่มีอยู่แล้วไม่มีการเปลี่ยนแปลง -ข้อดีก็คือโค้ดของเรากับโค้ดเมื่อสิบปีที่แล้วก็สามารถทำงานร่วมกันได้ แต่มันมีข้อเสียเพราะตัวผู้สร้างภาษาเอง ก็ดันไปสร้างบาปกำเนิดกับจาวาสคริปต์ด้วย โดยไม่รู้ตัว ดังนั้นเมื่อการหักกับฟีเจอร์เก่าๆแล้ว บาปกำเนิดของจาวาสคริปต์ จึงกลายเป็นคำสาป ชำระล้างไม่ได้ไปตลอดกาล +สิ่งนี้มีข้อดีคือไม่เคยทำให้โค้ดที่มีอยู่แล้วเสียหาย แต่ข้อเสียคือข้อผิดพลาดหรือการตัดสินใจที่ไม่รอบคอบของผู้สร้าง JavaScript จะติดอยู่ในภาษานี่ไปตลอดกาล -จนเวลาล่วงเลยมาถึงปี 2009 มาตรฐานภาษาชุดใหม่เปิดตัว มันคือ ECMAScript5 ที่เพิ่มทั้งฟีเจอร์ใหม่ รวมถึงไปโมฟีเจอร์เก่าๆบางตัวด้วย ผลก็คือ `แหก` นั่นเอง แต่ทางผู้สร้างมาตรฐานชุดนี้ตระหนักในเรื่องนี้ดี เพื่อให้โค้ดเก่าๆทำงานได้ พวกเขาจึงได้ปิดฟีเจอร์โมภาษานี้ไป แต่เราสามารถเปิดตัวโมนี้ได้ผ่านคำสั่ง `"use strict"` +สถานการณ์นี้ยังคงอยู่จนกระทั่งปี 2009 เมื่อ ECMAScript 5 (ES5) มากำกับดูแลสเปคของ JavaScript ทางองค์กรได้เพิ่มฟีเจอร์ใหม่เข้าไปในภาษา และแก้ไขฟีเจอร์ที่มีอยู่บางส่วน และเพื่อรักษาความทำงานของโค้ดเก่า การปรับปรุงส่วนใหญ่โดย ECMAScript จะถูกปิดโดยค่าเริ่มต้น ดังนั้นหากเราต้องการเปิดใช้งานฟีเจอร์และการปรับปรุงใหม่ๆเข้ามา เราจะต้องระบุในสคริปต์อย่างชัดเจนด้วยคำสั่งพิเศษ: `"use strict"` ## "use strict" -ตัวคำสั่งหน้าตาเหมือนสตริง `"use strict"` หรือ `'use strict'` แต่คำสั่นี้จะต้องอยู่บนสุดของสคริปต์คือบรรทัดที่หนึ่ง ทีนี้สคริปต์ทั้งหมดของเราก็ทำงานแบบ "สมัยใหม่ (modern)" +คำสั่งดังกล่าวนี้จะมีลักษณะเหมือนสตริง: `"use strict"` หรือ `"use strict"` เมื่อวางไว้ที่บนสุดของสคริปต์ สคริปต์ทั้งหมดจะทำงานในรูปแบบ "สมัยใหม่" -ดั่งตัวอย่าง: +ตัวอย่างเช่น: ```js "use strict"; -// โค้ดที่เขียนต่อจากนี้จะทำงานแบบจาวาสคริปต์สมัยใหม่ +// โค้ดนี้จะทำงานในแบบสมัยใหม่ ... ``` -เราจะเรียนรู้เรื่องฟังก์ชั่น (วิธีการจัดกลุ่มคำสั่ง) ในไม่ช้า แต่อยากบอกในเบื้องต้นว่า `"use strict"` สามารถวางไว้ที่บรรทัดเริ่มต้นของฟังก์ชั่นได้ เพื่อจะใช้โหมด `"use strict"` แค่ในฟังก์ชั่นนี้เท่านั้น แต่ปกติแล้ว นิยมวางไว้บรรทัดแรกมากกว่าแต่เปิดใช้ทั้งไฟล์สคริปต์ +ไม่ช้าเราจะได้เรียนรู้เรื่องฟังก์ชัน (วิธีการจัดกลุ่มคำสั่ง) ดังนั้นโปรดจงรู้ไว้ว่า `"use strict"` สามารถวางไว้ที่หน้าของฟังก์ชันได้ การกระทำนี้เปิดโหมดสมัยใหม่สำหรับฟังก์ชันตัวนั้นเท่านั้น แต่ปกติเรามักจะวางไว้บนสุดของสคริปต์ +````warn header="เช็คให้แน่ใจว่า \"use strict\" อยู่บนสุดของสคริปต์เสมอ" +โปรดทำให้แน่ใจว่า `"use strict"` อยู่ที่บนสุดของสคริปต์ มิเช่นนั้น โหมดสมัยใหม่อาจจะไม่ถูกเปิดใช้งาน -````warn header="อย่าลืมว่า \"use strict\" ต้องอยู่บรรทัดแรกเสมอ" -อย่าลืมว่า `"use strict"` ต้องอยู่บรรทัดแรกของไฟล์สคริปต์เสมอ ไม่อย่างนั้นโหมดนี้จะไม่ทำงาน - -เช่นตัวอย่างด้านล่าง +โหมดสมัยใหม่ไม่ถูกเปิดใช้งานที่นี่: ```js no-strict alert("some code"); -// ตัวเอนจินจะไม่สนใจ "use strict" ด้านล่าง โหมดนี้จึงไม่ได้ถูกทำงาน +// "use strict" ด้านล่างนี้จะถูกละเลย -- มันต้องอยู่ที่บนสุด "use strict"; -// strict mode จะไม่ทำงาน +// โหมดสมัยใหม่จะไม่ถูกเปิดใข้งาน ``` -หากมีคอมเม้นอยู่เหนือ "use strict" ตัวของ "use strict" ก็จะทำปกติ +เพียงแค่คอมเม้นที่อยู่เหนือ `"use strict"` เท่านั้น ```` -```warn header="ไม่มีทางยกเลิกโหมด `use strict` ได้" -มันไม่มีคำสั่งอย่าง "no use strict" เพื่อได้เอนจินกลับไปทำงานในโหมดเดิมได้ +```warn header="ไม่มีทางปิดโหมดสมัยใหม่จากคำสั่ง `use strict` ได้" +ไม่มีคำสั่งเช่น `"no use strict"` ที่จะคืนสภาพโหมดสมัยเก่ากลับมาได้ -ดังนั้นเมื่อเราเปิดโหมด `use strict` แล้ว เราก็ไม่มีทางปิดมันได้ +เมื่อเราเข้าสู่โหมด "สมัยใหม่" แล้ว มันจะไม่มีทางกลับมาเป็น "สมัยเก่า" อีกต่อไป ``` -## คอนโซลบนเบราเซอร์ +## คอนโซลเบราว์เซอร์ + +เมื่อเราใช้ [คอนโซลนักพัฒนาซอฟต์แวร์ (developer console)](info:devtools) เพื่อรันโค้ด โปรดทราบว่ามันไม่ได้ใช้ `use strict` ตามค่าเริ่มต้น -หากเราใช้[คอนโซลนักพัฒนา](info:devtools) เพื่อรันโค้ด คอนโซลบนเบราเซอร์ปิด `use strict` เอาไว้เป็นค่าเริ่มต้น +บางครั้ง เมื่อ `use strict` จึงทำให้เกิดผลลัพธ์ที่แตกต่างกัน เราจะได้ผลลัพธ์ที่ไม่ถูกต้อง -แล้ว ถ้าอยากใช้ `use strict ในคอนโซลจะทำไงดี +ดังนั้น วิธีการที่จะ `use strict` ในคอนโซลจริงๆคืออย่างไร? -ก่อนอื่น ให้พิมพ์ `use strict` ไว้ก่อนแล้วให้กด `key:Shift+Enter` เพื่อขึ้นบรรทัดใหม่ +แรกเริ่ม เราสามารถลองกด `key:Shift+Enter` เพื่อป้อนคำสั่งหลายบรรทัดและวาง `use strict` ที่ด้านบน เช่น: ```js 'use strict'; -// ...โค้ดของเรา -<อย่าลืมกด Enter เพื่อให้โค้ดทำงาน> +// ...โค้ดเรา + ``` -ฟีเจอร์นี้รับรองบนเบราเซอร์ส่วนใหญ่แล้วอย่าง Chrome และ Firefox +มันทำงานได้ในเบราว์เซอร์ส่วนใหญ่ โดยเฉพาะ Firefox และ Chrome -หากใช้ไม่ได้ นั่นแสดงว่าเรากำลังใช้งานเบราเซอร์ที่เก่าเอามากๆ ดังนั้นเพื่อให้แน่ใจได้ว่า `use strict` จะถูกใช้กับทุกคำสั่งที่เราป้อนลงในคอนโซล ลองทำตามตัวอย่างโค้ดด้านล่างดูสิ +หากไม่ทำงาน เช่นในเบราว์เซอร์เก่า มีวิธีที่ไม่ค่อยสวยเท่าไหร่ แต่ทำให้เบราเซอร์เก่าเปิดใช้งานโหมดสมัยใหม่ได้ `use strict` โดยล้อมมันวางด้วยวงเล็บแบบนี้: ```js (function() { 'use strict'; - // ...ใส่โค้ดที่ต้องการตั้งแต่ตรงนี้... + // ...โค้ดเราที่นี่... })() ``` -## ควรเปิด "use strict" - -คำตอบก็คือควร +## ควรใช้ "use strict" หรือไม่? -ดังนั้นให้เขียน `"use strict"` จนเป็นนิสัยได้เลย แต่ยังมีเกร็ดเล็กน้อยอีกนิดนึง +คำถามนี้อาจดูชัดเจน แต่จริงๆแล้วไม่ได้เช่นนั้น -ใน Modern Javascript ได้สนับสนุน "classes" และ "modules" ซึ่งยังไม่สอนตอนนี้ (แต่เดี๋ยวเข้าใจแน่นอน) ที่อยากจะบอกก็คือ มันเปิด `use strict` โดยอัตโนมัติ ดังนั้นเราไม่ต้องเพิ่ม `"use strict"` ในสคริปต์เลย +มีคำแนะนำมากมายให้เริ่มสคริปต์ด้วย `"use strict"`... แต่เรารู้อะไรน่าสนใจบ้างไหม? -จนถึงตอนนี้ เราก็รู้จักกับ `use strict` ในเบื้องต้นกันแล้ว +JavaScript สมัยใหม่รองรับ "classes" และ "modules" - โครงสร้างภาษาขั้นสูงที่เปิดใช้งาน `use strict` โดยอัตโนมัติ ดังนั้นเราไม่จำเป็นต้องเพิ่มคำสั่ง`"use strict"` หากเราใช้โครงสร้างเหล่านี้ -ในบทภัดไป เราจะเรียนเกี่ยวกับฟีเจอร์ของภาษา เราจะได้เห็นความแตกต่างระหว่าง แบบใช้ `use strict` กับแบบไม่ใช้ มาดูกันว่า `use strict` ช่วยให้เราชีวิตง่ายขึ้นยังไง +**ดังนั้น `"use strict";` จะถูกเติมเข้ามาเอง เมื่อโค้ดเราอยู่ใน "classes" หรือ "modules"** -ทุกตัวอย่างในบทเรียนใช้ `use strict` หมด จะมีอยู่น้อยมากที่เราตั้งใจจะไม่ใช้ +เราได้ทราบเกี่ยวกับ `use strict` โดยทั่วไป -1. คำสั่ง `"use strict"` เป็นคำสั่งสำหรับเอนจินยุค ES5 ซึ่งเอาไว้สลับโหมดระหว่างโหมดปกติกับโหมด `"use strict"` เราจะมาพูดถึงรายละเอียดกันอีกทีในบทถัดไป -2. เปิด strict โหมดง่ายๆเพียงแค่ใส่ `"use strict"` ไว้บนสุดของสคริปต์หรือฟังก์ชัน เมื่อเอนจินอ่านเจอมันจะเปิดโหมดนี้โดยอัตโนมัติ -3. โมเดิร์นเบราเซอร์ รองรับโหมด strict ทั้งหมดแล้ว -4. แนะนำว่าควรเปิด strict โหมดไว้เสมอ +ในบทที่จะถึงนี้ เมื่อเราเรียนรู้ฟีเจอร์ของภาษา เราจะเห็นความแตกต่างระหว่างโหมดใหม่และเก่า โชคดีที่ความแตกต่างไม่ได้มีมากจนทำให้พวกเราต้องปวดหัว +ตัวอย่างทั้งหมดในบทนี้สมมุติว่าอยู่ในโหมดสมัยใหม่ ยกเว้น (เราคิดว่าน้อยมาก) ที่ระบุไว้เป็นอย่างอื่น \ No newline at end of file