สรุปพื้นฐาน Javascript

Javascript คืออะไร

JavaScript เป็น ภาษาสคริปต์เชิงวัตถุ (ที่เรียกกันว่า “สคริปต์” (script) ซึ่งในการสร้างและพัฒนาเว็บไซต์ (ใช่ร่วมกับ HTML) เพื่อให้เว็บไซต์ดูมีการเคลื่อนไหว สามารถตอบสนองผู้ใช้งานได้มากขึ้น

variable ของ javascript

1. var

var ถ้าประกาศไว้ภายใน function จะไม่มีผลกับค่า var ที่อยู่ภายใน global เพราะมันเป็น function scope เช่น

var x = 0;
if(x == 0){
  var x = 2; 
}
console.log(x);
// result จะเท่ากับ 2

2. let

เป็นการประกาศตัวแปรแบบ block scope คือ ถ้าตั้งตัวแปรไว้ใน scope แต่เรียกจากด้านนอกจะไม่สามารถเรียกมาได้ เช่น

let x = 0;
if(x == 0){
  let x = 2; 
}
console.log(x);
// result จะเท่ากับ 0

3. const

เป็นการประกาศตัวแปรแบบ block scope แต่แตกต่างจาก let ที่ไม่สามารถเปลี่ยนค่าได้ แต่สามารถเปลี่ยนค่าใน object ได้

const PI = 3.14;
PI = 2 // PI จะไม่สามารถเปลี่ยนค่าได้
obj = { a : 1 };
obj.a = 2; 
console.log(obj); 
// result จะเท่ากับ { a : 2 }

function array ที่ใช้ใน javascript

1. shift()

จะเอาค่าด้านซ้ายสุดใน array ออก

var list = ["tiger", "cat", "bear", "bird"];
list.shift();
list;
// result ["cat", "bear", bird];

2. pop()

จะเอาค่าด้านขวาสุดใน array ออก

var list = ["tiger", "cat", "bear", "bird"];
list.pop();
list;
// result ["tiger", "cat", "bear"];

3. push()

จะเอาค่าใหม่ที่ใส่ไป ไว้ค่าท้ายสุดใน array

var list = ["tiger", "cat", "bear", "bird"];
list.push("dog");
list;
// result ["tiger", "cat", "bear", "bird", "dog"];

4. concat()

จะเป็นการเชื่อม 2 array เข้าด้วยกัน

var list = ["tiger", "cat", "bear", "bird"];
var newlist = ["bee", "lion"];
var allList = list.concat(newlist);
allList;
// result ["tiger", "cat", "bear", "bird", "bee", "lion"]

5. sort()

จะเรียงค่าใน array ตามตัวอักษร a-z

var list = ["tiger", "cat", "bear", "bird"];
list.sort();
list;
// result ["bear", "bird", "cat", "tiger"]

รูปแบบการประกาศ function ใน javascript

การประกาศใน javascript จะเริ่มต้นด้วย “function” เสมอแล้ว ตามด้วยชื่อของฟังก์ชัน และพารามิเตอร์ในวงเล็บ แล้วท้ายสุดคือเครื่องหมายปีกกา

// ตัวอย่างการประกาศ function
function funcName(param1,param2){
  // การทำงาน
}

อ้างอิง
javascript คืออะไร
พื้นฐาน ES2015 (ES6)