搭建你自己的Hexo博客

Hexo基于node.js,可用于生成静态博客,结合github和Mac,可以专注创作了。
深入学习见文末引用。

hexo安装

brew install node
sudo npm install hexo-cli -g  #全局安装

创建博客

Hexo使用命令:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
hexo init <folder> #执行init命令初始化hexo到你指定的目录
hexo new [layout] <title> #创建文章
hexo new page <title> #生成新页面
hexo generate #自动根据当前目录下文件,生成静态网页
-d #deploy after
-w #查看文件变化
hexo publish [layout] <filename> #发布草稿
hexo server #运行本地服务
-p #端口
-s #只生成静态文件
-l #生成log
--draft 连草稿也生成预览
hexo deploy
-g #generate before
hexo render <file1> [file2] ...
-o #output destination
hexo migrate <type> #Migrates content from other blog systems.
hexo clean #Cleans the cache file (db.json) and generated files (public).
hexo list <type> #Lists all routes.

Read More

编写可维护javascript

for-in:对象属性遍历

  • 循环不仅遍历对象实例属性,还遍历从原型继承来的属性;若只想遍历该对象属性

var prop,obj={a:1.b:2,c:3};
for (prop in obj) {
    if (obj.hasOwnProperty(prop)) {
        //遍历只属于该对象的属性
    }
}

in:判断属性在对象中是否存在

var obj={
    cnt:0,
    related:null
};
if("cnt" in obj){
    //do some code
}

instanceof:判断一个变量是否某个js 对象( 非dom对象)的实例

typeof:判断运算数的类型
  • 返回number,boolean,string,function,object,undefined

处理错误

  • 自定义错误

function MyError(msg){
    this.msg=msg;
}
MyError.prototype = new Error();
  • try-catch-finally

基于对象继承:不破坏源对象

var person={
  age:11,
  name:'virgil'
};
var myPerson=Object.create(person);
myPerson.age=12;
console.log(myPerson.age,person.age);//12 11

基于类型继承

function Person(name){
    this.name;
}

function Author(name){
    Person.call(this,name); //继承构造器
}

Author.prototype = new Person(); //原型继承

禁止修改

  • preventExtension #防止扩展
  • seal #密封
  • freeze #冻结

引用

  • Array非固定长度,可以动态增删,因此数组是引用类型

    var arr=[1,2,3];
    var arrRef=arr;
    arr.push(4);
    console.log(arrRef);
    

作用域链

  • 全局作用域中,该链中有且只有一个对象,即全局对象
  • 函数中,有两个对象,先会被访问到的是调用对象,然后是全局对象

《JavaScript核心概念及实践》

如有疑问,请留言或邮件newbvirgil@gmail.com
本文链接 : http://blog.newbmiao.com/2015/03/28/maintainable-javascript-note.html

php的赋值与引用

针对php的引用,有时总会错误认为指向一块内存,修改也会影响到该内存数据,直到看到php的源码分析,有了更清楚的理解,部分出自< php核心技术和最佳实践 >

写时复制

  • php变量有is_ref和refcount标志,用来标识是否引用和变量引用次数
  • 当两个变量$a=$b;,虽然不是引用,但是值相同,为了内存复用,$b 的refcount会加1
  • 只有当$b 的值改变,才会新开辟内存写入值,并置refcount为1

    Read More

js数据类型

数据类型

  • 字符串对象和字符串

    • 字符串可隐式转化为字符串对象

      var a=new String('a');
      var b=new String('a');
      a==b;    //false,引用不同
      a===b;    //false,引用不同
      a=='a';    //true,内部转换
      a==='a';//false,值相同,类型不同
      String('a')==='a';//true,显式转换为字符串
      
    • 是不可变的,其方法是非破坏性的,不能改写其内容。

      var a='abc';
      a[0]='A';
      console.log(a);//结果仍是'abc';
      

Read More

正则速查

正则表达式

  • 元字符

    • . [匹配除换行符以外的任意字符]
    • \w [匹配字母数字下划线或汉字]
    • \s [匹配任意空白符]
    • \b [匹配单词的开始或结束]
    • * [匹配0-n次连续出现的字符]
    • + [匹配1-n次连续出现的字符]
    • ? [匹配0-1次出现的字符]
    • ^ [匹配相反的字符]

    example:非(提取a标签内容)
            $reg='#<a[^>]*>([^<>]*)<\/a>#';
            $str="<a href='ssss'>some</a>other<a href='ddd'>some</a>";
            $res=preg_match_all($reg,$str,$m);
    

Read More

对数组元素打乱输出(不重复随机串)

回顾2014的一个笔试题

Q:对一个数组(如[1,2,3,4,5])的元素顺序打乱输出,到要求100次内不重复

我当时的思路是Math.random()随机打乱+闭包函数保存已随机过的数组键拼接字符串用于唯一判断
但回来想保存值序列不更好么,另查了大神的打乱数组方式,综合一下,和大家分享

A:

<script>
function random(a, b){
//用于打乱数组的排序函数
   return Math.random()>.5 ? -1 : 1;
}
//闭包函数
var uniqueArr=(function(uniqueStr){
       var arr=[];
       return function(uniqueStr){
           for(var i=0,len=arr.length;i<len;i++){
               if(arr[i]==uniqueStr){
                   return false;
               }
           }
           arr.push(uniqueStr);
           return arr;
       };
   })(null);
//打乱数组函数
function randomSort(arr){
   var res=arr.sort(random);//打乱的数组
   var keys=res.join('');//数组值串

   if(un=uniqueArr(keys)){//不重复
       //console.log(un,res);//测试用
       return res;
   }else{
       return randomSort(arr);
   }
}
//测试一下
var arr = [1, 2, 3, 4, 5];
randomSort(arr);
randomSort(arr);
randomSort(arr);
randomSort(arr);
randomSort(arr);
</script>

翻出来放这里,其实也是希望能够抛砖引玉,希望大家提点改进!

如有疑问,请留言或邮件newbvirgil@gmail.com
本文链接 : http://blog.newbmiao.com/2015/02/28/random-element-of-array-js.html

html5拖拽2-chrome拖拽下载

  1. 接着上一文章,chrome中实现了文件的拖拽下载,和桌面互动的效果非常好。
    主要要求是在dataTransfer中设定文件的信息,信息需按以下格式:

    'MIMETYPE:文件名:文件URL'
    

    我们可以这样设置文件元素:

    <a id="mp3" 
        href="http://e.com/f.mp3" 
        draggable='true' 
        data-downloadurl="audio/mpeg:f.mp3:http://e.com/f.mp3">you can download this mp3 to desktop in chrome by drag
    </a>
    
  2. 接下来问题是获取自定义属性,即data-*,使用dataset(html5属性)

    var url=document.getElementById("mp3").dataset.downloadurl;
    
  3. 最后就是绑定数据了:

    document.getElementById("mp3").ondragstart=function(e){
                e.dataTransfer.setData('DownloadURL',e.target.dataset.downloadurl);
            };
    

    可以拖动下载到桌面了,记得是在chrome中啊。

如有疑问,请留言或邮件newbvirgil@gmail.com
本文链接 : http://blog.newbmiao.com/2015/02/22/html5-drag-api2-chrome-drag-to-downloa.html