一、泛型通配符:“?”
java泛型中,当某种类型不确定时,可以使用未知类型?来代替,在Java集合框架中,对于参数值是未知类型
的容器类,只能
读取其中元素,不能
向其中添加元素, 因为,其类型是未知,所以编译器无法识别添加元素的类型和容器的类型是否兼容,唯一的例外是NULL。
二、setTimeout与clearTimeout
在HTML DOM方法提供了setTimeout与clearTimeout来进行定时任务和取消任务。总所周知,在使用setTimeout(fucntion(){},timeNumber)后,需要调用clearTimeout()时,需要传入setTimeout()对应的返回值。改返回值是一个int数值,用以标示每一次调用是哪个setTimeout()。
function a(){console.log(111)}
pc = setTimeout(a,10000);
31
111
pc = setTimeout(a,10000);
32
pc = setTimeout(a,10000);
33
clearTimeout(32)
undefined
111
如图,在控制台定义了函数a,在clearTimeout()函数中传递对应的int值,便能终止定时任务。在每次刷新界面后,重置返回值,不可否认是一个很low却又快捷、轻便、有效的方法。
三、js函数的默认参数
在网上查了查资料,发现js没有类似于java函数的默认参数设置,但是js提供了一个arguments的变量,用以在函数中储存传进来的参数,因此可以通过判断进行默认参数值设置:
function wireLabelObject(key,display,value){
var width = arguments[3] ? arguments[3] : '280px';
var height = arguments[4] ? arguments[4] : '150px';
var top = arguments[5] ? arguments[5] : 300;
var left = arguments[6] ? arguments[6] : 100;
var fontSize = arguments[7] ? arguments[7] : '20px';
var obj = {
'key':key,
'display':display,
'value':value,
'width':width,
'height':height,
'top':top,
'left':left,
'fontSize':fontSize
}
return obj;
}
四、mvvm
mvvm模式,即Model-View-ViewModel,代表一种前端数据绑定式的模式。由view<——>view model<——>model,通过view model实现view与model的数据绑定,从而减少代码量。在项目中使用的mvvm框架是vue.js,下例为依照vue.js文档写的样例:
<!DOCTYPE html>
<html lang="en" xmlns:v-on="http://www.w3.org/1999/xhtml" xmlns:v-for="http://www.w3.org/1999/xhtml">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="node_modules/jquery/dist/jquery.min.js"></script>
<script src="node_modules/vue/dist/vue.min.js"></script>
</head>
<body>
<div id="app">
<p>{{message}}</p>
<input v-model="info" v-on:keyup.enter="add">
<ul>
<li v-for="p in infos">
<span>{{p.text}}</span>
<button v-on:click="remove($index)">X</button>
</li>
</ul>
</div>
<script>
var vue = new Vue({
el: '#app',
data: {
info:'',
message:'输入信息',
infos:[
{text:'info 1'}
]
},
methods:{
add: function(){
this.infos.push({text:this.info.trim()});
this.info = '';
},
remove: function(index){
this.infos.splice(index,1);
}
}
})
</script>
</body>
</html>
view层,即:
<div id="app">
<p>{{message}}</p>
<input v-model="info" v-on:keyup.enter="add">
<ul>
<li v-for="p in infos">
<span>{{p.text}}</span>
<button v-on:click="remove($index)">X</button>
</li>
</ul>
</div>
model层,即:
data: {
info:'',
message:'输入信息',
infos:[
{text:'info 1'}
]
},
Vue对象则充当了view-model的角色。
参见vue.js文档http://cn.vuejs.org/guide/
五、taffy db
在有些网页上,由于频繁用到表里的数据,并且需要进行不同的查询,因此在页面内访问数据库的次数特别多,有个页面初始化居然需要近10次访问,造成加载时间长达5秒。而且在前台通过手写的查询有一定的局限性,因此搜了搜json的查询工具。虽然json查询的工具比较少,但是也有几个能够满足基本需要的。
1.jsonsql
通过类似于sql语言的查询语句来查询json中的数据。下面是两个官网上的示例:
1)jsonsql.query("select * from json.channel.items order by title desc",json);
2)jsonsql.query("select title,url from json.channel.items where (category=='javascript' || category=='vista') order by title,category asc limit 3",json);
由于jsonsql只支持简单的select语句,因此看起来发展状态与使用情况并不是太好,然而已经满足了项目开发的需要。
2.taffy db
比起jsonsql来说,taffy db似乎要高级许多,支持完整的crub操作,可以满足大部分的需要。
主要特点:
- 很小,只有10K左右
- 简单,JavaScript的语法
- 快速
- 易于集成到任何Web应用
- 兼容主流的Ajax库,例如:YUI, JQuery, Dojo, Prototype, EXT, etc
- CRUD 接口 (Create, Read, Update, Delete)
- 排序
- 循环
- 高级查询
官网上给了一些简单的例子,可以入门。但是个人感觉jsonsql似乎看起来舒服一点,,,毕竟sql。。。。
创建数据库:
// Create DB and fill it with records
var friends = TAFFY([
{"id":1,"gender":"M","first":"John","last":"Smith","city":"Seattle, WA","status":"Active"},
{"id":2,"gender":"F","first":"Kelly","last":"Ruth","city":"Dallas, TX","status":"Active"},
{"id":3,"gender":"M","first":"Jeff","last":"Stevenson","city":"Washington, D.C.","status":"Active"},
{"id":4,"gender":"F","first":"Jennifer","last":"Gill","city":"Seattle, WA","status":"Active"}
]);
查询:
// Find all the friends in Seattle
friends({city:"Seattle, WA"});
// Find John Smith, by ID
friends({id:1});
// Find John Smith, by Name
friends({first:"John",last:"Smith"});
修改:
// Move John Smith to Las Vegas
friends({first:"John",last:"Smith"}).update({city:"Las Vegas, NV:"});
// Remove Jennifer Gill as a friend
friends({id:4}).remove();
// insert a new friend
friends.insert({"id":5,"gender":"F","first":"Jennifer","last":"Gill","city":"Seattle, WA","status":"Active"});
ps:就是不知道前端对数据处理起来的速度咋样,数据量太大还是老老实实去数据库吧。