»

Rquire.js with Jasmine 2

Coding — Tags: , , , — Posted by Starck on February 21, 2014

Require


Project structure

Project/
│
├── css/
│   └── jasmine.css
├── js/
│   ├── require.js
│   ├── main.js
│   ├── models/
│   │   ├── player.js
│   │   └── song.js
│   └── test
│       ├── spec/
│       │   └── playerSpec.js
│       ├── jasmine.js
│       ├── jasmine-html.js
│       └── boot.js
└── index.html

index.html

main.js

js/models/player.js

js/models/song.js

js/test/spec/playerSpec.js

method

  • toBe()
  • toEqual()
  • .not
  • toMatch(/Regex/)
  • toBeDefined()
  • toBeUndefined()
  • toBeNull()
  • toBeTruthy()
  • toBeFalsy()
  • toContain()
  • toBeLessThan()
  • toBeGreaterThan()
  • toBeCloseTo(e, number)
  • toThrow()
  • spyOn(obj, ‘method’)
    • toHaveBeenCalled()
    • toHaveBeenCalledWith(args…)
    • mostRecentCall

Backbone.js notes

Coding, Log — Tags: , — Posted by Starck on October 18, 2013


Backbone.Events

Method Note
object.on(event, callback, [context]) 註冊監聽一個事件, 並指定觸發 callback, 如果需要在 callback function 中改變 this 的對象, 將對象傳入 context
object.off([event], [callback], [context]) 取消監聽事件, 不指定事件將取消所有的事件

Backbone Event Testing


Backbone.Model

Properties / Method Note
constructor() You can use Backbone.Model.apply(this, arguments) to invoke constructor function of parent class
initialize() If you definean initialize function, it’ll be invoked when the model is created.
defaults Remember that in JavaScript, objects are passed by reference, so if you include an object as a default value, it will be shared among all instances. Instead, define defaults as a function.
attributes If you’d like to retrieve and munge a copy of the model’s attributes, use _.clone(model.attributes) instead.
validate(attrs, options) By default validate is called before save, but can also be called before set if {validate:true} is passed. Return your custom error message, and it will be stored to validateError
isValid() Run validate() to check the model state.
validationError The value returned by validate during the last failed validation.
set()
get()
set(‘attr’, ‘value’) or set({ attr: value})
destroy() You can use _.invoke() to call destroy function for a batch of models. ex: _.invoke(modelsArray, 'destroy')


Backbone.Collection

  • create({ attr: value })
  • fetch()
Properties / Method Note
model
url
models Raw access to the JavaScript array of models inside of the collection.
add
create
reset

Project Template


Backbone.View

Properties / Method Note
tagName
id
className
attributes
el and $el
events
render() A good convention is to return this at the end of render to enable chained calls.


Backbone JS Data Types Primer


Backbone.LocalStorage


Example: TodoList

Backbone TodoList

Object.defineProperty

Coding — Tags: — Posted by Starck on October 6, 2013


  • writable
  • configurable
  • enumerable
  • get(getter) / set(setter)


JS Bin

Reference: Mozilla Developer

Function.bind

Coding, Log — Tags: — Posted by Starck on October 4, 2013


你可以利用 function.bind 來改變呼叫函式的對象(this): JS Bin

try starck.callBySelf(); or starck.callByWindow(); in console.


function.bind

For a given function, creates a bound function that has the same body as the original function. In the bound function, the this object resolves to the passed in object. The bound function has the specified initial parameters.

function.bind(thisArg[,arg1[,arg2[,argN]]])

Reference


Callback 的應用: JS Bin try starck.say('hi')

JavaScript Authoring Workflow of Now

Coding — Tags: , — Posted by Starck on August 25, 2013


JavaScript Authoring Workflow with Google Chrome

Chrome Workspace

To enable the Experiments tab of the Settings pane you need to navigate to about:flags and scroll down to the Experimental Developer Tools experiments flag. Enable it then restart the browser.

experiments-flag

Single Web Page Design

Design — Tags: , — Posted by Starck on May 17, 2013

  • jquery
  • bootstrap javascript
  • modernizr
  • plugins.js
    • FancyBox
    • jQuery.ScrollTo
    • array.reverse
  • SMINT

app.js

Viewing Chrome Cache

Coding — Tags: , — Posted by Starck on May 14, 2013

  1. In Chrome chrome://cache/

  2. Click on whichever file you want to view

  3. Settings > Tools > JavaScript Console

  4. Paste code below:

V8 Javascript Engine for PHP on Mac

Log — Tags: , , — Posted by Starck on April 8, 2013

This is a PHP extension embeds the Google V8 Javascript Engine.

V8js extension on Github

Installation

Usage

check samples and tests folder

Problems

如果你經由 PECL 安裝 v8js:

sudo pecl install v8js

你可能會遇到一些編譯上的錯誤, 造成這個問題的原因是因為在 PECL 上的版本 0.1.3 使用了一個已經被最新版 V8 engine 所廢除的函式, 如果想要使用這個版本的話必須要使用 V8 3.15.11 的版本, 降版的方式如下:

brew install v8-3.15.11

如果之後想要切換回新版:

(c) 2017 Starck Lin | powered by WordPress