Skip to content

Tag: javascript

Published July 27, 2017

Stub JavaScript ES6 Class method ด้วย Sinon

ใครที่เขียน Unit test สำหรับ JavaScript, Node.js น่าจะรู้จัก Sinon เป็นอย่างดี เพราะเป็นไลบรารี่สำหรับสร้าง mock, stub จำลองการทำงานของ service ภายนอกที่นิยมมากตัวหนึ่ง

เดิมที JavaScript นั้นไม่มีแนวคิดเรื่อง class เป็นแค่ function หนึ่งเท่านั้น แต่นับตั้งแต่ ES2015 หรือ ES6 เป็นต้นมานั้นมี class ให้ใช้แล้ว (ถึงจะแบบถูๆ ไถๆ ก็เถอะ) แต่ปัญหาที่พบคือ Sinon รุ่นเก่าๆ มันใช้กับ class ไม่ได้เพราะไม่ได้อัปเดตตามมาตรฐาน ES6

แต่ตอนนี้ Sinon v2.4.1 (ณ วันที่เขียนวันนี้นะ จริงๆ ตั้งแต่รุ่น 2 เป็นต้นมาอาจจะใช้ได้แล้ว) นั้นใช้กับ class ได้แล้ว! จะว่ารองรับตรงๆ เลยก็ไม่เชิง คือมันเป็น work around ที่หน้าตา JavaScript มากๆ

อ่านเนื้อหาทั้งหมดStub JavaScript ES6 Class method ด้วย Sinon
Published October 1, 2015

ใช้งาน Promise ใน Node.js ด้วย Bluebird

ทำไมควรใช้ Promise? ทำไมถึงควรใช้ Bluebird?

โพสต์ที่แล้วผมแนะนำ lib สำหรับจัดการ control flow ของ Node.js ไปคือ Async และ Bluebird ซึ่ง Async ทุกคนที่เขียน Node.js คงคุ้นเคยกันดีเพราะเป็นสไตล์ callback pattern แต่ Bluebird อาจจะยังไม่คุ้นเคยกันเพราะใช้ Promise pattern หรืออาจจะใช้กันเป็นปกติอยู่แล้วก็ไม่รู้ แต่ผมไม่สนใจครับ โพสต์นี้ผมจะมาสอนจระเข้ว่ายน้ำ (นี่แน่ะ!)

Promise ที่เป็น built-in ฟีเจอร์ของ ES6 ถึงจะสะดวกแต่ส่วนตัวผมมองว่ามันก็ยังไม่ค่อยสะดวกเท่าไหร่ถ้ามีการใช้งานในรูปแบบที่ซับซ้อนขึ้น เช่น การจัดการกับ Promise array หรือ Promise Map เพราะ class Promise ของ ES6 เองเป็น class พื้นฐานฟีเจอร์จึงน้อย Bluebird เลยสะดวกกว่า

อ่านเนื้อหาทั้งหมดใช้งาน Promise ใน Node.js ด้วย Bluebird
Published May 16, 2015

Javascript และ NodeJS วน loop แบบมี delay ยังไงนะ?

เนื่องจาก Javascript และ NodeJS (จริงๆ ก็ภาษาเดียวกัน) ไม่มี function สำหรับการทำ delay หรือ sleep มาให้เพราะถูกออกแบบมาให้ทำงานบนเบราว์เซอร์แต่แรกจึงมีแค่ setTimeout() และ setInterval() เท่านั้นซึ่งก็เป็น callback based ทั้งคู่ ถ้าใช้งานปกติทั่วไปมันให้ผลเหมือนกับ function delay หรือ sleep ในภาษาอื่นครับ แต่ถ้าใช้ใน loop จะไม่ให้ผลอย่างนั้น

อ่านเนื้อหาทั้งหมดJavascript และ NodeJS วน loop แบบมี delay ยังไงนะ?
Published March 31, 2014

เปรียบเทียบความเร็วในการ render ของ template engine

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

ที่เคลมว่าเร็วที่สุดเขาก็ไม่ได้อ้างลอยๆ นะครับมี benchmark ทดสอบให้ดูด้วย (เลื่อนไปดูข้างล่าง) และในเว็บก็มีให้ลองใช้งานด้วย ผมดูแล้วเจอฟีเจอร์ที่น่าสนใจคือมันสามารถ include ส่วนอื่นมาต่อกันได้เหมือน PHP เลย

อ่านเนื้อหาทั้งหมดเปรียบเทียบความเร็วในการ render ของ template engine
Published March 30, 2014

Handlebars template engine ที่น่าใช้อีกตัว

เมื่อนานมาแล้วผมเอา Mustache javascript template engine มาใช้แล้วพบว่ามันก็เป็น “Logic less” template engine จริงๆ เจอข้อเสียอยู่ 2 อย่างคือ

  1. ใช้กับ data model ที่เป็น JSON แปลกๆ แล้วใช้ลำบาก อันนี้จะว่า Mustache อย่างเดียวก็ไม่ถูกต้องว่าคนออกแบบ JSON structure ด้วย สรุปคือมันไม่ยืดหยุ่นเท่าไหร่
  2. if else ใช้ลำบากคือจริงๆ มันสามารถใช้ได้นะแต่ syntax ไม่สื่อโค้ดอ่านยาก
อ่านเนื้อหาทั้งหมดHandlebars template engine ที่น่าใช้อีกตัว
Published January 4, 2014

ใช้ Javascript เล่นเสียงจากแท็ก <audio>

แท็ก <audio> เพิ่งเพิ่มมาใน HTML5 เอาไว้ใช้ define ข้อมูลที่เป็นคลิปเสียง ถ้านึกไม่ออกให้ลองนึกถึงเว็บแอปที่มีการแจ้งเตือน เช่น Facebook เมื่อมีการแจ้งเตือนนอกจากจะมี notification สีแดงบอกแล้วก็จะมีเสียงเตือนด้วย หรือระบบแชทถ้ามีข้อความจากคู่สนทนาก็จะมีเสียงเตือนแจ้ง เป็นลูกเล่นเล็กๆ น้อยๆ ด้าน UX

อ่านเนื้อหาทั้งหมดใช้ Javascript เล่นเสียงจากแท็ก <audio>