- 原文:Create Advanced Web Applications With Object-Oriented Techniques
- 译文(因文章较长,分多篇贴出,此篇为第5部分):
Archive for June, 2007
- 原文:Create Advanced Web Applications With Object-Oriented Techniques
- 译文(因文章较长,分多篇贴出,此篇为第4部分):
原型
原型对象是JavaScript面向对象编程的中心概念。其称谓来源于JavaScript中对象的创建,都是作为一个现有的样例(即原型)的副本。这个原型对象的任何属性和方法,都会作为这个现有的原型构造器所创建的对象的属性和方法出现的。也可以说这些对象都从它的原型那里继承了所有属性和方法。例如当你这样样创建一个Dog对象的时候:
var buddy = new Dog("Buddy");
那个被buddy引用的对象从它的原型继承了所有属性和方法,尽管简单的一行代码可能并不足以看清原型的来源。对象buddy的原型来自一个构造函数的原型(在这个例子中,就是函数Dog)。
在JavaScript中,每个函数都有一个指向到原型对象的,叫”prototype”的属性。反过来,这个原型对象又会有一个叫”constructor”的属性,它指向回函数本身。这是一种环形的映射关系。为了更好地理解这个环形关系,请看插图 Figure3。
- 原文:Create Advanced Web Applications With Object-Oriented Techniques
- 译文(因文章较长,分多篇贴出,此篇为第3部分):
不用类的构造函数
正如我们注意到的,关于JavaScript面向对象编程的最奇怪之处就是,JavaScript不像C#或C++那样有类。在C#中,当你这样写:
Dog spot = new Dog();
会得到一个Dog类所实例化的对象。但JavaScript没有类可以让我们入手。最接近的方法是,你可以像这样定义一个构造函数:
- 原文:Create Advanced Web Applications With Object-Oriented Techniques
- 译文(因文章较长,分多篇贴出,此篇为第2部分):
JavaScript函数是最初的类
在很多编程语言中,函数和对象通常被看作两个不同的事物。在JavaScript,他们的区别很模糊–一个JavaScript的函数就是一个关联了可执行代码的真正的对象。想想一个普通的函数是这样的:
function func(x) {
alert(x);
}
func("blah");
这就是在JavaScript中字义函数的方法。但我们也可以像下面那样定义一个函数,即定义一下匿名的函数然后赋值给一个变量func
- 原文:Create Advanced Web Applications With Object-Oriented Techniques
- 译文(因文章较长,分多篇贴出,此篇为第1部分):
最近,我会见了一个有5年网络应用程序开发经验的程序员。她编写JavaScript已经有半年了,并认为她的JavaScript技巧很不错,但之后我很快地发现–她对JavaScript的了解可以说是一无所知。但我没有责备她这点。JavaScript在这种情况下显得很滑稽,它是一个让很多人(包括作者自己在之前也这样认为)都觉得自己已经很熟手了,因为他们都有着C/C++/C#或其它之前的编程经验了。
网友们提供了很多显示在Flickr上储存的图片的方法,如:”还我 Flickr! 拯救 Flickr 大行动“。
让Flickr显示的最好方法是替换IP的方法,因为稳定。其替换的内容如下:
http://farm1.static.flickr.com/ 换为 http://68.142.232.116/
http://farm2.static.flickr.com/ 换为 http://69.147.123.56/
其中为Wordpress而做的花儿写的脚本就用这个方法,实现方法是在输出时替换IP。这样做的好处是不影响原有的数据,等Flickr解禁时,只要把花儿写的脚本去掉就可以了,嘿嘿。
但在yo2上可用不了,因为无法安装插件,而且无法把插件直接放到主题文件中。估计是Yo2对下面这个语句实行了禁令:
add_filter('the_content', 'filter');
我在做Wordpress主题时总是Hack很多,因为原有的Wordpress template tag满足不了复杂的主题结构,所以用别名的方法写了实现花儿写的脚本同样功能的函数。但这样做就只能用于博客的页面显示了,没有能像花儿写的脚本那样全面。于是我就干脆写个JS,把Flickr的IMG地址全部换成相应的IP。代码如下:
<script type="text/javascript">
function filckr_ip_replace(){
var _images_inblog=document.getElementsByTagName("img");
var _Regex=["http://farm1.static.flickr.com/","http://farm2.static.flickr.com/"];
var _RepIP=["http://68.142.232.116/","http://69.147.123.56/"];
if(!_images_inblog.length) return;
for(var i=0;i<_images_inblog.length; i++){
for(var n=0;n<_Regex.length;n++){
if(_images_inblog[i] && _images_inblog[i].src && _images_inblog[i].src.indexOf(_Regex[n])>-1)
_images_inblog[i].src= _images_inblog[i].src.replace(_Regex[n],_RepIP[n]);
}
}
}
filckr_ip_replace();
</script>
Yo2用户只要把上面的代码放在footer.php中相应的位置即可。如果在footer.php中还有其它如google分析等其它外接的脚本的话,那最好把上面代码放在最前面。
我这个blog就是用这个方法显示Flickr图片的。
Update:推荐使用花儿写的脚本。

yo2上还有很多有用的插件,总之想方法把代码放到最后(相对的靠后)就行了。
Update:已经可以把花儿写的脚本放在header.php中,最好是<body>标签前面。但我认为花儿写的脚本中没必要把the_excerpt()也应用上去,因为the_excerpt()生成的是纯文字的文摘的形式,也没有什么图片内容了。详看codex上的the_excerpt()说明。
PS:太久没写JavaScript,有点生疏了。
这是一个Wordpress Theme (version 1.5-? )。主题的名字:Basic2Col Modified released。顾名思义,就是从Basic2Col改过来的。改了什么呢?
- 为sidebar和内容之间加了一条从渐现开始到底部footer的分隔线,改变了链接和普通字体样式等以我个人喜好而作的外观;
- 对非主页的列表页,把列表改为原文输出。原来的列表使用the_excerpt()过滤,将文章处理成摘要的形式。但这个函数并不能有效地处理HTML,在某些内容下(如<br/>)会对HTML截取错误,现象是整个页面结构错位等;
- 在CSS上为适合中文显示做了一些小修小改,但并未作汉化;
- 未做结构上的大修改;
- 实际效果可能会与预览图有所区别;
- 可以直接上传到yo2中使用。
点击下载basic2col20_modified.zip (也可以从My Shares中找到下载)&yo2bryo2&
点击下载basic2col20_modified.zip (也可以从My Shares中找到下载)
Have fun!


