ข้อมูลเบื้องต้นเกี่ยวกับ JavaScript

ถึงแม้ว่าจะมีชื่อแล้ว JavaScript จะเกี่ยวข้องกับ Java เท่านั้นในขณะที่ 2 ส่วนแบ่งส่วน ความคล้ายคลึงกันของไวยากรณ์ ไวยากรณ์ของ JavaScript ในการพัฒนาครั้งแรกคือ ได้รับแรงบันดาลใจมาจากชุดคำสั่งตามรูปแบบไวยากรณ์ของ Java และใช้ชื่อว่า "LiveScript" เมื่อใด ซึ่งจัดส่งในรุ่นเบต้าของ Netscape Navigator ในปี 1995 ทั้งคู่เพื่อให้สอดคล้องกับ ข้อเสนออีกชื่อหนึ่งของ Netscape และชื่นชมข้อเท็จจริงที่ว่าโปรแกรมนี้เป็นแบบ "สด" ในเบราว์เซอร์ Microsoft ได้เปิดตัว JavaScript ของตนเอง "JScript" หลังจากนั้นไม่นานด้วย Internet Explorer 3.0

Netscape ส่งผลงานระยะแรกนี้ให้กับ Ecma International ซึ่งเป็นองค์กรที่ พัฒนาและเผยแพร่มาตรฐานทางเทคนิคเพื่อทำให้เป็นทางการและลงรายละเอียดว่า เบราว์เซอร์อื่นๆ ควรเข้าใจภาษาสคริปต์ ในปี 1997 Ecma เวอร์ชันสากลเปิดตัว ECMA-262 ซึ่งเป็นมาตรฐานสำหรับการเขียนสคริปต์เวอร์ชันแรก ที่เรียกว่า ECMAScript ECMAScript คือมาตรฐานที่ให้ข้อมูลการสร้าง ของภาษาสคริปต์ที่เจาะจงยิ่งขึ้น เช่น Microsoft ได้พัฒนา ซึ่งตอนนี้ JScript, ActionScript ของ Adobe และ JavaScript เองเลิกใช้งานไปแล้ว

ความแตกต่างนี้มีความสําคัญเมื่อพูดถึงแง่มุมและฟีเจอร์เฉพาะของ JavaScript "ES5" หมายถึง "เวอร์ชัน" เวอร์ชันหลักแรก การเปิดตัว มาตรฐาน ECMAScript ในปี 2009 หลังจากมีการพัฒนาทีละส่วนเป็นเวลาหลายปี "ES6" (หรือ "ES2015") เป็นชื่อย่อสำหรับมาตรฐานที่กำหนดโดย ECMAScript เปิดตัวในปี 2015 ECMAScript ออกเวอร์ชันใหม่หลังจาก ES6 มีการเผยแพร่มาตรฐานทุกปี พร้อมการเปลี่ยนแปลงและการเพิ่มในแต่ละรุ่น ที่เรียกตามปีว่า "ES2016" หรือ "ES2017"

กฎพื้นฐาน

JavaScript จะไม่แปลจากโค้ดที่ผู้ใช้เขียน ซึ่งต่างจากภาษาที่คอมไพล์ ลงในแบบฟอร์มที่เบราว์เซอร์เข้าใจได้ ระบบจะส่งสคริปต์ไปยังเบราว์เซอร์ ควบคู่ไปกับเนื้อหาต่างๆ เช่น มาร์กอัป รูปภาพ และสไตล์ชีต แบบเดียวกับการเขียน ซึ่งก็คือลำดับอักขระ Unicode ที่มนุษย์อ่านได้ แยกวิเคราะห์จากซ้ายไปขวาและบนลงล่าง

เมื่อล่าม JavaScript ได้รับสคริปต์ สคริปต์จะทำงานเป็นลำดับแรก การวิเคราะห์คำศัพท์ แยกวิเคราะห์สตริงอักขระขนาดยาวที่ประกอบกันขึ้นเป็นสคริปต์ มาแปลงเป็นองค์ประกอบอินพุตที่แยกจากกันดังต่อไปนี้

  • โทเค็น
  • จัดรูปแบบอักขระควบคุม
  • เครื่องหมายสิ้นสุดบรรทัด
  • ความคิดเห็น
  • Whitespace (เกือบ หมายถึงแท็บและการเว้นวรรคเสมอ)

ผลลัพธ์ของสคริปต์จะไม่คงอยู่หลังจากโหลดซ้ำหรือออกจาก หน้าปัจจุบัน เว้นแต่คุณจะระบุวิธีการที่ชัดเจนว่าต้องทำอย่างอื่นใน สคริปต์

ในระดับสูง แอปพลิเคชัน JavaScript จะประกอบด้วยคำสั่งและ นิพจน์

คำชี้แจง

คำสั่งคือหน่วยของคำสั่งที่ประกอบด้วยโค้ดอย่างน้อย 1 บรรทัด แสดงถึงการกระทำ เช่น ใช้คําสั่งต่อไปนี้เพื่อกำหนด ค่าไปยังตัวแปรชื่อ myVariable:

let myVariable = 4;

myVariable;
> 4

คำสั่งต้องลงท้ายด้วยเซมิโคลอนจึงตีความได้อย่างถูกต้อง อย่างไรก็ตาม โดยอาจไม่จำเป็นต้องใส่เครื่องหมายเซมิโคลอนเมื่อเขียน JavaScript เสมอไป ฟีเจอร์ที่ชื่อว่า การแทรกเซมิโคลอนอัตโนมัติช่วยให้บรรทัด ตัวแบ่งตามคำสั่งที่สมบูรณ์จะถือเป็นเครื่องหมายเซมิโคลอนหากค่าหายไป เครื่องหมายเซมิโคลอนจะทำให้เกิดข้อผิดพลาด

ASI เป็นการแก้ไขข้อผิดพลาด ไม่ใช่ด้านที่อนุญาตของ JavaScript เพราะ การใช้การแก้ไขข้อผิดพลาดนี้มากเกินไปอาจทำให้เกิดความกำกวมที่จะทำลาย คุณควรลงท้ายทุกคำสั่งด้วยเครื่องหมายเซมิโคลอนด้วยตัวเองเช่นเดิม

บล็อกใบแจ้งยอด

คำสั่งบล็อกจะจัดกลุ่มคำสั่งและการประกาศจำนวนเท่าใดก็ได้ภายในคู่คำสั่ง ของวงเล็บปีกกา ({}) ทำให้คุณสามารถรวมคำสั่งไว้ในที่ที่ JavaScript แต่คาดว่าจะได้รับเพียงรายการเดียว

คุณจะพบข้อความบล็อกบ่อยที่สุดอยู่ข้างๆ ขั้นตอนการควบคุม เช่น if:

if ( x === 2 ) {
  //some behavior;
}

นิพจน์

นิพจน์ คือหน่วยของโค้ดที่ทำให้เกิดค่า จึงสามารถมีค่า ใช้ในทุกที่ที่ควรจะมีค่า 2 + 2 เป็นนิพจน์ที่ส่งผลลัพธ์ ค่า 4:

2 + 2;
> 4

"โอเปอเรเตอร์การจัดกลุ่ม" ซึ่งเป็นคู่วงเล็บที่อยู่ติดกันใช้สำหรับ จัดกลุ่มส่วนต่างๆ ของนิพจน์เพื่อให้แน่ใจว่าส่วนหนึ่งของนิพจน์ ถูกประเมินเป็นหน่วยเดียว เช่น คุณอาจใช้โอเปอเรเตอร์การจัดกลุ่ม เพื่อลบล้างลำดับการดำเนินการทางคณิตศาสตร์ หรือเพื่อปรับปรุงให้อ่านง่ายขึ้นของโค้ด

2 + 2 * 4;
> 10

( 2 + 2 ) * 4;
> 16

let myVariable = ( 2 + 2 );

myVariable;
> 4

การพิมพ์ไม่ดี

JavaScript เป็นภาษาที่พิมพ์เล็กน้อย ซึ่งหมายความว่าไม่จำเป็นต้องมีค่าข้อมูล เพื่อทำเครื่องหมายเป็นประเภทข้อมูลที่เฉพาะเจาะจงอย่างชัดเจน JavaScript สามารถอนุมานประเภทที่ต้องการจาก บริบทของค่าแล้วแปลงค่าเป็นประเภทดังกล่าว กระบวนการนี้เรียกว่า แบบบีบบังคับ

เช่น หากเพิ่มตัวเลขลงในค่าสตริงในภาษาที่พิมพ์อย่างเข้มงวด เช่น Python ผลลัพธ์ที่ได้คือข้อผิดพลาด

>>> "1" + 1
Traceback (most recent call last):
  File "<stdin>", line 1, in <module>
TypeError: cannot concatenate 'str' and 'int' objects

JavaScript จะบังคับให้ค่าตัวเลขเป็นสตริงแทนการส่งคืนข้อผิดพลาด และเชื่อมค่าทั้ง 2 ค่าเข้าด้วยกัน ซึ่งก็คือพฤติกรรมที่น่าจะเป็นที่ต้องการมากที่สุดเมื่อเพิ่ม ค่าใดๆ กับสตริง:

"1" + 1;
> "11"

คุณยังเปลี่ยนประเภทข้อมูลอย่างชัดแจ้งได้อีกด้วย ตัวอย่างต่อไปนี้บังคับให้ ค่าตัวเลข 100 เป็นค่าสตริง "100" โดยใช้ JavaScript ในตัว เมธอด toString:

let myVariable = 100;

typeof myVariable;
> "number"

myVariable = myVariable.toString();
> "100"

typeof myVariable;
> "string"

คำนึงถึงตัวพิมพ์เล็กและตัวพิมพ์ใหญ่

JavaScript จะคำนึงถึงตัวพิมพ์เล็กและตัวพิมพ์ใหญ่ทั้งหมด ซึ่งต่างจาก HTML และ CSS ส่วนใหญ่ ซึ่งหมายความว่าคุณต้องใช้อักษรตัวพิมพ์ใหญ่กับทุกอย่างอย่างสม่ำเสมอ ตั้งแต่ พร็อพเพอร์ตี้และเมธอดที่สร้างไว้ในภาษาของตัวระบุที่คุณกำหนด ตัวคุณเอง

console.log( "Log this." );
> Log this.

console.Log( "Log this too." );
> Uncaught TypeError: console.Log is not a function
const myVariable = 2;

myvariable;
> Uncaught ReferenceError: myvariable is not defined

myVariable;
> 2

เว้นวรรค

JavaScript ไม่คำนึงถึงช่องว่าง ซึ่งหมายความว่าล่ามจะไม่สนใจ จำนวนและประเภท (แท็บหรือช่องว่าง) ของช่องว่างที่ใช้

                     console.log(       "Log this"  );console.log("Log this too");
> "Log this."
> "Log this too."

อย่างไรก็ตาม การปรากฏของช่องว่างอาจมีนัยสำคัญเป็นตัวคั่นระหว่าง โทเค็นคลังศัพท์:

let x;

[โทเค็น: [let] [x] ]

letx;
> Uncaught ReferenceError: letx is not defined

[โทเค็น: [letx] ]

ในกรณีที่ใช้ช่องว่างเพื่อแยกโทเค็นคำศัพท์ที่มีความหมาย โปรแกรมแยกวิเคราะห์ ไม่สนใจจำนวนและประเภทของช่องว่าง:

let           x                             =                           2;

[โทเค็น: [let] [x] [=] [2] ]

การขึ้นบรรทัดก็เช่นเดียวกัน แต่ก็มีบางกรณีที่การขึ้นบรรทัดใหม่ทำได้ ทำให้เกิดปัญหาโดยสิ้นสุดคำชี้แจงก่อนกำหนด)

let x
=
2;

[โทเค็น: [let] [x] [=] [2] ]

ข้อความบางประเภทมักจะอยู่ในบรรทัดเดียว เช่น

let x = 1;
let y = 2;

แม้ว่าข้อความบางรายการมักจะใช้หลายบรรทัด ดังนี้

if ( x == 2 ) {
  //some behavior;
}

อย่างไรก็ตาม กฎเกณฑ์เหล่านี้ก็เพื่อให้อ่านได้ง่าย JavaScript แปลตัวอย่างก่อนหน้านี้ในลักษณะเดียวกับตัวอย่างต่อไปนี้

let x=1;let y=2;
if(x==2){}

ด้วยเหตุนี้ กระบวนการอัตโนมัติที่ลบช่องว่างที่ไม่จำเป็นออกจาก ไฟล์สคริปต์เพื่อลดขนาดการโอนเป็นขั้นตอนทั่วไปในการเตรียม JavaScript สำหรับสภาพแวดล้อมการใช้งานจริง ควบคู่ไปกับการเพิ่มประสิทธิภาพอื่นๆ อีก

การใช้อักขระช่องว่างใน JavaScript ส่วนใหญ่แล้วเป็นเรื่องของการเขียนและ ค่ากำหนดเครื่องมือบำรุงรักษา โครงการ JavaScript ที่มีนักพัฒนาหลายราย โค้ดที่มีส่วนร่วมมักแนะนำหรือบังคับใช้ข้อกำหนดเกี่ยวกับช่องว่างบางอย่างเพื่อ ตรวจสอบให้แน่ใจว่าการจัดรูปแบบโค้ดสอดคล้องกัน เช่น การใช้แท็บหรือการเว้นวรรคเพื่อ เยื้องคำสั่งที่ซ้อนกัน:

let myVariable = 10;

if ( typeof myVariable === "number" ) {
    console.log( "This variable is a number." );
    if( myVariable > 5 ) {
     console.log( "This variable is greater than five." );
    }
}

> "This variable is a number."
> "This variable is greater than five."

ตรวจสอบความเข้าใจ

นิพจน์คืออะไร

หน่วยของโค้ดที่ทำให้เกิดค่า
กลุ่มของคำชี้แจงและการประกาศ
ความคิดเห็นที่อธิบายหน้าที่ของโค้ด

JavaScript จะคำนึงถึงตัวพิมพ์เล็กและตัวพิมพ์ใหญ่

จริง
เท็จ