更にvue.js

(function(){
	'use strict';

	// two way data binding
	var vm = new Vue({
		el: '#app',
		data: {
			todos: [
				'task 1',
				'task 2',
				'task 3'
			]
		}
	});
})();

for文

<div id="app">
		<ul>
			<li v-for="todo in todos">{{ todo }}</li>
		</ul>
	</div>

(function(){
	'use strict';

	// two way data binding
	var vm = new Vue({
		el: '#app',
		data: {
			newItem: '',
			todos: [
				'task 1',
				'task 2',
				'task 3'
			]
		},
		methods: {
			addItem: function(e){
				e.preventDefault();
				this.todos.push(this.newItem);
				this.newItem = '';
			}
		}
	});
})();