js array sort

2015-07-12

如何把数组按照从小到大或从大到小的方式排序？

JavaScript中内置对象——数组本身拥有排序方法：array.sort()
关于这个方法很多人都有误区，我也不例外。
在某些数组下这个方法会按照从小到大的方式排序

阅读全文

angular bi databinding

2015-06-29

angular 双向数据绑定

angular的特性非常多，今天主要说说：双向数据绑定。
在传统的js代码或jquery代码中，单向数据绑定无处不在。
或许你和我一样，受够了写这些面条式的代码，代码交织在一起，分都分不清。
在真实项目中，有一个需求：
页面中有两个下拉框，第一个下拉框选择机场，第二个下拉框选择航站楼。
很明显，这是二级联动。

阅读全文

use angular break the old world

2015-06-28

用Angular打破旧世界

2014年11月某日，我接到一个任务，给公司ERP系统的创建订单功能做一些增强，支持海外下单和搜索提示。
现状：目前的创建订单功能都是基于城市这个唯一维度来做的，页面加载的是百度地图。
应用场景：用户在国内提前下单，在国外使用。
初期需求：在创建订单过程中根据用户所选择的城市来加载百度或谷歌地图，
选择国外城市后，搜索地址要能拿到对应的poi，系统能成功创建订单。
分析：谷歌地图服务在国内基本处于不可用的状态，地图加载非常缓慢，最重要的是搜索地址无法拿到poi。
讨论：经过和系统组老大、pm讨论，决定把此问题一分为二，那就是地图加载不了，拿到数据就行。
最终需求：地图可以不加载，但搜索一定要能拿到poi。
解决方案：租赁一台VPS做中间请求转发，绕过国内无法直接访问谷歌的限制。
估算工期：我心想方案已经确定，而且接口有现成的，应该不太难，所以我估计了五天。
我先做了个简单的demo，利用极路由自动翻墙的特性，成功加载谷歌地图，搜索地址成功拿到poi。
当我考虑如何把我的代码融入现有的代码中时，我傻了眼，现有的代码完全无法阅读。
html页面上各种php语句和变量，随便一个js文件代码几千行，
几乎没有注释，函数的层层调用，让你完全理不清这业务逻辑。
我看了半天后，头都大了，一瞬间我有种想重构整个代码的冲动。
为什么我想重构？
因为每次当我打开那个文件，看到满屏的代码，滚动条怎么下拉也看不到尽头的时候，人都绝望了。
与其在这个旧世界中干着一些敲敲打打，修修补补的工作。
不如用锤子砸开这个旧世界，迎来一个新世界。
而这个锤子就是angular.js。
说干就干。
这个功能中的数据(Data)来自两部分：
1、php语句在后端直接生存（譬如城市列表）:

阅读全文

js red green light

2015-05-27

红绿灯大战之终结版

2015年4月10日，微博上爆发了波澜壮阔的“红绿灯大战”，这一天史称：红绿灯日。
@十年踪迹(真名吴亮，曾就职百度，《javascript王者归来》作者，现担任360前端主管)
在微博上发了个帖子：
过程抽象之promise化－－用过程抽象的思路将一个普通的异步函数“变换”成promise形式
http://code.w3ctech.com/detail/30
随后@winter(真名田永强，现就职阿里，《深入浅出node.js》作者，在js领域造诣颇深)
表示不服，也写了个版本：http://code.w3ctech.com/detail/31
然后裕波同学(360浏览器主管)
让@aimingoo(真名沈爱民，现就职豌豆荚，也是前端大牛)
来评估谁的代码实现更好些。
然后@hax(贺师俊 现百姓网前端主管)和一堆爱好者也加入进来，写了好多个版本。
把路径最后的数字不停地加一，即可看到对应的版本。
总共有44个版本，数字从30到73。
专题可见：前端要给力之：红绿灯大战中的火星生命-Promise
感兴趣的同学都可以提交自己的版本，
我在偶然间灵感触发，写了属于自己的红绿灯大战之终结版。
我的实现思路与这44个版本截然不同，是基于我上篇文章的函数嵌套来实现的。
上篇文章我们实现的是：输入框的值两秒后变成0，再隔两秒后变成1，再隔两秒后变成2。
这和红绿灯岂不是很像，立马动手，代码如下：

阅读全文

js function nest

2015-05-23

回到上一片文章的那道面试题：

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body>
	<input type="text" id="input" value="">
	<script>
		var input = document.getElementById('input');
		for(var i=0;i<3;i++){
			setTimeout(function(){
				input.value=i;
			},2000)
		}
	</script>
</body>
</html>

阅读全文

js this

2015-05-21

我们先来看一个例子：

<?php>
class erson(){
	// 人的成员属性
	var $name; //人的名字
	var $age; //人的年龄
	//人的成员 say() 方法
	function say() {
		echo "我的名字叫：".$this->name."<br/>";
		echo "我的年龄是：".$this->age;
	}
}
//类定义结束
$p1 = new Person(); //实例化一个对象
$p1->name = "Gonn"; //给 $p1 对象属性赋值
$p1->age = 25;
$p1->say(); //"我的名字叫：Gonn" "我的年龄是：25"
</php>

阅读全文

js async and clousure

2015-05-21

深入理解js中的异步与闭包

有一道非常有名的面试题，粗略如下：

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body>
	<input type="text" id="input" value="">
	<script>
		var input = document.getElementById('input');
		for(var i=0;i<3;i++){
			setTimeout(function(){
				input.value=i;
			},2000)
		}
	</script>
</body>
</html>

阅读全文

js call and apply

2015-05-20

如何从一个无序数组中获取最大值或最小值?

js中的数组中并没有直接内置这样的方法，那我们就尝试为数组添加这样的方法。

阅读全文

java foundation road

2015-05-01

Java语言的初衷

1990年，SUN公司的工程师－帕特里克·诺顿获得了公司的一个”Green计划“的项目机会，
他和詹姆斯·高斯林、麦克·舍林丹一起在加州门罗帕克的一个小工作室里研究新技术，
瞄准下一代智能家电的程序设计。
团队最初考虑使用C语言，但很多成员包括SUN的首席科学家比尔·乔伊，
发现C语言和可用的API在某些方面存在很大问题。
工作小组使用的是内嵌类型平台，可以用的资源极其有限。
而C语言太复杂以至很多开发者经常错误使用。
他们发现C 缺少垃圾回收系统，可移植性。
他们想要一种易于移植到各种设备上的平台。
于是SUN公司的工程师在C语言的基础上，开发了一种面向对象的编程语言－Oak。
1992年夏天，他们发布了Green操作系统，程序设计语言Oak，类库，和其硬件。
1992年12月，他们对外展示了Star这台类PDA设备，该设备有鲜艳的图形界面和智能代理。
1992年11月，Green计划被转化成了“FirstPerson有限公司”，一个SUN公司的全资子公司。
同年时代华纳发布了一个关于电视机顶盒的征求提议书时，FirstPerson和SGI都投递了标书。
但由于有线电视业界觉得FirstPerson的平台给予用户过多地控制权，而选择了SGI。
随后与3DO公司的另外一笔关于机顶盒的交易也没有成功，
由于他们的平台不能在电视工业产生任何效益，FirstPerson再并回SUN公司。
1994年6、7月间，在经历了一场历时三天的头脑风暴的讨论之后，
团队决定再一次改变努力的目标，这次他们决定将该技术应用于万维网。
他们认为随着Mosaic浏览器的到来，因特网正在向高度互动的远景演变。

阅读全文

Get URL Parameter

2015-04-29

URL(统一资源定位符)是Web开发中经常用到的东西，它由很多部分组成。
protocol+host＋port(默认80)＋pathname+search+hash
假如有一个URL：
http://www.kittencup.com/wp-login.php?username=final&password=123456
现在我想获取对应的usename值和password值。
那在js中如何实现呢？

阅读全文