[JS] Coffee script โค้ดสั้นอ่านง่ายใช้ได้กับทุก lib ep 1

coffee-script-logo

อ่า … วันนี้จะมาแชร์เกี่ยวกับเรื่อง Programming บ้างอะไรบ้าง หลังจากเขียนเกี่ยวกับด้านอื่นซะเยอะ วันนี้อยากแชร์ด้าน Javascript นั่นคือ Coffee script ไม่ได้เป็นภาษาใหม่แต่ว่ากันง่ายๆคือมันมาช่วย compile ภาษา Javascript ( ต่อไปขอเรียก JS ) ให้ เขียนง่าย อ่านง่าย และ maintain ง่าย ว้าว !! สุดยอดไปเลยลวกเพี้ยก เราไปดูกันเลย !!!!

สิ่งที่ต้องเตรียม

คุณต้องลงตัว compile หรือเอาง่ายๆว่าตัวที่จะทำการแปลงภาษา .coffee นั้นมาเป็นตัว .js นั่นเองโดยต่อไปคุณก็ไม่ต้องเขียนไฟล์ .js หากรัน .coffee เสร็จก็สามารถเอาไปใช้ได้เลยครับ โดยคุณก็ทำการ install คำสั่งสำหรับให้คอมของเรารู้จักเจ้าไฟล์ .coffee กันก่อนครับ

โดยถ้าหากคุณลง node.js แล้วให้ทำการใช้ npm ในการเรียก install เจ้า coffee-script ได้เลยครับโดยให้คุณพิมพ์ว่า

npm install -g coffee-script

หลังจากลงแล้ววิธีเช็คว่าคอมเราจะรู้จักคำสั่งสำหรับแปลงไฟล์ .coffee ไปเป็น .js ให้คุณลองพิมพ์ว่า

coffee -v

หากไม่มีการผิดพลาดแต่อย่างใดระบบจะทำการแจ้งเวอร์ชั่นของ coffee-script ( ณ ขณะที่เขียนบทความนี้คือเวอร์ชั่น 1.6.3 )

เท่านี้การเตรียมความพร้อมของคอมเราก็โอเคแหละ !

วิธีใช้

เมื่อกายพร้อม ใจพร้อม คอมพร้อม เราก็คงทำได้ ( มั้ง ) ฮาๆ ทำได้ๆ โดยต่อไปคุณก็ลองทำการเขียนไฟล์ .coffee มาลองของกันครับผมสร้างไฟล์ชื่อว่า test.coffee ขึ้นมาโดยมีการเขียนโค้ดไว้อย่างนี้ครับ

# Functions:
square = (x) -> x * x

save ไฟล์ไว้ตรงไหนก็อย่าลืมแล้วกันครับเพราะเราต้องสั่งคำสั่งไปรันตัวไฟล์นั้น ให้คุณทำการพิมพ์ command line เข้าไปยัง folder ที่เราทำการ save ไว้ครับแล้วลองพิมพ์ตามนี้ดูครับ

coffee -c test.coffee

คุณจะเห็นว่ามีไฟล์ตัวใหม่ถูกสร้างขึ้น ตามตัวอย่างคือ test.js โดยในไฟล์ test.js จะเป็นอย่างนี้ครับ

// Generated by CoffeeScript 1.6.3
(function() {
  var square;

  square = function(x) {
    return x * x;
  };

}).call(this);

และยังสามารถเอาไปใช้ร่วมกับพวก jQuery ตัวฮิตได้อีกด้วยนะครับ ว้าว !!! แต่ไว้คราวหน้านะจะมาแสดงให้ดูว่ามันดียังไงอย่างไรวันนี้เอาแค่น้ำจิ้มไปก่อน อิอิ หากคุณลองทำตามแล้วมีข้อสงสัยสามารถถามได้โดย comment ด้านล่างครับ

หากใครใจร้อนรอตอนหน้าไม่ไหว คุณสามารถเข้าไปศึกษาก่อนได้ที่ //coffeescript.org/

ฝากข้อคิดเห็น

This site uses Akismet to reduce spam. Learn how your comment data is processed.