前端小技巧（2）

1.BOM DOM

DOM：文档对象模型 document

描述了处理网页内容的方法和接口

由于DOM的操作对象是文档，所以DOM和浏览器没有直接关系。

BOM：浏览器对象模型

描述了与浏览器进行交互的方法和接口

由navigator、history、screen、location、window五个对象组成的，最根本对象是window

用来获取或设置浏览器的属性、行为，例如：新建窗口、获取屏幕分辨率、浏览器版本号等

浏览器的标签页、地址栏、搜索栏、菜单栏、滚动条等。

2.java

问题数据库查询方法

StringBuffer bf = new StringBuffer();

bf.append("sql");

[].setSqlText(bf.toString());

result = this.getDateAccessManager().queryForList(tabledef,[],[传值]);

Collections.shuffle();//打乱顺序

多数据源
spring Boot框架

3.sql

随机查询多少条数据

selet * from [] where ... order by rand() fetch first [条数] rows only

4.es6 和 noode 问题

模块化开发 import

node 回调函数


router.toute('').get();

router.toute('').post();


router.route(url).post(function(req,res,next){
    var value = req.body.key;
    req.write(post_data);
    req.end();
})

$.post(url,data,function(result){
    console.log(result);
})

router.route(url).get(function(req,res,next){
    req.session.codeStatus = '200';
    req.originalUrl 
    req.ip
    res.render(url)
    next()
})

5.express 框架

var express = require('express);
var app = express();
var router = express.Router();

node express 框架 next（）

express中间件函数的时候都会将第三个参数定义为next

定义路由中间件的时候函数的第三个参数next和我们定义非路由中间件的函数的第三个参数next不是同一个next

6.npm install -save 和 -save-dev

npm install moduleName # 安装模块到项目目录下

npm install -g moduleName # -g 的意思是将模块安装到全局，具体安装到磁盘哪个位置，要看 npm config prefix 的位置。

npm install -save moduleName # -save 的意思是将模块安装到项目目录下，并在package文件的dependencies节点写入依赖。

npm install -save-dev moduleName # -save-dev 的意思是将模块安装到项目目录下，并在package文件的devDependencies节点写入依赖。

npm install moduleName 命令

安装模块到项目node_modules目录下。
不会将模块依赖写入devDependencies或dependencies 节点。
运行 npm install 初始化项目时不会下载模块。
npm install -g moduleName 命令
安装模块到全局，不会在项目node_modules目录中保存模块包。
不会将模块依赖写入devDependencies或dependencies 节点。
运行 npm install 初始化项目时不会下载模块。
npm install -save moduleName 命令
安装模块到项目node_modules目录下。
会将模块依赖写入dependencies 节点。
运行 npm install 初始化项目时，会将模块下载到项目目录下。
运行npm install --production或者注明NODE_ENV变量值为production时，会自动下载模块到node_modules目录中。
npm install -save-dev moduleName 命令
安装模块到项目node_modules目录下。
会将模块依赖写入devDependencies 节点。
运行 npm install 初始化项目时，会将模块下载到项目目录下。
运行npm install --production或者注明NODE_ENV变量值为production时，不会自动下载模块到node_modules目录中。

7.node zookeeper

8.Browserify和Webpack工具

Gulp和Browserify

9.修改npm的registry为淘宝镜像(npm.taobao.org)

通过config命令
npm config set registry https://registry.npm.taobao.org 

npm info underscore

命令行指定
npm --registry https://registry.npm.taobao.org info underscore 

编辑 ~/.npmrc 加入下面内容

registry = https://registry.npm.taobao.or

搜索镜像: https://npm.taobao.org

建立或使用镜像,参考: https://github.com/cnpm/cnpmjs.org

10. 文件 xx.jade 文件

基于 node html 模板引擎

11.es6 新特性

 模块 Modules(Import)

// ES6
function Add(x) {
  return x + x;
}

export default Add;

// ES5
function Add(x) {
  return x + x;
}

module.exports = Add;

箭头函数（和this有关系）this 指向

$.ajax({ type: 'POST', url: '/api/characters', 
        data: { name: name, gender: gender } })
  .done(function(data) {
    this.setState({ helpBlock: data.message });
  }.bind(this))
  .fail(function(jqXhr) {
    this.setState({ helpBlock: jqXhr.responseJSON.message });
  }.bind(this))
  .always(function() {
    this.setState({ name: '', gender: '' });
  }.bind(this));
  
  
  -------------------------------------
  
  $.ajax({ type: 'POST', url: '/api/characters',
       data: { name: name, gender: gender } })
  .done((data) => {
    this.setState({ helpBlock: data.message });
  })
  .fail((jqXhr) => {
    this.setState({ helpBlock: jqXhr.responseJSON.message });
  })
  .always(() => {
    this.setState({ name: '', gender: '' });
  });

解构赋值 var & let

语法糖 class
// ES6
class Box {
  constructor(length, width) {
    this.length = length;
    this.width = width;
  }
  calculateArea() {
    return this.length * this.width;
  }
}

let box = new Box(2, 2);

box.calculateArea();

// ES5
function Box(length, width) {
  this.length = length;
  this.width = width;
}

Box.prototype.calculateArea = function() {
  return this.length * this.width;
}

var box = new Box(2, 2);

box.calculateArea();


ES6中还可以用extends关键字来创建子类

class MyComponent extends React.Component {
  // Now MyComponent class contains all React component methods
  // such as componentDidMount(), render() and etc.
}

12.AST 抽象语法树

13.SDK

14.linux / windows 端口映射

windows

host 文件配置虚拟域名 IP 域名

linux

iptables -t 表名 <-A/I/D/R> 规则链名 [规则号] <-i/o 网卡名> -p 协议名 <-s 源IP/源子网> --sport 源端口 <-d 目标IP/目标子网> --dport 目标端口 -j 动作

iptables -t nat -A PEWROUTING -p tcp -d [IP] --dport [端口] -j REFIRECT --to-port [端口]

-t<表>：指定要操纵的表；
-A：向规则链中添加条目；
-D：从规则链中删除条目；
-i：向规则链中插入条目；
-R：替换规则链中的条目；
-L：显示规则链中已有的条目；
-F：清楚规则链中已有的条目；
-Z：清空规则链中的数据包计算器和字节计数器；
-N：创建新的用户自定义规则链；
-P：定义规则链中的默认目标；
-h：显示帮助信息；
-p：指定要匹配的数据包协议类型；
-s：指定要匹配的数据包源ip地址；
-j<目标>：指定要跳转的目标；
-i<网络接口>：指定数据包进入本机的网络接口；
-o<网络接口>：指定数据包要离开本机所使用的网络接口。

表名包括

raw：高级功能，如：网址过滤。
mangle：数据包修改（QOS），用于实现服务质量。
net：地址转换，用于网关路由器。
filter：包过滤，用于防火墙规则。

规则链名包括：

INPUT链：处理输入数据包。
OUTPUT链：处理输出数据包。
PORWARD链：处理转发数据包。
PREROUTING链：用于目标地址转换（DNAT）。
POSTOUTING链：用于源地址转换（SNAT）。

动作包括：

accept：接收数据包。
DROP：丢弃数据包。
REDIRECT：重定向、映射、透明代理。
SNAT：源地址转换。
DNAT：目标地址转换。
MASQUERADE：IP伪装（NAT），用于ADSL。
LOG：日志记录。

清除已有iptables规则

iptables -F
iptables -X
iptables -Z

开放指定的端口

iptables -A INPUT -s 127.0.0.1 -d 127.0.0.1 -j ACCEPT
允许本地回环接口(即运行本机访问本机)

iptables -A INPUT -m state --state ESTABLISHED,RELATED -j ACCEPT
允许已建立的或相关连的通行

iptables -A OUTPUT -j ACCEPT
允许所有本机向外的访问

iptables -A INPUT -p tcp --dport 22 -j ACCEPT
允许访问22端口

iptables -A INPUT -p tcp --dport 80 -j ACCEPT
允许访问80端口

iptables -A INPUT -p tcp --dport 21 -j ACCEPT
允许ftp服务的21端口

iptables -A INPUT -p tcp --dport 20 -j ACCEPT
允许FTP服务的20端口

iptables -A INPUT -j reject

禁止其他未允许的规则访问

iptables -A FORWARD -j REJECT