薇娇

NodeJs常用核心模块简介

fs 文件管理

fs 模块提供了异步和同步2个版本 fs.readFile() fs.readFileSync()
1.写入文件内容

fs.writeFile(‘test.txt’, ‘Hello Node’ , [encoding], [callback]);

2.追加写入

fs.appendFile(‘test.txt’,‘Hello Node’,[encoding],[callback]);

3.文件是否存在

fs.exists(‘test.txt’,[callback]);

4.读取文件内容

fs.readFile(‘test.txt’, [encoding], [callback]);

5.修改文件名

fs.rename(旧文件,新文件,[callback]);

6.移动文件. 没有专门函数,通过修改文件名可以达到目的

fs.rename(oldPath,newPath,[callback]);

7.删除文件

fs.unlink(‘test.txt’, [callback]);

8.创建目录

fs.mkdir(路径, 权限, [callback]);
路径：新创建的目录。
权限：可选参数，只在linux下有效，表示目录的权限，默认为0777，表示文件所有    者、文件所有者所在的组的*用户、*所有用户，都有权限进行读、写、执行的操作。

9.删除目录

fs.rmdir(path, [callback]);

10.读取目录. 读取到指定目录下所有的文件

fs.readdir(path, [callback]);

11.打开文件

fs.open(path,flags, [mode], [callback(err,fd)])

12.关闭文件

fs.close(fd, [callback(err)])

13.读取文件

fs.read(fd,buffer,offset,length,position,[callback(err,     bytesRead, buffer)])

14.写入文件

fs.writeFile(filename, data,[encoding],[callback(err)])

15.修改文件时间戳

fs.utimes(path, atime, mtime, [callback(err)])

url 文件管理

1 .解析url - 条件解析

url.parse(‘http://www.baidu.com?page=1’,true);
结果如: { protocol: ‘http:’,
slashes: true,
auth: null,
host: ‘www.baidu.com’,
port: null,
hostname: ‘www.baidu.com’,
hash: null,
search: ‘?page=1’,
query: { page: ‘1’ },
pathname: ‘/’,
path: ‘/?page=1’,
href: ‘http://www.baidu.com/?page=1’ }

2.解析url，返回一个json格式的数组

url.parse(‘http://www.baidu.com’);
结果如: { protocol: ‘http:’,
slashes: null,
auth: null,
host: null,
port: null,
hostname: null,
hash: null,
search: null,
query: null,
pathname: ‘www.baidu.com’,
path: ‘www.baidu.com’,
href: ‘http://www.baidu.com’ }

3.格式化为url. 将json数组逆向成url

url.format({
protocol: ‘http:’,
hostname:‘www.baidu.com’,
port:‘80’,
pathname :’/news’,
query:{page:1}
});
结果如: http://www.baidu.com/news?page=1

4.封装路径

url.resolve(‘http://example.com/’, ‘/one’)  // 'http://example.com/one’
url.resolve(‘http://example.com/one’, ‘/two’) // ‘http://example.com/two’

path 路径管理

1.格式化路径. 将不符合规范的路径经过格式化转换为标准路径,解析路径中的.与…外，还能去掉多余的斜杠

path.normalize(’/path///normalize/hi/…’);
结果如: ‘/path/normalize/’ 标准化之后的路径里的斜杠在Windows系统下    是，而在Linux系统下是/

2.组合路径

path.join(’///you’, ‘/are’, ‘//beautiful’);
结果如:  ‘/you/are/beautiful’

3.返回路径中的目录名

path.dirname(’/foo/strong/cool/nice’);
结果如: ‘/foo/strong/cool’

4.返回路径最后一部分,还可以排除指定字符串

path.basename(’/foo/strong/basename/index.html’);
path.basename(’/foo/strong/basename/index.html’,’.html’);
结果如: index.html 和 index

5.返回路径后缀

path.extname(‘index.html’);
结果如: .html

Query String 字符串转换

1.序列化对象.将对象类型转换成一个字符串类型（默认的分割符（“&”）和分配符（“=”））

querystring.stringify({foo:‘bar’,cool:[‘xux’, ‘yys’]});
结果如: foo=bar&cool=xux&cool=yys

 重载1: querystring.stringify({foo:‘bar’,cool:[‘xux’,     ‘yys’]},’*’,’$’);
结果如: foo$bar*cool$xux*cool$yys

2.反序列化

querystring.parse(‘foo@bar$cool@xux$cool@yys’,’@’,’$’);
结果如: { foo: ‘bar’ ,  cool: [‘xux’, ‘yys’] }

http HTTP

2个方法

http.createServer([requestListener])  创建HTTP服务器
http.createClient([port], [host])     创建HTTP客户端

http.Server

由 http.createServer 创建所返回的实例

http.Server 事件

request 客户端请求到来
提供2个参数: req, res 分别是http.ServerRequest 和 http.ServerResponse 的实例.表示请求和响应消息

connection TCP建立连接时触发
提供1个 socket 参数 net.Socket 实例

close 服务器关闭时触发
无参数

还有checkContinue 、 upgrade 、 clientError 等事件. request 经常使用,所以包含在了 createServer函数中

http.ServerRequest 对象

HTTP请求的消息, 一般由 http.Server的 request 事件发送

属性:

complete          客户端请求是否已经发送完成
httpVersion      HTTP 协议版本，通常是 1.0 或 1.1
method          HTTP 请求方法，如 GET、POST、PUT、DELETE 等
url              原始的请求路径，例如 /static/image/x.jpg 或 /    user?name=byvoid
headers          HTTP 请求头
trailers          HTTP 请求尾（不常见）
connection      当前 HTTP 连接套接字，为 net.Socket 的实例
socket          connection 属性的别名
client          client 属性的别名

GET : 的请求是直接嵌入路径中的. 解析?后面的路径就行了. url 模块中 parse 函数提供了这个功能

POST :

**HTTP 请求分: 请求头.  请求体**
http.ServerRequest 提供3个事件控制请求体传输
data:    请求体数据来到时. 参数 chunk 表示接收到的数据
end:    请求体数据传输完成时
close    用户当前请求结束时


    var post = '';
    req.on('data', function(chunk) {    post += chunk;        });
    req.on('end', function() {    post =     querystring.parse(post);
    res.end(util.inspect(post));});

http.ServerResponse 对象

http.ServerResponse是返回给客户端的信息,决定了用户最终看到的结果. 有3个重要的成员函数. 用于响应头,响应内容以及结束请求

1.向客户端发送响应头

res.writeHead(statusCode, [headers])
statusCode, 是HTTP状态码. 如200,404.

headers 类似数组的对象,表示响应头的每个属性
{
“Content-Type”: “text/html”,
“Connection”: “keep-alive”
}

2.发送响应内容, 如果是字符串,需要制定编码方式, 默认 utf-8

res.write(data, [encoding])

3.结束响应,告知客户端所有响应完成. 此函数必须调用一次

res.end([data] , [encoding] )

事件

挂接模块

var EventEmitter = require(‘events’).EventEmitter;

1.实例化一个EventEmitter对象

var event = new EventEmitter();

2.注册事件

emitter.on( ‘Event_Name’ , callBack_Fun )
emitter.once( ‘Event_Name’ , callBack_Fun )    //注册一个单次监听器,触发一次后立刻解除

3.发射事件

event.emit(‘Event_Name’ , 参数1,参数2);

4.移除事件

emitter…removeListener(‘Event_Name’ , callBack_Fun)
emitter.removeAllListeners(  [‘Event_Name’] )    //如果指定了事件名,就移除指定的,否则移除所有事件

模块和包

Node.js 的模块和包机制的实现参照了 CommonJS 的标准，但并未完全遵循。

#### 包
包是在模块基础上更深一步的抽象, 类似于 c/c++ 的函数库.
Node.js 包是一个目录. 其中包含一个JSON格式的说明文件 package.json
CommonJS 规范特征:
->   package.json 必须在包的顶层目录下
->   二进制文件在bin目录下
->   JavaScript代码在lib目录下
->   文档应该在doc目录下
->   单元测试在test目录下



#### require('Modile_Name')     
功能:    加载其他模块
说明:    不会重复加载以加载的模块


#### exports.setName
功能:    公开一个模块中的函数或对象
说明:    exports 本身仅仅是一个普通的空对象，即 {}. 所以 exports.函数      就是给它加了函数
module.exports  则是用一个对象取代 exports  对象. (不可以对     exports 直接赋值替代此功能)


方式1:
//使用
exports.SayName = function(thyName) {console.log(thyName)}; 
//调用
var test = require('./fileName');
test.SayName('XueYou');

方式2:
    //使用
    function hello(){
     var name;
    this.setNam(){};
    this.SayName(){};
    }
    module.exports = hello;
    //调用
    var test = require('./fileName');
    test = new test();    //注意因为是对象,所以要new
    test.SayName();

MongoDB操作命令

1、 创建新的数据库并进入

use mydata

2、 Help查看命令提示

db.help();
db.yourColl.help();
db.youColl.find().help();
rs.help();

3 、查询所有数据库

show dbs;

4、 删除当前使用数据库

db.dropDatabase();

5、从指定主机上克隆数据库

db.cloneDatabase(“127.0.0.1”); 将指定机器上的数据库的数据克隆到当前数据库

6、从指定的机器上复制指定数据库数据到某个数据库

db.copyDatabase("mydb", "temp", "127.0.0.1");将本机的mydb的数据复制到temp数据库中

7、修复当前数据

db.repairDatabase();

8、查看当前使用的数据库

b.getName();
db; db和getName方法是一样的效果，都可以查询当前使用的数据库

9、显示当前db状态

db.stats();

10、当前db版本

db.version();

11、查看当前db的链接机器地址

db.getMongo();

用户

1、添加一个用户

db.addUser("name");
db.addUser("userName", "pwd123", true); 添加用户、设置密码、是否只读

2、数据库认证、安全模式

db.auth("userName", "123456");

3、显示当前所有用户

show users;

4、删除用户

db.removeUser("userName");

查询

1、查询所有记录

db.userInfo.find();
默认每页显示20条记录，当显示不下的情况下，可以用it迭代命令查询下一页数    据。注意：键入it命令不能带“；”
但是你可以设置每页显示数据的大小，用DBQuery.shellBatchSize= 50;这样    每页就显示50条记录了。

2、查询去掉后的当前聚集集合中的某列的重复数据

db.userInfo.distinct("name");
会过滤掉name中的相同数据
相当于：select distict name from userInfo;

3、查询age = 100的记录

db.userInfo.find({"age": 100});

4、查询age > 100的记录

db.userInfo.find({age: {$gt: 100}});

5、查询age < 100的记录

db.userInfo.find({age: {$lt: 100}});

6、查询age >= 100的记录

db.userInfo.find({age: {$gte: 100}});

7、查询age <= 100的记录

db.userInfo.find({age: {$lte: 100}});

8、查询age >= 20 并且 age <= 30

db.userInfo.find({age: {$gte: 20, $lte: 30}});

9、查询name中包含 mongo的数据

db.userInfo.find({name: /mongo/});

10、查询name中以mongo开头的

db.userInfo.find({name: /^mongo/});

11、查询指定列name、age数据

db.userInfo.find({}, {name: 10, age: 10});

修改、添加、删除集合数据

1、添加

db.users.save({name: ‘zhangsan', age: 25, sex: true});

2、修改

db.users.update({age: 25}, {$set: {name: 'changeName'}}, false, true);

3、删除

db.users.remove({age: 321});

4、查询修改删除

b.users.findAndModify({
query: {age: {$gte: 25}}, 
sort: {age: -1}, 
update: {$set: {name: 'a2'}, $inc: {age: 2}},
remove: true
});
db.runCommand({ findandmodify : "users", 
query: {age: {$gte: 25}}, 
sort: {age: -1}, 
update: {$set: {name: 'a2'}, $inc: {age: 2}},
remove: true
});

其他

1、循环添加数据

> for (var i = 0; i < 30; i++) {
... db.users.save({name: "u_" + i, age: 22 + i, sex: i % 2});
... };

或

> for (var i = 0; i < 30; i++) db.users.save({name: "u_" + i, age: 22 + i, sex: i % 2});

2、forEach迭代循环

db.users.find().forEach(printjson);

想了解更多可以参考:mongodb官网 https://www.mongodb.com/

闲聊微信小程序

这篇文章主要是从互联网产品和运营角度看待微信小程序，避免涉及具体的研发技术，尽量从生态和应用场景角度提供更多的描述，期待能加深大家对微信小程序的理解。

首先，小程序为什么显得那么的重要呢？

微信小程序为什么这么热？

移动互联网时代的今天，微信已经是事实上的霸主，它除了拥有最大的用户量，用户的平均使用时长也最高。

点赞、转发、关注和扫码俨然成为了我们的“日常工作”。

而活跃在朋友圈、微信群或公众号的形形色色的从业者，也在微信这个大生态下寻找着自己的赚钱机会，其中也不乏赚的盆满钵满的人。

所以，微信的一举一动都备受关注是必然的。但这次的微信推出小程序引发的关注，大大1超过了当初对微信推出公众号的关注，这就非常值得我们去探究其中的原由。

今天微信公众号获得的成功，超出了它刚推出时大多数人的想象，而微信推出的小程序，正是为了弥补公众号的不足，并延续着当初推出公众号的思路，走的更加深远。基于这个原因，再加上互联网上大家对微信小程序的解读和想象，给微信小程序带来了越来越高的关注。

我们来看看除了越来越热的影响力，微信小程序的背后还有哪些重要的事情。

公众号面临哪些困境？有哪些局限？

微信的公众号分为【订阅号】和【服务号】两种，其中订阅号可以每天向关注者群发一次推文，下面是两个较多人熟悉的订阅号：

1.关于订阅号的局限

这些做得的不错的订阅号只是众多订阅号中的很少的一部分，大多数的订阅号都遇到文章阅读率低，商业和盈利困难的问题，于是有一些订阅号使用起诸如花钱买阅读等违规手段，这也促使了前一次微信对公众号的整顿和对自身平台的技术升级。

所有订阅号被折叠放置在会话窗口的二级条目【订阅号】下，加上这个条目还会因为会话消息而改变上下的位置，导致订阅号访问并不是很方便，更太多人倾向于使用订阅号作为内容服务者的业务载体，并不适合用于其他互联网服务。

2.服务号有哪些缺陷？

公众号的另外一种是服务号，它虽然没有被折叠在二级条目下，但同样会因为会话消息而改变存放位置，不能便捷地找到并打开一个服务号。

大多数的互联网服务无法仅仅通过服务号的会话窗口来实现，许多服务号都开发了自己的HTML程序，在使用这些服务时，存在加载慢，操作不流畅等体验不佳的问题。

服务号每周一次的群发推送，也会给用户带来打扰，运营的小伙伴都知道，每周特定的推送日常常就是我们掉粉最大的日子。

公众号还存在的一个问题时，当我们正在访问公众号的某个网页时，无法切换到其他会话并且切换回来，这也会给我们使用公众号的互联网服务带来了不便。

从微信小程序最初的名字“微信应用号”可以看出，推出小程序最初的目的就是弥补当前公众号的不足。

从技术角度看，微信小程序的优点

微信小程序工作在微信为它定制的浏览器中，从技术角度看，有3个显著的优点：

1. 所有的小程序都存放在微信自己的服务器上，某个小程序一旦被用户【添加】，就会下载暂存在用户手机上，除了能够快速装载打开外，也能在没有网络的情况下打开。

2. 微信的定制浏览器对小程序做了优化，使用的体验接近于使用原生程序一般流畅。

3. 小程序的开发技术相比传统网页开发技术简单许多，稍加学习，众多的长尾需求者也能为自己开发微信小程序。

4. 所有的小程序都存放在微信自己的服务器上，某个小程序一旦被用户【添加】，就会下载暂存在用户手机上，除了能够快速装载打开外，也能在没有网络的情况下打开。

5. 微信的定制浏览器对小程序做了优化，使用的体验接近于使用原生程序一般流畅。

6. 小程序的开发技术相比传统网页开发技术简单许多，稍加学习，众多的长尾需求者也能为自己开发微信小程序。

微信小程序带来什么风口？

我们先来看看微信为未来的小程序们做了哪些预先设定：

1. 入口
   只能通过微信提供的搜索和在会话中推荐来获取小程序。

2. 服务标准
   发布了官方的设计指南，以期所有小程序都以相似的交互习惯为用户服务。

3. 游戏规则
   运营规范和众多的“不准许”的制定，约束了用户的行为。

4. 封闭环境
   特定的开发语言、严格的审核、私有的发布渠道，确保了一个封闭的环境。

5. 利益分享
   目前对营销号、游戏、直播甚至预留一个广告位的行为也被严格禁止，给微信在将来设立一个利益共享的分配机制预留机会。

通过这5点，不难看出微信为小程序规划了一个封闭的互利生态系统，这个生态系统主要为用户提供各种的移动互联网服务，微信和系统的参与者们一同来分享收益。

这是移动互联网的下一波红利吗？

面对这个新兴事物时，上面这句话可能是很多人最直接的想法。

在一个新生态的建立过程中，最先‘吃螃蟹’的参与者能够跟随着新生态得到快速发展的机会。
如果没有赶上这个最初的发展时期，后期的参与者很难靠自身获得类似的发展速度，这样的机会就是大家常说的‘红利’。

国内的移动互联网第一波红利出现在智能手机刚刚推出的时候，借助App Store和安卓的应用商城，许多应用开发者发展壮大了起来。而微信推出公众号时，可以看作是第一波红利，成就了不少令人羡慕的项目，比如前面提到的知名订阅号。

对于一家存在于移动互联网的公司而言，随着声势浩荡的微信小程序，你的事业小船也许可以率先来到一片新的蓝海，逃离了现在拥挤不堪的竞争环境。

小程序对现在有互联网岗位带来了新的要求？

直接能看到的是，微信小程序的到来，意味着工作岗位的增加，一时间必然存在人力缺口，对于最先掌握微信小程序相关技术和知识的人而言，显然是一个升职加薪的好机会。

对于一家移动互联网公司而言，涉足微信小程序领域，需要在原有开发人员的配比上增加小程序研发岗位，出现由原生技术工程师、Web 前端工程师、微信小程序工程师和服务端工程师的配比。

虽然Web前端工程师稍加学习就能够担当微信小程序的开发工作，但微信小程序开发的代码不能够直接和传统的Web前端代码复用，要开发微信小程序就增加了实实在在的工作量，需要安排专人来做这份工作。

微信小程序对互联网岗位的影响，不仅仅是增加新的开发岗位，后文将提到新的生态对从业者带来了从思维到具体操作方法的全新要求。

一个项目或者产品要想在这个新的生态中获得红利机会，只是简简单单把现有产品复制到微信小程序上，那将很难达到目的。

互联网创业请借助微信起步

也许开一间自己的咖啡屋，是你长久以来的愿望，也许你已经筹钱准备辞职去开一家街角便利店，去创业是这代青年最有默契的愿望。

不论你的创业是停留于想象，还是已经在实践中，一定要将微信的大生态放在你的创业考虑之中，即使你不奢望什么流量和红利。利用微信公众平台维持客户关系，是当下创业最有效和最实际的方式。

微信小程序的到来，也给试图创业的人，在可选的方向上多了一个机会。未来小程序的生态下，肯定会有新项目的发展壮大。尤其有趣的是，当一个生态系统去和其他的生态竞争时，对于创业者而言，更加可能存在机会，后文在介绍用小程序做电商时会再次提到这一点。

费了这么多劲说微信小程序的重要，可能让大家更加疑惑，微信小程序应用在什么地方？ 接下来一边分享如何学习微信小程序，一边和大家畅想一下微信小程序的适用场景。

互联网运营和产品经理面对的机遇与挑战

微信小程序的开发难度比传统的Web前端开发难度降低了接近一半，稍加学习我们的产品和运营，就能直接编写一些简单的微信小程序，这可以让产品和运营加深对研发技术的了解，更能提升自身岗位的工作能力。
随着微信小程序的正式发布，将会有很多开源的组件和模块，它们会被放在互联网上供大家自由下载使用。互联网上还会出现许多种实现特定功能的云服务，借助开源组件和云服务，我们的运营和产品经理，也能够做出各种实用的微信小程序。

因为微信小程序尚未正式发布，在这个生态系统下，一个微信小程序如何构建自身的商业模式，大家还没有清晰的认知。加上微信制定了严格运营规则，如何运营好一个小程序项目，并且能够达到一定的利益转化，这都是对我们运营人员提出的不小挑战。

如前面提到的，微信推出小程序的目的是，借助微信平台向用户提供广泛的移动互联网服务。

互联网服务的基础仍然是我们的互联网产品，也就是我们的微信小程序，产品经理对微信小程序生态的掌握和理解，是做好微信小程序的关键。而这个新生态的建立之初，也会遇到激烈的竞争。这正是创新能力的竞争，产品经理面对的是一场基于创新能力的机遇和挑战。

最后为大家递上一勺鸡汤，红利永远属于准备好了的人，趁着微信小程序刚刚开始公测，和我们一道开启小程序学习之门吧！

本文部分转自 http://mp.weixin.qq.com/s?__biz=MzA3MDk4NzMzNg==&mid=2651706736&idx=1&sn=6a3aba161a5cc720d1feeae773556de7&chksm=84cd0e57b3ba874196e909d81d98f5c3e5279a0ec851ae6399e0e732464a6234f0682bd406ae&mpshare=1&scene=1&srcid=1115VFPaauhuHzzn4L9NorT8#rd]

学习Vue.js需要读者有一定的前端基础，否则，可能不太适合你了！

鉴于是基础篇，这里就直接通过在html中引入Vue来说了（适合新手）

首先你需要在本地新建一个html文档，然后引入vue,如下：

<script src="https://unpkg.com/vue/dist/vue.js">

Vue.js 的核心是一个允许你采用简洁的模板语法来声明式的将数据渲染进 DOM 的系统：

HTML：

<div id="app">
  {{ message }}
</div>

JS：

var app = new Vue({
  el: '#app',
  data: {
message: 'Hello word!'
  }
})

在浏览器中你会看到

Hello word!

打开你的浏览器的控制台，并修改 app.message，你将看到上例相应地更新。

绑定 DOM 元素属性：

HTML：

<div id="app-2">
  <span v-bind:title="message">
Hover your mouse over me for a few seconds to see my     dynamically bound title!
  </span>
</div>

JS：

var app2 = new Vue({
  el: '#app-2',
  data: {
message: 'You loaded this page on ' + new Date()
  }
})

在浏览器中你会看到

Hover your mouse over me for a few seconds to see my     dynamically bound title!

元素的显示与隐藏，可通过属性seen来控制：
app3.seen = false/true
例子：

html:

<div id="app-3">
      <p v-if="seen">Now you see me ! </p>
</div>

js:

var app3 = new Vue({
  el: '#app-3',
  data: {
    seen: true
  }
})    

当将data下的seen:true 改为 false 后，Now you see me !会消失

循环

比较常用的v-for, 最常见的列表：

html:

<div id="app-4">
      <ol>
        <li v-for="x in xin">
              {{ x.text }}
           </li>
      </ol>
</div>

js:

var app4 = new Vue({
      el: '#app-4',
      data: {
    xin: [
      { text: 'Learn JavaScript' },
      { text: 'Learn Vue' },
      { text: 'Build something awesome' }
    ]
      }
    })

数据渲染：

1 .Learn JavaScript
2 .Learn Vue
3 .Build something awesome

同样，在控制台输入新的内容，列表内容会实时更新

事件监听 v-on

html:

<div id="app-5">
      <p>{{ message }}</p>
      <button v-on:click="reverseMessage">Reverse Message<button>
</div>

js:

var app5 = new Vue({
  el: '#app-5',
  data: {
    message: 'Hello Vue.js!'
  },
  methods: {
    reverseMessage: function () {
  this.message = this.message.split('').reverse().join('')
    }
  }
})

Vue 实例

Vue 实例，实则也就是 ViewModel（数据 + 函数），都是通过构造函数 Vue 创建的：

var data = { a: 1 }
var vm = new Vue({
  el: '#example',
  data: data,
  created: function () {
// `this` 指向 vm 实例
console.log('a is: ' + this.a)
  }
})
vm.$data === data // -> true
vm.$el === document.getElementById('example') // -> true
// $watch 是一个实例方法
vm.$watch('a', function (newVal, oldVal) {
  // 这个回调会在 `vm.a` 改变的时候触发
})

链接：https://zhuanlan.zhihu.com/p/23078117

Vue 实例都有自己的生命周期，比如 created, mounted, updated 以及 destroyed。所有方法被 called 的时候，this 都指向所在的 Vue 实例。

Class 和 Style 绑定

v-bind:class 来动态切换 :

 <div class="static"
     v-bind:class="{ active: isActive, 'text-danger': hasError }">
</div>

<div v-bind:class="classObject"></div>

js:

data: {
  classObject: {
active: true,
'text-danger': false
  }
}

绑定内联样式

<div v-bind:style="{ color: activeColor, fontSize: fontSize +     'px' }"></div>
或者直接绑定到 style：

<div v-bind:style="styleObject"></div>

data: {
  styleObject: {
color: 'red',
fontSize: '13px'
  }
}

key

当 vue 在更新被 v-for 渲染的列表时候，会使用就地 patch 的策略，而不是根据元素改变的顺序。我们可以提供 key 来做这个排序：

<div v-for="item in items" :key="item.id">
  <!-- content -->
</div>
item 会根据 id 来做排序。

Key 修饰符

通用的有使用 keyCode 的:
<input v-on:keyup.13="submit">

局部注册

var Child = {
  template: '<div>A custom component!</div>'
}
new Vue({

  components: {
    <my-component> 
'my-component': Child
  }
})

使用则像:

<div id="example">
      <my-component></my-component>
</div>

props传递数据

注册子组件

Vue.component('child', {
  // 申明 props
  props: ['message'],
  // 跟 data 一样，可以在 vm (this.message) 和 template 中直接使用
  template: '<span>{{ message }}</span>'
})

传递 props:

<child message="hello!"></child>

动态 props

<div>
      <input v-model="parentMsg">
      <br>
      <child v-bind:my-message="parentMsg"></child>
</div>

PHP基础（三）

PHP 表单和用户输入

PHP 中的 $_GET 和 $_POST 变量用于检索表单中的信息，比如用户输入。

PHP 表单处理

有一点很重要的事情值得注意，当处理 HTML 表单时，PHP 能把来自 HTML 页面中的表单元素自动变成可供 PHP 脚本使用。

实例
下面的实例包含了一个 HTML 表单，带有两个输入框和一个提交按钮。
form.html 文件代码如下：

<html>
<head>
<meta charset="utf-8">
<title>php教程(runoob.com)</title>
</head>
<body>

<form action="welcome.php" method="post">
名字: <input type="text" name="fname">
年龄: <input type="text" name="age">
<input type="submit" value="提交">
</form>

</body>
</html>

当用户填写完上面的表单并点击提交按钮时，表单的数据会被送往名为 “welcome.php” 的 PHP 文件：

欢迎 <?php echo $_POST["fname"]; ?>!<br>
你的年龄是 <?php echo $_POST["age"]; ?>  岁。

图片来源：菜鸟教程

PHP 文件处理

fopen() 函数用于在 PHP 中打开文件。

打开文件
fopen() 函数用于在 PHP 中打开文件。
此函数的第一个参数含有要打开的文件的名称，第二个参数规定了使用哪种模式来打开文件：

<html>
<body>

<?php
$file=fopen("welcome.txt","r");
?>

</body>
</html>

模式 描述

r 只读。在文件的开头开始。

r+ 读/写。在文件的开头开始。

w 只写。打开并清空文件的内容；如果文件不存在，则创建新文件。

w+ 读/写。打开并清空文件的内容；如果文件不存在，则创建新文件。

a 追加。打开并向文件末尾进行写操作，如果文件不存在，则创建新文件。

a+ 读/追加。通过向文件末尾写内容，来保持文件内容。

x 只写。创建新文件。如果文件已存在，则返回 FALSE 和一个错误。

x+ 读/写。创建新文件。如果文件已存在，则返回 FALSE 和一个错误。

注释：如果 fopen() 函数无法打开指定文件，则返回 0 (false)。

关闭文件

<?php
$file = fopen("test.txt","r");

//执行一些代码

fclose($file);
?>
fclose() 函数用于关闭打开的文件：

检测文件末尾（EOF）

feof() 函数检测是否已到达文件末尾（EOF）。

在循环遍历未知长度的数据时，feof() 函数很有用。

注释：在 w 、a 和 x 模式下，您无法读取打开的文件！

if (feof($file)) echo “文件结尾”;

if (feof($file)) echo "文件结尾";

逐行读取文件

fgets() 函数用于从文件中逐行读取文件。

注释：在调用该函数之后，文件指针会移动到下一行。

逐字符读取文件

fgetc() 函数用于从文件中逐字符地读取文件。

注释：在调用该函数之后，文件指针会移动到下一个字符。

PHP 文件上传

通过 PHP，可以把文件上传到服务器。

创建一个文件上传表单

允许用户从表单上传文件是非常有用的。

请看下面这个供上传文件的 HTML 表单：

<html>
<head>
<meta charset="utf-8">
<title>php教程(runoob.com)</title>
</head>
<body>

<form action="upload_file.php" method="post" enctype="multipart/form-data">
    <label for="file">文件名：</label>
    <input type="file" name="file" id="file"><br>
    <input type="submit" name="submit" value="提交">
</form>

</body>
</html>

将以上代码保存到 form.html 文件中。

有关上面的 HTML 表单的一些注意项列举如下：

标签的 enctype 属性规定了在提交表单时要使用哪种内容类型。在表单需要二进制数据时，比如文件内容，请使用 “multipart/form-data”。

标签的 type=”file” 属性规定了应该把输入作为文件来处理。举例来说，当在浏览器中预览时，会看到输入框旁边有一个浏览按钮。

注释：允许用户上传文件是一个巨大的安全风险。请仅仅允许可信的用户执行文件上传操作。

创建上传脚本

"upload_file.php" 文件含有供上传文件的代码：
<?php
if ($_FILES["file"]["error"] > 0)
{
echo "错误：" . $_FILES["file"]["error"] . "<br>";
}
else
{
    echo "上传文件名: " . $_FILES["file"]["name"] . "<br>";
    echo "文件类型: " . $_FILES["file"]["type"] . "<br>";
    echo "文件大小: " . ($_FILES["file"]["size"] / 1024) . " kB<br>";
    echo "文件临时存储的位置: " . $_FILES["file"]["tmp_name"];
}
?>

通过使用 PHP 的全局数组 $_FILES，你可以从客户计算机向远程服务器上传文件。

第一个参数是表单的 input name，第二个下标可以是 “name”、”type”、”size”、”tmp_name” 或 “error”。如下所示：

• $_FILES[“file”][“name”] - 上传文件的名称

• $_FILES[“file”][“type”] - 上传文件的类型

• $_FILES[“file”][“size”] - 上传文件的大小，以字节计

• $_FILES[“file”][“tmp_name”] - 存储在服务器的文件的临时副本的名称

• $_FILES[“file”][“error”] - 由文件上传导致的错误代码

这是一种非常简单文件上传方式。基于安全方面的考虑，您应当增加有关允许哪些用户上传文件的限制。

上传限制

在这个脚本中，我们增加了对文件上传的限制。用户只能上传 .gif、.jpeg、.jpg、.png 文件，文件大小必须小于 200 kB：

<?php
// 允许上传的图片后缀
$allowedExts = array("gif", "jpeg", "jpg", "png");
$temp = explode(".", $_FILES["file"]["name"]);
$extension = end($temp);        // 获取文件后缀名
if ((($_FILES["file"]["type"] == "image/gif")
|| ($_FILES["file"]["type"] == "image/jpeg")
|| ($_FILES["file"]["type"] == "image/jpg")
|| ($_FILES["file"]["type"] == "image/pjpeg")
|| ($_FILES["file"]["type"] == "image/x-png")
|| ($_FILES["file"]["type"] == "image/png"))
&& ($_FILES["file"]["size"] < 204800)    // 小于 200 kb
&& in_array($extension, $allowedExts))
{
if ($_FILES["file"]["error"] > 0)
{
    echo "错误：: " . $_FILES["file"]["error"] . "<br>";
}
else
{
    echo "上传文件名: " . $_FILES["file"]["name"] . "<br>";
    echo "文件类型: " . $_FILES["file"]["type"] . "<br>";
    echo "文件大小: " . ($_FILES["file"]["size"] / 1024) . " kB<br>";
    echo "文件临时存储的位置: " . $_FILES["file"]["tmp_name"];
}
}
else
{
echo "非法的文件格式";
}
?>

保存被上传的文件

上面的实例在服务器的 PHP 临时文件夹中创建了一个被上传文件的临时副本。

这个临时的副本文件会在脚本结束时消失。要保存被上传的文件，我们需要把它拷贝到另外的位置：

    <?php
// 允许上传的图片后缀
$allowedExts = array("gif", "jpeg", "jpg", "png");
$temp = explode(".", $_FILES["file"]["name"]);
echo $_FILES["file"]["size"];
$extension = end($temp);     // 获取文件后缀名
if ((($_FILES["file"]["type"] == "image/gif")
|| ($_FILES["file"]["type"] == "image/jpeg")
|| ($_FILES["file"]["type"] == "image/jpg")
|| ($_FILES["file"]["type"] == "image/pjpeg")
|| ($_FILES["file"]["type"] == "image/x-png")
|| ($_FILES["file"]["type"] == "image/png"))
&& ($_FILES["file"]["size"] < 204800)   // 小于 200 kb
&& in_array($extension, $allowedExts))
{
if ($_FILES["file"]["error"] > 0)
{
    echo "错误：: " . $_FILES["file"]["error"] . "<br>";
}
else
{
    echo "上传文件名: " . $_FILES["file"]["name"] . "<br>";
    echo "文件类型: " . $_FILES["file"]["type"] . "<br>";
    echo "文件大小: " . ($_FILES["file"]["size"] / 1024) . " kB<br>";
    echo "文件临时存储的位置: " . $_FILES["file"]["tmp_name"] . "<br>";

    // 判断当期目录下的 upload 目录是否存在该文件
    // 如果没有 upload 目录，你需要创建它，upload 目录权限为 777
    if (file_exists("upload/" . $_FILES["file"]["name"]))
    {
        echo $_FILES["file"]["name"] . " 文件已经存在。 ";
    }
    else
    {
        // 如果 upload 目录不存在该文件则将文件上传到 upload 目录下
        move_uploaded_file($_FILES["file"]["tmp_name"], "upload/" . $_FILES["file"]["name"]);
        echo "文件存储在: " . "upload/" . $_FILES["file"]["name"];
    }
}
}
else
{
echo "非法的文件格式";
}
?>

上面的脚本检测了文件是否已存在，如果不存在，则把文件拷贝到名为 “upload” 的目录下。
文件上传演示操作如下所示：

图片来源：菜鸟教程

使用HTML5中postMessage实现Ajax中的POST跨域问题

HTML5中提供了在网页文档之间相互接收与发送信息的功能。使用这个功能，只要获取到网页所在窗口对象的实例，不仅仅同源(域+端口号)的web网页之间可以互相通信，甚至可以实现跨域通信。
浏览器支持程度：IE8+，firefox4+，chrome8+ opera10+

1.首先，要想接收从其他的窗口发过来的消息，就必须对窗口对象的message事件进行监听，如下代码：

window.addEventListener(“message”, function(){},false);

2.其次，需要使用window对象的postMessage方法向其他窗口发送消息，该方法定义如下所示：

otherWindow.postMessage(message, targetOrigin);

该方法使用2个参数，第一个参数为所发送的消息文本，但也可以是任何javascript对象，第二个参数是接收消息的对象窗口的url地址(比 如：http:127.0.0.1:8080/) , 但是我们也可以在url地址字符串中使用通配符”*”, 指定全部的域下，但是我们还是建议使用特定的域名下，otherWindow为要发送窗口对象的引用。
Demo演示：
假如现在我在hosts文件下 ，绑定2 个域名如下：

127.0.0.1       abc.example.com

127.0.0.1        longen.example.com

现在假如在abc.example.com域下有一个abc.html页面，在longen.example.com域下有def.html页面，现在我是希望这2个不同域名下的页面能互相通信，abc.html代码如下：

<form>  
  <p>  
    <label for="message" style="color:red;font-size:24px;">给iframe子窗口发一个信息：        </label>  
    <input type="text" name="message" value="send" id="message" />  
    <input type="submit" value="submit" id="submit"/>  
  </p>  
</form>  
<h4>目标iframe传来的信息：</h4>  
<p id="test">暂无信息</p> 

 <iframe id="iframe"  
src="http://longen.example.com/webSocket/def.html" style="display:none"></iframe>

JS代码如下：

var win = document.getElementById("iframe").contentWindow;

document.getElementById("submit").onclick = function(e){
e.preventDefault();
win.postMessage(document.getElementById("message").value,"http://    longen.example.com"); }  window.addEventListener("message",function(e){
 e.preventDefault();
 document.getElementById("test").innerHTML = "从" + e.origin + "那里传过来的消息:\n"     + e.data;},false);    

Def.html代码如下：
HTML代码：

<form>  
  <p>  
    <label for="message">给父窗口abc.html发个信息：</label>  
    <input type="text" name="message" value="send" id="message" />  
    <input type="submit" />  
  </p>  
 </form>  
 <p id="test2">暂无信息。</p>

JS代码如下：

 var parentwin = window.parent; 
window.addEventListener("message",function(e){
   document.getElementById("test2").innerHTML = "从父窗口传来的域" +e.origin + "，和    内容数据：" + e.data;  
   parentwin.postMessage('HI!你给我发了"<span>'+e.data+'"</span>。',"http://    abc.example.com");},false);

我们需要知道如下几条信息：

• 通过对window对象的message事件进行监听，可以接收消息。

• 通过访问message事件的origin属性，可以获取消息的发送源。

• 通过访问message事件的data属性，可以取得消息内容。

• 使用postMessage方法发送消息。

• 通过访问message事件的source属性，可以获取消息发送源的窗口对象(准确的说，应该是窗口的代理对象)。
  有了上面的基本知识点，我们可以延伸为实现ajax POST跨域的问题。

二：使用postMessage 知识点解决 ajax中POST跨域问题。

原理：原理也很简单，假如我们的域名abc.example.com下的abc.html页面需要发ajax请求(跨域，域名为

longen.example.com)下，那么我们还是先跨页面文档的形式，和上面一样，我们可以现在

longen.example.com下 建立一个页面，比如叫def.html. 那么我们现在还是在 abc.html 页面嵌入一个隐

藏域iframe src路径指向longen.example.com域下def,html页面。过程还是和跨文档类似，只是现在在

def.html页面中 在window.onmessage 事件内写ajax请求即可，如下代码：

abc.example.com下的abc.html页面如下：

html代码和上面一样，下面是JS代码：

ar win = document.getElementById("iframe").contentWindow;

document.getElementById("submit").onclick = function(e){
  e.preventDefault();
  win.postMessage(document.getElementById("message").value,"http://longen.example.com/"); }  window.addEventListener("message",function(e){
e.preventDefault();
alert(typeof e.data)
var json = JSON.parse(e.data);
 console.log(json);
alert(json.url)},false);

def.html代码如下：
JS代码如下：

//获取跨域数据  
window.onmessage = function(e){  
     $.ajax({
      url: 'http://longen.example.com/webSocket/test.php',
      type:'POST',
      dataType:'text',
      //data: {msg:e.data},
      success: function(res) {
           var parentwin = window.parent;  
           parentwin.postMessage(res,"http://abc.example.com");//跨域发送数据  
      }
      });
 };

test.php代码如下：

<?php 
$data=array(  
 url =>1,
  name =>'2',      'xx-xx'=>"xx"
 );
 echo json_encode($data);?>

如上实现方式 就可以实现ajax post跨域了。

文章参考http://mp.weixin.qq.com/s?__biz=MjM5MDA2MTI1MA==&mid=2649084284&idx=1&sn=fa0fb2d0a163ffb201a756fcd4da529a&chksm=be5bf6d1892c7fc74d84dc53bdf8d4f69cf6c762b4268d67f4b21ded9022ebb2dc069b9cd1b7&mpshare=1&scene=23&srcid=1121m1iYfBMxtp1TfARtoiEw#rd

PHP基础（二）

在 PHP 中创建数组

在 PHP 中，array() 函数用于创建数组：

在 PHP 中，有三种类型的数组：

* 数值数组 - 带有数字 ID 键的数组

* 关联数组 - 带有指定的键的数组，每个键关联一个值

* 多维数组 - 包含一个或多个数组的数组

PHP 数值数组

这里有两种创建数值数组的方法：

自动分配 ID 键（ID 键总是从 0 开始）：

$cars=array("Volvo","BMW","Toyota");

人工分配 ID 键：

$cars[0]="Volvo";
$cars[1]="BMW";
$cars[2]="Toyota";

下面的实例创建一个名为 $cars 的数值数组，并给数组分配三个元素,然后打印一段包含数组值的文本：

<?php
$cars=array("Volvo","BMW","Toyota");
echo "I like " . $cars[0] . ", " . $cars[1] . " and " . $cars[2] . ".";
?>

获取数组的长度 - count() 函数

count() 函数用于返回数组的长度（元素的数量）：

<?php
$cars=array("Volvo","BMW","Toyota");
echo count($cars);
?>

遍历数值数组

遍历并打印数值数组中的所有值，您可以使用 for 循环，如下所示：

<?php
$cars=array("Volvo","BMW","Toyota");
$arrlength=count($cars);

for($x=0;$x<$arrlength;$x++)
{
echo $cars[$x];
echo "<br>";
}
?>

PHP 关联数组

关联数组是使用您分配给数组的指定的键的数组。

这里有两种创建关联数组的方法：

$age=array("Peter"=>"35","Ben"=>"37","Joe"=>"43");

or:

<?php
$age=array("Peter"=>"35","Ben"=>"37","Joe"=>"43");
echo "Peter is " . $age['Peter'] . " years old.";
?>

遍历关联数组

遍历并打印关联数组中的所有值，您可以使用 foreach 循环，如下所示：

<?php
$age=array("Peter"=>"35","Ben"=>"37","Joe"=>"43");

foreach($age as $x=>$x_value)
{
echo "Key=" . $x . ", Value=" . $x_value;
echo "<br>";
}
?>

PHP 数组排序

数组中的元素可以按字母或数字顺序进行降序或升序排列。

sort() - 对数组进行升序排列
rsort() - 对数组进行降序排列
asort() - 根据关联数组的值，对数组进行升序排列
ksort() - 根据关联数组的键，对数组进行升序排列
arsort() - 根据关联数组的值，对数组进行降序排列
krsort() - 根据关联数组的键，对数组进行降序排列

sort() - 对数组进行升序排列

下面的实例将 $cars 数组中的元素按照字母升序排列：

<?php
$cars=array("Volvo","BMW","Toyota");
sort($cars);
?>

下面的实例将 $numbers 数组中的元素按照数字升序排列：

<?php
$numbers=array(4,6,2,22,11);
sort($numbers);
?>

rsort() - 对数组进行降序排列

下面的实例将 $cars 数组中的元素按照字母降序排列：

<?php
$cars=array("Volvo","BMW","Toyota");
rsort($cars);
?>

下面的实例将 $numbers 数组中的元素按照数字降序排列：

<?php
$numbers=array(4,6,2,22,11);
rsort($numbers);
?>

asort() - 根据数组的值，对数组进行升序排列

下面的实例根据数组的值，对关联数组进行升序排列：

<?php
$age=array("Peter"=>"35","Ben"=>"37","Joe"=>"43");
asort($age);
?>

ksort() - 根据数组的键，对数组进行升序排列

下面的实例根据数组的键，对关联数组进行升序排列：

<?php
$age=array("Peter"=>"35","Ben"=>"37","Joe"=>"43");
ksort($age);
?>

PHP 超级全局变量

PHP 超级全局变量列表:
$GLOBALS
$_SERVER
$_REQUEST
$_POST
$_GET
$_FILES
$_ENV
$_COOKIE
$_SESSION

PHP $GLOBALS

$GLOBALS 是PHP的一个超级全局变量组，在一个PHP脚本的全部作用域中都可以访问。

$GLOBALS 是一个包含了全部变量的全局组合数组。变量的名字就是数组的键。

PHP $_SERVER

$_SERVER 是一个包含了诸如头信息(header)、路径(path)、以及脚本位置(script locations)等等信息的数

组。这个数组中的项目由 Web 服务器创建。不能保证每个服务器都提供全部项目；服务器可能会忽略一些，或者提供

一些没有在这里列举出来的项目。

PHP $_POST

PHP $_POST 被广泛应用于收集表单数据，在HTML form标签的指定该属性：”method=”post”。

以下实例显示了一个输入字段（input）及提交按钮(submit)的表单(form)。 当用户通过点击 “Submit” 按钮提

交表单数据时, 表单数据将发送至

标签中 action 属性中指定的脚本文件。 在这个实例中，我们指定文件来

处理表单数据。如果你希望其他的PHP文件来处理该数据，你可以修改该指定的脚本文件名。 然后，我们可以使用超级

全局变量 $_POST 来收集表单中的 input 字段数据:

<html>
<body>

<form method="post" action="<?php echo $_SERVER['PHP_SELF'];?>">
Name: <input type="text" name="fname">
<input type="submit">
</form>

<?php 
$name = $_POST['fname']; 
echo $name; 
?>

</body>
</html>

PHP $_GET

PHP $_GET 同样被广泛应用于收集表单数据，在HTML form标签的指定该属性：”method=”get”。

$_GET 也可以收集URL中发送的数据。

假定我们有一个包含参数的超链接HTML页面：

<html>
<body>

<a href="test_get.php?subject=PHP&web=runoob.com">Test $GET</a>

</body>
</html>

当用户点击链接 “Test $GET”, 参数 “subject” 和 “web” 将发送至”test_get.php”,你可以在 “test_get.php”

文件中使用 $_GET 变量来获取这些数据。

以下实例显示了 “test_get.php” 文件的代码:

<html>
<body>

<?php 
echo "Study " . $_GET['subject'] . " at " . $_GET['web'];
?>

</body>
</html>

PHP 魔术变量

PHP 向它运行的任何脚本提供了大量的预定义常量。

不过很多常量都是由不同的扩展库定义的，只有在加载了这些扩展库时才会出现，或者动态加载后，或者在编译时已经包括进去了。
有八个魔术常量它们的值随着它们在代码中的位置改变而改变。
例如 LINE 的值就依赖于它在脚本中所处的行来决定。这些特殊的常量不区分大小写，如下：

LINE

文件中的当前行号。

<?php
echo '这是第 " '  . __LINE__ . ' " 行';
?>

以上实例输出结果为：

这是第 “ 2 ” 行

FILE

文件的完整路径和文件名。如果用在被包含文件中，则返回被包含的文件名。
自 PHP 4.0.2 起，FILE 总是包含一个绝对路径（如果是符号连接，则是解析后的绝对路径），而在此之前的版本有时会包含一个相对路径。
实例:

<?php
echo '该文件位于 " '  . __FILE__ . ' " ';
?>    

以上实例输出结果为：

该文件位于 “ E:\wamp\www\test\index.php ”

DIR

文件所在的目录。如果用在被包括文件中，则返回被包括的文件所在的目录。

它等价于 dirname(FILE)。除非是根目录，否则目录中名不包括末尾的斜杠。（PHP 5.3.0中新增）

<?php
echo '该文件位于 " '  . __DIR__ . ' " ';
?>

以上实例输出结果为：

该文件位于 “ E:\wamp\www\test ”

FUNCTION

函数名称（PHP 4.3.0 新加）。自 PHP 5 起本常量返回该函数被定义时的名字（区分大小写）。在 PHP 4 中该值总是小写字母的

<?php
function test() {
echo  '函数名为：' . __FUNCTION__ ;
}
test();
?>

CLASS

类的名称（PHP 4.3.0 新加）。自 PHP 5 起本常量返回该类被定义时的名字（区分大小写）。
在 PHP 4 中该值总是小写字母的。类名包括其被声明的作用区域（例如 Foo\Bar）。注意自 PHP 5.4 起 CLASS 对 trait 也起作用。当用在 trait 方法中时，CLASS 是调用 trait 方法的类的名字。

 <?php
class test {
function _print() {
    echo '类名为：'  . __CLASS__ . "<br>";
    echo  '函数名为：' . __FUNCTION__ ;
    }
}
$t = new test();
$t->_print();
?>

以上实例输出结果为：

类名为：test

函数名为：_print

TRAIT

Trait 的名字（PHP 5.4.0 新加）。自 PHP 5.4.0 起，PHP 实现了代码复用的一个方法，称为 traits。
Trait 名包括其被声明的作用区域（例如 Foo\Bar）。
从基类继承的成员被插入的 SayWorld Trait 中的 MyHelloWorld 方法所覆盖。其行为 MyHelloWorld 类中定义的方法一致。优先顺序是当前类中的方法会覆盖 trait 方法，而 trait 方法又覆盖了基类中的方法。

实例

<?php
class Base {
public function sayHello() {
    echo 'Hello ';
}
}

trait SayWorld {
    public function sayHello() {
    parent::sayHello();
    echo 'World!';
}
}

class MyHelloWorld extends Base {
use SayWorld;
}

$o = new MyHelloWorld();
$o->sayHello();
?>

以上例程会输出：

Hello World!

METHOD

类的方法名（PHP 5.0.0 新加）。返回该方法被定义时的名字（区分大小写）。

实例:

<?php
function test() {
echo  '函数名为：' . __METHOD__ ;
}
test();
?>

以上实例输出结果为：

函数名为：test

NAMESPACE

当前命名空间的名称（区分大小写）。此常量是在编译时定义的（PHP 5.3.0 新增）。

实例:

<?php
namespace MyProject;

echo '命名空间为："', __NAMESPACE__, '"'; // 输出 "MyProject"
?>

以上实例输出结果为：

命名空间为："MyProject"

PHP基础（一）

PHP 是一种创建动态交互性站点的强有力的服务器端脚本语言。

PHP 是什么？

• PHP（全称：PHP：Hypertext Preprocessor，即”PHP：超文本预处理器”）是一种通用开源脚本语言。
• PHP 脚本在服务器上执行。
• PHP 可免费下载使用。

PHP 文件是什么？

• PHP 文件可包含文本、HTML、JavaScript代码和 PHP 代码

• PHP 代码在服务器上执行，结果以纯 HTML 形式返回给浏览器

• PHP 文件的默认文件扩展名是 “.php”

PHP 能做什么？

• PHP 可以生成动态页面内容

• PHP 可以创建、打开、读取、写入、关闭服务器上的文件

• PHP 可以收集表单数据

• PHP 可以发送和接收 cookies

• PHP 可以添加、删除、修改您的数据库中的数据

• PHP 可以限制用户访问您的网站上的一些页面

• PHP 可以加密数据

为什么使用 PHP？

• PHP 可在不同的平台上运行（Windows、Linux、Unix、Mac OS X 等）

• PHP 与目前几乎所有的正在被使用的服务器相兼容（Apache、IIS 等）

• PHP 提供了广泛的数据库支持

• PHP 是免费的，可从官方的 PHP 资源下载它： www.php.net

• PHP 易于学习，并可高效地运行在服务器端

基本的 PHP 语法

PHP 脚本可以放在文档中的任何位置。

PHP 脚本以 <?php 开始，以 ?> 结束：

<?php
// PHP 代码
?>

PHP 文件的默认文件扩展名是 “.php”。

PHP 文件通常包含 HTML 标签和一些 PHP 脚本代码。

下面，我们提供了一个简单的 PHP 文件实例，它可以向浏览器输出文本 “Hello World!”：

<!DOCTYPE html> 
<html> 
<body> 

 <h1>My first PHP page</h1> 

<?php 
echo "Hello World!"; 
?> 

</body> 
</html>

PHP 中的每个代码行都必须以分号结束。分号是一种分隔符，用于把指令集区分开来。

通过 PHP，有两种在浏览器输出文本的基础指令：echo 和 print。

PHP 中的注释

<!DOCTYPE html>
<html>
<body>

    <?php
    // 这是 PHP 单行注释

    /*
    这是 
    PHP 多行
    注释
    */
    ?>

</body>
</html>

PHP 变量

变量是用于存储信息的”容器”：

<?php
$x=5;
$y=6;
$z=$x+$y;
echo $z;
?>

与代数类似，可以给 PHP 变量赋予某个值（x=5）或者表达式（z=x+y）。
变量可以是很短的名称（如 x 和 y）或者更具描述性的名称（如 age、carname、totalvolume）。
PHP 变量规则：

变量以 $ 符号开始，后面跟着变量的名称
变量名必须以字母或者下划线字符开始
变量名只能包含字母数字字符以及下划线（A-z、0-9 和 _ ）
变量名不能包含空格
变量名是区分大小写的（$y 和 $Y 是两个不同的变量）

PHP 变量作用域

变量的作用域是脚本中变量可被引用/使用的部分。
PHP 有四种不同的变量作用域：

local
global
static
parameter

局部和全局作用域
在所有函数外部定义的变量，拥有全局作用域。除了函数外，全局变量可以被脚本中的任何部分访问，要在一个函数中访问一个全局变量，需要使用 global 关键字。
在 PHP 函数内部声明的变量是局部变量，仅能在函数内部访问：

<?php 
$x=5; // 全局变量 

function myTest() 
{ 
$y=10; // 局部变量 
echo "<p>测试函数内变量:<p>"; 
echo "变量 x 为: $x"; 
echo "<br>"; 
echo "变量 y 为: $y"; 
}  

myTest(); 

echo "<p>测试函数外变量:<p>"; 
echo "变量 x 为: $x"; 
echo "<br>"; 
echo "变量 y 为: $y"; 
?>

在以上实例中 myTest() 函数定义了 $x 和 $y 变量。 $x 变量在函数外声明，所以它是全局变量 ， $y 变量在函数内声明所以它是局部变量。
当我们调用myTest()函数并输出两个变量的值, 函数将会输出局部变量 $y 的值，但是不能输出 $x 的值，因为 $x 变量在函数外定义，无法在函数内使用，如果要在一个函数中访问一个全局变量，需要使用 global 关键字。
然后我们在myTest()函数外输出两个变量的值，函数将会输出全局部变量 $x 的值，但是不能输出 $y 的值，因为 $y 变量在函数中定义，属于局部变量。
你可以在不同函数中使用相同的变量名称，因为这些函数内定义的变量名是局部变量，只作用于该函数内。

PHP global 关键字

global 关键字用于函数内访问全局变量。
在函数内调用函数外定义的全局变量，我们需要在函数中的变量前加上 global 关键字：

<?php
$x=5;
$y=10;

function myTest()
{
global $x,$y;
$y=$x+$y;
}

myTest();
echo $y; // 输出 15
?>

PHP 将所有全局变量存储在一个名为 $GLOBALS[index] 的数组中。 index 保存变量的名称。这个数组可以在函数内部访问，也可以直接用来更新全局变量。
上面的实例可以写成这样：

<?php
$x=5;
$y=10;

function myTest()
{
$GLOBALS['y']=$GLOBALS['x']+$GLOBALS['y'];
} 

myTest();
echo $y;
?>

Static 作用域
当一个函数完成时，它的所有变量通常都会被删除。然而，有时候您希望某个局部变量不要被删除。
要做到这一点，请在您第一次声明变量时使用 static 关键字：

<?php

function myTest()
{
static $x=0;
echo $x;
$x++;
}

myTest();
myTest();
myTest();

?>

然后，每次调用该函数时，该变量将会保留着函数前一次被调用时的值。

注释：该变量仍然是函数的局部变量。

参数作用域

参数是通过调用代码将值传递给函数的局部变量。

参数是在参数列表中声明的，作为函数声明的一部分：

<?php

function myTest($x)
{
echo $x;
}

myTest(5);

?>

echo 和 print 语句

在 PHP 中有两个基本的输出方式： echo 和 print。

echo 和 print 区别:

* echo - 可以输出一个或多个字符串    
* print - 只允许输出一个字符串，返回值总为 1

数据类型

String（字符串）, Integer（整型）, Float（浮点型）, Boolean（布尔型）, Array（数组）, Object（对象）, NULL（空值）。

常量

常量是一个简单值的标识符。该值在脚本中不能改变。
一个常量由英文字母、下划线、和数字组成,但数字不能作为首字母出现。 (常量名不需要加 $ 修饰符)。
注意： 常量在整个脚本中都可以使用。

设置常量，使用 define() 函数，函数语法如下：

bool define ( string $name , mixed $value [, bool $case_insensitive = false ] )

该函数有三个参数:

• name：必选参数，常量名称，即标志符。
• value：必选参数，常量的值。
• case_insensitive ：可选参数，如果设置为 TRUE，该常量则大小写不敏感。默认是大小写敏感的。

以下实例我们创建一个 区分大小写的常量, 常量值为 “欢迎访问 Runoob.com”：

<?php
// 区分大小写的常量名
define("GREETING", "欢迎访问 Runoob.com");
echo GREETING;    // 输出 "欢迎访问 Runoob.com"
echo '<br>';
echo greeting;   // 输出 "greeting"
?>

以下实例我们创建一个 不区分大小写的常量, 常量值为 “欢迎访问 Runoob.com”：

<?php
// 不区分大小写的常量名
define("GREETING", "欢迎访问 Runoob.com", true);
echo greeting;  // 输出 "欢迎访问 Runoob.com"
?>

常量是全局的

常量在定义后，默认是全局变量，可以在整个运行的脚本的任何地方使用。

PHP If…Else 语句

在 PHP 中，提供了下列条件语句：

if 语句 - 在条件成立时执行代码

<?php
$t=date("H");
if ($t<"20")
{
    echo "Have a good day!";
}
?>

if…else 语句 - 在条件成立时执行一块代码，条件不成立时执行另一块代码

if (条件)
{
条件成立时执行的代码;
}
else
{
条件不成立时执行的代码;
}

if…else if….else 语句 - 在若干条件之一成立时执行一个代码块

<?php
$t=date("H");
if ($t<"10")
{
echo "Have a good morning!";
}
else if ($t<"20")
{
echo "Have a good day!";
}
else
{
echo "Have a good night!";
}
?>

switch 语句 - 在若干条件之一成立时执行一个代码块

switch 语句用于根据多个不同条件执行不同动作。

switch (n)
{
    case label1:
    如果 n=label1，此处代码将执行;
    break;
    case label2:
    如果 n=label2，此处代码将执行;
    break;
    default:
    如果 n 既不等于 label1 也不等于 label2，此处代码将执行;
}

工作原理：首先对一个简单的表达式 n（通常是变量）进行一次计算。将表达式的值与结构中每个 case 的值进行比较。如果存在匹配，则执行与 case 关联的代码。代码执行后，使用 break 来阻止代码跳入下一个 case 中继续执行。default 语句用于不存在匹配（即没有 case 为真）时执行。

那些不推荐使用的html标签

1、acronym

首字母缩写，例如WWW
类似的有abbr标签，表示单词缩写，例如inc.。语法如下：

<acronym title="World Wide Web">WWW</acronym>
<abbr title="incorporated">inc.</abbr>

推荐用abbr，不要用acronym（忽略上面提到的语义上的差异）

2、applet

Java小应用程序，主要提供绘图功能（在页面上通过代码绘制一些东西），例如：

<applet code="ShowImage.class" width=600 height=400 archive="Imagetest.jar"></applet>

目前几乎没什么用了，因为运行需要JRE，而目前主流浏览器并不默认安装JRE
推荐使用canvas绘图，或者用object+embed嵌入flash代替applet
注意：使用object+embed是为了更好的兼容性，如果场景允许，推荐使用object

3、basefont

basefont标签定义基准字体。该标签可以为文档中的所有文本定义默认字体颜色、字体大小和字体系列，例如：

<basefont color="red" size="5" face="Arial" />

basefont标签只有[IE9-]支持
推荐直接给body元素定义默认字体，所有子元素都会继承这些属性值

4、bgsound

用来添加背景音乐，例如：

<bgsound src="your.mid" autostart="true" loop="infinite">

推荐使用audio或者object+embed来代替，例如：

<embed src="your.mid" autostart="true" loop="true" hidden="true">

5、big

用来放大字体，放大一号（嵌套多层可以放大更多），不支持的浏览器显示粗体，例如：

<big>大1号</big><big><big>大2号</big></big>

至于“号”是怎么定义的就别管了，不推荐使用，建议根据语义采用em、strong或者自定义样式类代替

6、blink

可以实现闪烁效果，例如：

<blink>Why would somebody use this?</blink>

支持性很差，不推荐使用，同样不推荐使用（各大浏览器支持blink值，但没有任何效果）：

<p style="text-decoration: blink">This should be avoided as well.</p>

建议采用animation代替

7、center

使内容居中，例如：

<center>文本及子元素会居中</center>

效果类似于CSS：

text-align: center;

不建议使用，确实没有任何理由去用

8、dir

目录列表，例如：

<dir>
<li>html</li>
<li>xhtml</li>
<li>css</li>
</dir>

效果和ul基本相同，浏览器默认样式下列表项的左边距有细微差异
不推荐使用，建议根据语义采用ul、ol或者dl

9、font

用来定义字体、字号和颜色，例如：

<font face="verdana" color="green" size="3">This is some text!</font>

属性值和basefont一样
不推荐使用，建议用CSS代替，没理由用这个标签

10、frame
配合frameset分栏，例如：

<!DOCTYPE html>
<html>

<frameset cols="25%,*,25%">
     <frame src="frame_a.htm">
      <frame src="frame_b.htm">
      <frame src="frame_c.htm">
    </frameset>

</html>

注意：用frameset替换掉body
复杂的后台页面会用到frameset+frame布局，当然也可以采用float/flex+Ajax实现，根据具体场景来定

11、frameset
见frame

12、hgroup

给一系列标题分组，例如：

<hgroup>
       <h1>The reality dysfunction</h1>
       <h2>Space is not the only void</h2>
</hgroup>

13、isindex

单行文本控件，初始显示prompt值，例如：

<isindex prompt="string" />

目前支持性很差，不推荐使用，建议用input元素代替
W3C建议千万不要用：

No, really, don’t use it. This element is deprecated. It is not implemented anymore.

引自W3C wiki

具体用法可以参考http://reference.sitepoint.com/html/isindex

14、listing
不用管它是什么，微软都不建议使用了：

This element is obsolete and should no longer be used. Use HTMLPreElement, code or CSS instead. Renders text in a fixed-width font.

引自MSDN listing element | listing object

15、marquee

滚动字幕，效果很强大，例如：

<marquee style="height: 104px; width: 22.35%; margin: 10px 20px; background-    color: rgb(204, 255, 255);" bgcolor="#ccffff" vspace="10" direction="up"      width="22.35%" loop="3" scrollamount="1" scrolldelay="10" hspace="20">
<p align="center"><font color="#000000">此处输入滚动内容</font></p></marquee>

<marquee>这里是输入文字的地方，还可以放图片代码、Flash动画代码和gif动态小图代码。</marquee>

多用来实现公告，虽然已经过时了，但效果确实很强大，而且支持性良好

16、multicol

用来实现多列布局，不建议使用，任何主流浏览器都不曾支持过

The HTML element was an experimental element designed to allow multi-column layouts. It never got any significant traction and is not implemented in any major browsers.

引自MDN multicol

17、nextid

作用未知，支持性未知，不建议使用

18、nobr
禁止换行，例如：

<p>Our telephone number is <nobr>0800 123 123 123</nobr>.</p>

不推荐使用，建议用CSS代替：

white-space: nowrap;

19、noembed

在浏览器不支持embed时，显示内容，类似于noscript，例如：

<noembed>
<img  data-original="/images/inflate.jpg" alt="Inflate the tyre by holding the
pump at 90 degree angle to the valve">
<p>You can inflate the tyre by holding the pump at 90 degree angle
to the valve, as shown in the image above.</p>
</noembed>

不推荐使用，如果需要考虑兼容性的话，建议采用object+embed+noembed（embed/noembed作为object的fallback）

20、noframes

在浏览器不支持frameset+frame时，显示内容，类似于noscript，例如：

<html>

<frameset cols="25%,50%,25%">
  <frame src="frame_a.htm">
  <frame src="frame_b.htm">
  <frame src="frame_c.htm">
  <noframes>Sorry, your browser does not handle frames!</noframes>
</frameset>

</html>

noframe标签中可以包含任何能够出现在body中的标签
如果需要考虑兼容性的话，可以作为frame的fallback，建议采用float/flex+Ajax实现，根据具体场景来定

21、plaintext
忽略内容中的html标签，作用类似于pre，例如：

<p>The markup for this is:</p>
<plaintext>
    <h1>Main heading goes here</h1>
    <p>First paragraph goes here</p>
    <h2>Sub-heading goes here</h2>
</plaintext>.

</body>
</html>

22、spacer

插入空白（white spaces），例如：

<span>Just a text node</span>
<spacer type="horizontal" size="10"></spacer>
<span>Just another text node</span>
<spacer type="block"  ></spacer>

主流浏览器都不支持，不推荐使用

23、strike
删除线，效果类似于del和s，例如：

<p>Version 2.0 is <strike>not yet available!</strike> now available!</p>

不推荐使用，建议用del代替

24、tt

键盘输入（teletype），例如：

<p><tt>Teletype text</tt></p>

不推荐使用，建议根据语义用kbd（键盘按键）、var（变量）、code（代码）、samp（样例输出）或者CSS代替

25、xmp

80列的样例输出，样式效果类似于pre，语义类似于samp，例如：

<xmp>
Stock ID    Description             Price         Quantity in Stock
--------    -----------             -----         -----------------
116         Inflatable Armchair     21.50                13
119         Walkie Talkie           40.20                44
</xmp>

目前浏览器支持该标签，但不限制80列
不推荐使用，建议采用samp代替

本文转自 http://mp.weixin.qq.com/s?__biz=MjM5MDA2MTI1MA==&mid=2649084269&idx=2&sn=5245980904cec7883e80496c323d6c88&chksm=be5bf6c0892c7fd6ee472365f77e128c916488cf615376632bd623e8fee8fb0103752615e427&mpshare=1&scene=23&srcid=1121hr1dAV1IrDMndF3jgFCy#rd