JavaScript Pattern : Constructor Pattern

จากตอนที่แล้ว ยังไม่ได้เขียนเรื่องของ JavaScript DataStructure ต่อเลยครับ ขอมาเขียนเรื่อง Pattern สลับกันไปก่อน

เรื่องแรกวันนี้เป็นเรื่อง Constructor Pattern ครับ ขออธิบายสั้นๆคร่าวๆให้รู้ Concept พอนะครับ ละเอียดกว่านั้นขอไม่พูดถึงก่อน

ใน Object-Oriented Programming Language แบบดั้งเดิมเลยนั้นจะมี Constructor เป็น Special Method ที่จะถูกใช้ในการ Initial Value ต่างๆให้กับ Object หรือ Instance ที่จะถูกสร้างขึ้นมาจาก Class แม่ (ถูก Allocated ลงไปที่ Memory) ใน JavaScript ก็เช่นกันครับ เพราะเกือบทุกอย่างเป็น Object และคนส่วนใหญ่ก็จะให้ความสนใจกับ Constructor ของ Object กัน โดยเราสามารถสร้าง Object ได้ 3 รูปแบบดังนี้

var newObject = {};

var newObject = Object.create(Object.prototype);

var newObject = new Object();

เราลองมาดู Basic Constructor แบบแรกกันครับ

จากโค้ดด้านบนนั้น toString() จะถูก redefined ใหม่ทุกครั้งที่สร้าง Object ตัวใหม่ขึ้น

จึงต้องปรับมาใช้ Pattern นี้ครับคือ Constructor with Prototype ตามรูปด้านล่าง

Function เกือบจะทั้งหมดใน JavaScript นั้นจะมี Object อยู่ตัวนึงครับ คือ "Prototype" object เมื่อเราเรียก JavaScript Constructor เพื่อจะสร้าง Object ใหม่นั้น Properties ทุกอย่างของ Prototype ของ Constructor จะติดไปที่ new Object ด้วย

JavaScript DataStructure & Algorithms : List ADT

ช่วงนี้กระแส Javascript ของปี 2016 มาแรงมากมาย คงจะมีหลายคนที่อยากจะฝึกเขียน Javascript แต่เริ่มต้นไม่ถูก จะฝึกเขียนโปรแกรม ก็ไม่รู้จะเริ่มฝึกจากเขียนอะไร ไม่รู้จะตั้งโจทย์อะไร หรือเขียนไปแล้วไม่รู้จะเอาไปใช้ประโยชน์อะไร นึกภาพไม่ออก

เอางี้ครับ คือการที่เราจะเขียนโปรแกรมภาษาใดภาษาหนึ่งได้อย่างลึกซึ้ง เราต้องรู้จัก Data Structure ของแต่ล่ะภาษากันก่อน และเรียนรู้การเขียน Algorithm ในภาษานั้นๆด้วย เพราะแต่ล่ะภาษาจะมีลักษณะเฉพาะของมันเอง ซึ่งเราควรจะเขียนให้คล่อง โดยใช้ Algoritm นี่แหละครับเป็นโจทย์ของเรา

วันนี้ฝากตัวอย่าง Class List ไว้ก่อน (มันเป็น Class แบบสมมตินะครับ ของจริงต้อง ECMAScript6)  เดี๋ยวจะมาอธิบายอีกทีว่ามันคืออะไร ทำงานยังไง
(ไม่ได้เขียนเรื่อง Javascript ไว้แต่แรก บังเอิญจะทำเป็นข้อมูลเก็บเอาไว้พอดี ไหนๆก็ไหนๆ เอามาลง Blog ซ่ะเลย ฮ่าๆๆ)

Google Maps Markers with Ajax & JQuery ตอนที่ 1

การกำหนดจุด Markers บนแผนที่ Google Maps นั้นหากเราเขียนโดยกำหนดจุดเป็นพอยต์ๆไป โค๊ดมันก็จะดูเยอะมากๆ แล้วถ้าเราเก็บข้อมูลของ Markers ไว้ใน database เวลาเราจะกำหนด Markers นั้นๆลงใน Google Maps เราก็จะต้องให้ server ส่งข้อมูลมาเก็บไว้ที่ฝั่ง client เสียก่อน แล้วลองคิดดูว่าถ้าข้อมูลของ Markers ใน Database มีหลาย categories และมีขนาดใหญ่มากๆ เราก็จะต้องโหลดข้อมูลทั้งหมดลงใน Database ซึ่งเป็นการส่งข้อมูลที่เยอะมากๆ ผมก็เลยทำให้การกำหนดจุด Markers นั้นเป็นแบบ Ajax แทนแบบปกติทั่วไป เพื่อลดการส่งข้อมูลทีละเยอะๆ โดยใช้การส่งข้อมูลในรูปแบบ XML ที่ return ค่ามาจาก server (ในที่นี้ผมใช้ php เป็นภาษาฝั่ง server side) โดยใน database นั้นจะเก็บข้อมูลชื่อของ Point และ Point ต่างๆ แล้วใช้ php เจนโค๊ด (XML Code Generator) ออกมาเป็น XML โดย XML ของผมมีรูปแบบที่ผมกำหนดไว้แบบนี้คับ

markers
  marker id="..."
    name .... /name
    latlng .... /latlng
  /marker
/markers

ส่วนใน php code ผมก็จะมีวิธีการส่งข้อมูลออกมาดังนี้คับ

Socket

ในการส่งข้อมูลจากเครื่องคอมพิวเตอร์หนึ่งไปสู่อีกเครื่องหนึ่งในระบบเครือข่าย โปรแกรมด้านผู้ส่ง (sender) จะต้องนำข้อมูลที่ถูกส่งไปนั้น มาตัดออกเป็นส่วนย่อยๆ แล้วบรรจุลงใน packet แต่ละ packet จะมีส่วนประกอบสองส่วน ส่วนแรกคือ header เป็นข้อมูลเกี่ยวกับ address และ port ของผู้รับและผู้ส่ง รวมทั้งข้อมูลเท่าที่จำเป็นในการนำ packet มาประกอบกันเป็นข้อมูลเดิม อีกส่วนเรียกว่า payload คือข้อมูลย่อยที่จะถูกส่งไปนั้นเอง ผู้เขียนโปรแกรมจะต้องสร้างโปรแกรมทั้งด้านผู้ส่งและผู้รับ ที่ด้านผู้ส่งต้องทราบวิธีการสร้าง packet และส่ง packet ผ่านชั้นของโปรแกรมลงไปสู่ชั้นของตัวกลางเพื่อเดินทางไปในระบบเครือข่าย ที่ด้านผู้รับต้องทราบวิธีรับ packet จากระบบเครือข่าย ขึ้นมาประกอบเป็นลำดับที่ถูกต้อง แล้วจึงดึงข้อมูลออกมา จะเห็นว่าการเขียนโปรแกรมรับส่งข้อมูลผ่านระบบเครือข่ายเป็นเรื่องยุ่งยากมาก และต้องใช้ผู้เชี่ยวชาญในการสร้างโปรแกรมแบบนี้

InetAddress

ใน java.net package มีคลาส InetAddress สำหรับเก็บแสดง IP address ซึ่่งใช้ได้กับทั้ง TCP และ UDP protocols โดยปกติใน instance ของคลาส InetAddress จะมีข้อมูลเกี่ยวกับ IP address และอาจจะมี domain name ของ IP address นั้นด้วยก็ได้ ขึ้นกับว่า instance นั้นถูกสร้างขึ้นโดยมี domain name กำหนดให้หรือไม่ การที่ Java ใช้ InetAddress แทน IP address ในการอ้างอิงถึงเครื่องๆหนึ่ง ก็เพื่อให้โปรแกรมไม่ขึ้นกับ IP address ให้สามารถรองรับจำนวนเครื่องคอมพิวเตอร์ที่เพิ่มมากขึ้น เมื่อถึงเวลานั้นคลาส InetAddress จะถูกเปลี่ยนแปลงให้สนับสนุนมาตรฐานใหม่นั้น โดยที่โปรแกรมของเราไม่ต้องถูกเปลี่ยนแปลง

ในคลาส InetAddress นั้นไม่มี public constructor แต่มี public static factory methods สำหรับสร้าง instance ของคลาส เช่น

public static InetAddress getLocalHost() throws UnkhowHostException;

ซึ่งจะให้ InetAddress ของเครื่องที่ทำงาน หลังจากนั้นอาจจะใช้

public String getHostName();

public String getHostAddress();

Tomcat Http Server and Servlet Container

ปกติแล้ว servlet จะต้องทำงานอยู่ภายใต้ servlet container แต่เวลาเราจะเรียกใช้งาน มักจะเรียนผ่าน http server ดังนั้น servlet container จึงต้องทำงานร่วมกับ http servers โดยที่ http server จะรับ requests มาจาก client ก่อน หากตรวจสอบแล้วเป็นการ request ไปที่ servlet แล้ว server ก็จะส่ง request ต่อไปที่ servlet containner ที่ทำงาน servlet นั้นๆ

โดยทั่วไป servlet containers แบ่งออกเป็น 2 ประเภท ตามความสัมพันธ์กับ http server คือ
1. Standalone Servlet Container เป็น Servlet Container ที่ติดมากับ http server นั้นเลย
2. Add-on Servlet Container เป็นโปรแกรม Servlet Container ที่เราสามารถ plug-in กับ http server ที่ไม่มี servlet container โดยตรง เช่น Tomcat servlet container

ตอนที่ servlets ถูกพัฒนาขึ้นเป็นรุ่น 1.0 นั้น http server ส่วนใหญ่ยังไม่มี servlet container จึงยังไม่สามารถทำงาน servlet ได้ ดังนั้น Sun microsystem จึงต้องสร้าง Java Web Server ออกมาเป็นแม่แบบของ http server ที่มี servlet container แบบ standalone ให้นักพัฒนาโปรแกรมใช้สร้างและทดสอบ servlet รวมท้้งเป็น http server ที่ใช้งานได้จริงด้วย และต่อมาได้พัฒนาโดยโครงการ Jakarta-Tomcat ได้พัฒนา Tomcat ซึ่งเป็น servlet container แม่แบบสำหรับ servlet รุ่น 2.0

Derivation

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

1. นำสัญลักษณ์เริ่มต้น(start symbol) S เป็นจุดเริ่มต้นของการกระจายวากยสัมพันธ์ และกำหนดให้สายสัญลักษณ์บนตัวขวามือของโปรดักชั่น S เป็น "สายอักขระก่อกำเนิด" (สายอักขระก่อกำเนิด อาจประกอบด้วย Terminal Symbol หรือ Non-Terminal Symbol)
2. ดำเนินกิจกรรมกระจายสายอักขระก่อกำเนิด โดยการเลือกโปรดักชั่น A-->aBb ที่สอดคล้องกับสัญลักษณ์ไม่สิ้นสุด A บนสายอักขระก่อกำเนิด เพื่อนำตัวประกอบขวามือของโปรดักชั่นมาแทนที่สัญลักษณ์ A บนสายอักขระก่อกำเนิด
3. ดำเนินกิจกรรมกระจายสายอักขระจนกระทั่งไม่สามารถนำโปรดักชั่นใดมากระจายสายอักขระได้อีก จากนั้นตรวจสอบว่า สายอักขระที่ถูกผลิดตรงกับประโยคที่นำมาตรวจสอบหรือไม่