พอดีผมไปหา code เก่า… แล้วเจอ code ที่เขียนแบบนี้
var graph_url = '/' + pageId + '/members/' + uid;
ปวดตับมาก code แม่งดูโคตรยากเลย ต่อ string กันกระจาย…
ก็เลยคิดว่าถ้าเราเขียนฟังก์ชั่นทำ string template แบบนี้
str_parse("/${0}/members/${1}", [pageId, uid]); ก็คงจะดีไม่น้อย ได้ใช้บ่อยแน่นอน (ลอกมาจาก facebook api ของ facebook ในส่วนของ FQL)
แล้วก็จะเขียนด้วย TDD/BDD เพราะว่าจะได้ฝึกหัดการเขียนโปรแกรมแบบ TDD ไปในตัว
และสร้างความสนิทสนมกับ Jasmine ด้วย [Jasmine เป็น behavior-driven framework]
เข้าเรื่องกันเลยดีกว่า…
โครงสร้าง
โครงสร้างของโปรเจ็คที่เราใช้ Jasmine จะเป็นแบบนี้
เราจะเขียน test กันใน spect/string_template_spec.js
แล้วเขียนฟังก์ชั่นใน src/string_template.js
รันเทสใน SpecRunner.html จ้า
รันเทส
พอเรารันเทสจะได้ประมาณนี้
Code Coverage
ผมใช้ jscoverage เพื่อดู code coverage แบบนี้ (ใช้ python simple http รัน http server)
ถ้าสนใจ
ใครสนใจ บอกชื่อ github ไว้ได้เลยครับ เดี๋ยว add เพิ่มเป็น collaborators จะได้มา code เล่นๆกัน (หรือหัดเขียน requirement กัน)
สถานะตอนนี้
ตอนนี้ code มันมั่วมากและกากมาก ยังไม่ได้ refactor เขียนตาม test case มาเรื่อยๆ ค่อยๆ hard code กันมา
ไม่ได้เขียน requirement ก่อน ทุกอย่างสดเลย สด สุดๆ
requirement เปลี่ยนไวมาก [เกิดมาจากความคล้ายกันของ Array และ Object] อยากได้ function เก่งๆ
แต่ก็ค่อยๆปรับกันไป ยังไงก็เขียนเทสก่อน ไม่ค่อยเป็นกังวลเรื่องเปลี่ยนแล้วจะท้อ… กับบั๊ก
หน้าที่ของเราคือทำให้มันเขียวก็พอ
เขียนเล่นๆ ถือว่าเป็นการเรียนรู้กระบวนการแบบ Test First, การเปลี่ยนแปลงของ Requirement, หัดใช้ Jasmine กันไป
เพื่อความมันส์ของวันนี้…
ปล. 1 ผมใช้ JSLint และ JSHint ช่วยตรวจสอบคุณภาพของ code javascript
ปล. 2 ผมใช้ Jasmine แบบ simple สุดๆ มีแต่ toEqual และเทสเคสมึนๆ
ปล. 3 git repository อยู่ที่ https://github.com/NAzT/js-string-template