dean.edwards在被问及“不写代码的时候都在干些什么?”时非常囧地答道:“在测试和修bug(testing&debugging)”,这便是开发工程师共同的命运=.=! 我们整天都在编码、测试、Debug,忙的不亦乐乎。不过还好,有很多现成工具可以帮助我们更容易更快速地定位页面内的脚本问题,抽空还能偷个懒,简单搞个例子,看看它们是如何帮助我们的…
一、函数表达式与函数声明 /*函数表达式*/
var test = function(){
console.debug('hello world');
}
/*函数声明*/
function test(){
console.debug('hello world');
}
两种方式并不是一致的,看下面的比较代码
test();//不会被执行,因为虽然test已经声明是一个变量,但还未被赋予任何类型的值
var test = function(){
do something
}
项目中用到的一个模态对话框效果,样式可以通过独立的 CSS 控制,可以在不同浏览器下统一表现,这种弹窗效果应该是非常常见的,技术上也没什么难度,我就是又把 YUI 的方法用原生方法重写了一遍,算是一个独立版本吧,在这里做个记录,分享下,以后可以在其他场合用到。
实例:Javascript 模态对话框
Javascript不愧是灵活的语言,活用一些运算符可以让脚本代码提高性能。
使用位运算符强制转换类型
格式:表达式 >> 0 或 表达式 << 0
1.非数字转换为数字,数字则继续保持原值,这个方法用来代替=比parseInt再好用不过
var a;
a = 'ABC'>>0;//0,等价于NaN转换为Number
a = '123'>>0;//123
a = false>>0;//0
2.布尔true会被转换为1;
var a;
a = true>>0;//1
a = true<<4;//16
关于什么是匿名函数,及它带来的优势在本文就不深究了,先抛出一个常用的匿名函数:
(function(){alert('yo');})();
很多同学知道怎么用这种匿名函数,却或许并不明白为什么这样写就能够调用匿名函数。也许知道后面的圆括号是执行前面的函数,而并不清楚前面的圆括号具有何种含义!本文将带你了解匿名函数的代码模式原理……
尝试用面向对象的思想来写这个鼠标拖选的 DEMO 。
主要在于创建选取框和对象列表,遍历出在选框内地对象并获取,对获取的对象还可以再做进一步处理,比如加上群体拖动等效果。
演示页面:Javascript 鼠标拖选 Demo
获取DOM节点的方法有很多,如常用的getElementById()、getElementsByTagName(),前者返回一个节点元素,后者返回的是节点的集合。看似相同,实际上其中大有文章:
1、getElementById()
返回的节点可以保存到变量中,即便使用removeChild()方法移除,也能再通过保存的变量使用该节点。
测试下面的代码:
[code=html]
[/code]
2、getElementsByTagName()
返回的值仅仅是对DOM节点地址的引用,如果使用removeChild()删除节点,返回值是会变化的。可能用图示更清晰吧
测试下面的代码加深印象:
[code=html]
- hello world
- hello world2
[/code]
最近这两天忙着开发商城的购买条件和限时抢购功能,一直没有时间更新自己的博客,不过老实说也不知道该在博客里写点什么,今天闲下来顺便就把我这两天开发的功能之一与大家分享一下。
时间队列选择:
交互的方式是受 Google Analytics 的启发而设计的:
不过他们用的是 flash 实现的,所以效果更好,功能更强大!
时间选择功能演示地址:http://www.silentash.com/uploads/work/timeSelect/purchase_limit.html
优势:
1.以1小时为一个时间单位
2.数据结构简单,通过页面传入数据对象即可
3.可显示已被占用的时间段和占用时间的商品或其他事件,用户只需移动鼠标到上面就能获知哪些商品占用了这段时间。
4.可回显操作目标已选择的时间段,便于二次修改
5.可跨月份进行选择
6.表现、结构、行为很好地做了分离,通过修改样式可以创建多种效果,并且可以运用到任何地方
7.后台没有传送数据的时候,可以当做一个简单的时间控件使用~~~~
不足:
1.代码比较多,在IE下运行较慢,可考虑运用浏览器缓存。
2.面向过程
总共花了一天的时间写 JS ,又花了一天时间优化,优化的时候基本上重写了整段代码,性能提升了不少,不过在 IE 下还是感觉很慢,看来还得改变思路继续优化。这次 JS 里面封装了不少时间函数,有些是没有用到的,这么做是想提升代码的共用性,可以把前段时间写的时间选择控件整合到一起。希望有时间去做吧。
最近强烈的感觉到 JS 的面向对象设计很难做好,其实我之前是想把这个时间段选择的功能按对象设计的,写着写着又面向过程了!不知道高人能不能给个指点。



