javascript的面向对象15分钟教程

第一种面向对象的写法

创建空对象

1
2

var bill ={};//创建一个空对象

给对象添加属性和方法

1
2
3
4
5

bill.name = "Bill Goat";
bill.work = function (){
console.log("programming....");
};

一步完成上面的两件事

1
2
3
4
5
6
7

var bill ={
name : "Bill Goat";
work : function(){
console.log("programming....");
}
};

访问对象和属性

1
2
3

console.log(bill.name);
bill.work();

方法重写

1
2
3
4
5

bill.name = "Bill Goat";
bill.work =function(who){
console.log("programming for "+who);
};

通过this关键字访问内部属性

1
2
3
4

bill.say = function (){
console.log("bill's name is"+this.name);
};

对象引用

1
2
3
4
5
6

var silly = bill;
console.log(silly.name);
sally.name = "Silly";
console.log(silly.name);
console.log(bill.name);

另一个方式引用

1
2
3
4
5
6
7

bill.name = "Bill Goat";
bill.say();

var sayName = bill.say();
sayName;
sayName();

有意思的地方 :全局属性

1
2
3

var name = "Global";
bill.say();

发现此时输出的是
bill's name is Global

另一种面向对象的写法

定义对象及属性

1
2

function Game(){};

创建对象

1
var DF = new Game();

对象属性

1
DF.title = "星际争霸2";

构造方法

1
2
3
4
5
6
7
8

function Game (title){
this.title = typeof title !== 'undifined' ? title :"";
};

var d3 = new Game("d3");
d3.title;
d3.title ="starcraft2";

this.title = typeof title !== 'undifined' ? title :"";相当于

1
2
3
4
5
6

if(typeof title !== "undifined"){
this.title = title;
}else{
this.title = "";
}

创建一个方法来访问这个属性

1
2
3
4

d3.loveTitle = function (){
console.log("I love "+this.title);
}

更好的写法

1
2
3
4
5

Game.prototype.heartIt = function (){
console.log("I love "+this.title);
}
d3.heartIt();

下次详解javascript的原生对象模型

to be continued~~~~

关于软件工程的讨论—质量篇

那为什么软件系统的质量不容易高呢?我觉得主要原因是流程不完善。那为什么不完善?需求容易变。为什么容易变?是因为不论程序员自己,还是需求方,其实潜意识都认为自己做的东西是变更成本较低的。

试想一下,为什么没人在盖高楼盖一半变更需求?为什么没人修大桥修一半变更需求?甚至做衣服做一半的时候变更需求,理发到一半变更需求,都会被人认为是不讲理。但是在软件领域,好像这倒成了普遍现象。

因为整个软件系统的实现,都是虚拟的,看不见摸不着,并不消耗什么物料,所以从这个角度想,变起来当然是容易的。但软件系统的架构,其实也跟实体的没本质区别,变更时候要考虑很多关联因素,并不是就那么孤立的看一小块地方,当然,也会有一些不影响全局的变更。打个比方说,如果你在盖房子盖到一半,那变更外墙颜色肯定是要比变更窗户大小容易的。要是想变得太多,估计只好拆了重来。

下面的讨论更加精彩:

A:其实不是流程问题,老板和甲方问题

A:甲方尤其关键

A:尼玛,要8层楼房,付2层费用

……

javascript异步编程读书笔记之事件机制

事件的调度

  • 异步执行

setTimeout函数的解释:给定一个回调及n毫秒的延迟,setTimeout会在n毫秒后运行该回调。

代码清单1:

1
2
3
4
5
for (var i = 1; i <= 3; i++) {
setTimeout(function(){
console.log(i); },
0);
};

输出结果:

1
2
3
4
4
4
  • 线程阻塞
    代码清单2:

    1
    2
    3
    4
    5
    6
    var start = new Date;
    setTimeout(function(){
    var end = new Date;
    console.log('Time elapsed:', end - start, 'ms');
    }, 500);
    while (new Date - start < 1000) {};
  • 队列

javascript使用队列的方式来循环处理请求,这种机制被称为事件循环

如何使用短网址和二维码简化网站访问

  1. 短网址(shorturl)
    web2.0时代的潮流,借助短网址您可以用简短的网址替代原来冗长的网址,让使用者可以更容易的分享链接。
    这里我使用的是百度的短网址服务:http://dwz.cn/
    1. 访问http://dwz.cn/主页
    2. 输入你的博客地址
      我输入http://jeffsui.github.io/pinghailinfeng_blog/
    3. 复制短网址
  2. 二维码(two-dimensional-barcodes)
    微信时代,不知道二维码的基本都属于外星球人了。
    这里我选择的是草料二维码:
    http://cli.im/
    1. 输入二维码地址
    2. 进行一些基本设置
      包括前景色、背景色、渐变色等等。
    3. 嵌入图片
    4. 选用你喜欢的模板
    5. 保存二维码
  3. 在线存储
    这里我选择国内知名的七牛云存储。

    4.在博客中引用图片地址就可以了

如何使用hexo在github上建立静态博客

环境搭建

  1. hexo环境搭建

    请参考 hexo.io 官方站点,
    强烈建议基本操作下的内容快速浏览一遍,下面的操作是我一个一个命令敲出来的,遇到的坑也会记录下来,希望大家能少走弯路。

  2. github上建立静态博客

    1. github账号申请(略)
    2. 建立一个github项目
    3. git clone 项目地址 到本地
    4. 项目初始化

      cd 项目名
      echo # hexo 实例站点 >> README.md
      git init
      git add README.md
      git commit -m “first blood”
      git remote add origin 项目地址
      git push -u origin master
    5. github免费站点建立规则,请仔细阅读这个规则
      https://help.github.com/articles/user-organization-and-project-pages/

    6. 默认github域名

      默认github 分配了 一个name.github.io的域名,
      还有一个name.github.io/project_name的二级域名,
      请参照github的提示设置URL。

华丽的分割线

  1. 站点配置流程

    1. 建立站点文件夹,并站点初始化
    2. 安装hexo依赖
    3. 修改node_module/hexo-server/index.js,用于本地调试
    4. 安装hexo-git-deployer插件
    5. 修改全局配置文件_config.yml,配置deploy


      # Site 站点配置
      title: 凭海临风的测试江湖
      subtitle:
      description: 凭海临风的博客
      author: Jeff Sui
      language: zh-CN
      timezone


      # URL 站点链接
      ## If your site is put in a subdirectory, set url as ‘http://yoursite.com/child‘ and root as ‘/child/‘
      url: http://jeffsui.github.io
      root: /pinghailinfeng_blog/
      permalink: :year/:month/:day/:title/
      permalink_defaults:


      # Deployment
      ## Docs: http://hexo.io/docs/deployment.html
      deploy:
      type: git
      repo: https://github.com/jeffsui/pinghailinfeng_blog.git
      branch : master
      message :

      以上配置仅供参考

  2. 创建文章

    • 执行hexo new 命令

      例如:hexo new post my-first-blog

      将会自动在source/_posts下创建一个my-first-blog.md的文件,使用的是scaffolds下的post.md模板

    • 修改并保存my-first-blog.md文件

    • 站点生成hexo g

    • 站点部署 hexo d

      如果没有报错,恭喜你已经成功推送到 项目的master分支。

  3. 创建gh-pages分支并推送到远程


    git fetch origin master
    git checkout gh-pages
    git merge master
    git push origin gh-pages

  4. 访问http://jeffsui.github.io/pinghailinfeng_blog/

遇到的问题

  1. github站点的规则不熟悉,url配置浪费我2个小时。项目建立的是二级域名,所以必须要按照我说的那样配置。
  2. 本地预览有可能不加载样式,重新删除node_module下所有,执行npm install,再hexo g,hexo server -i 127.0.0.1 -s -o即可。
  3. hexo3.0版本的git插件必须要独立安装。
  4. 其他坑,自己填吧。

总结

大坑各种有,github特别多,还有伟大的墙,兄弟们,github好上,填坑需谨慎!