let request = new XMLHttpRequest() // 1.产生这个对象
request.open('GET', '/xxx') //2.初始化 request
request.send() // 3.发送这个对象
request.onreadystatechange = ()=>{ // 4.监听这个对象 readystate的变化
	if(request.readyState === 4){ //请求相应完毕
		if(request.status >= 200 && request.status <= 3 00){
			console.log('请求成功')
			let string = request.responseText // 后端返回的信息（字符串类型）
			let object = window.JSON.parse(string) // 将 JSON 字符串 转换成 JS 对应的类型（字符串，数组，对象。。。）
		}else if(request.status >= 400){
			console.log('请求失败')
		}
	}
}

var http = require('http')
var fs = require('fs')
var url = require('url')
var port = process.argv[2]

if(!port){
  console.log('请指定端口号好不啦？\nnode server.js 8888 这样不会吗？')
  process.exit(1)
}

var server = http.createServer(function(request, response){
  var parsedUrl = url.parse(request.url, true)
  var pathWithQuery = request.url
  var queryString = ''
  if(pathWithQuery.indexOf('?') >= 0){ queryString = pathWithQuery.substring(pathWithQuery.indexOf('?')) }
  var path = parsedUrl.pathname
  var query = parsedUrl.query
  var method = request.method

  /******** 从这里开始看，上面不要看 ************/

  console.log('得到 HTTP 路径\n' + path)

if(path === '/'){
  var string = fs.readFileSync('./index.html','utf8')
  response.statusCode = 200
  response.setHeader('Content-Type','text/html; charset=utf-8')
  response.write(string)
  response.end()
}else if(path === '/main.js'){
  var string = fs.readFileSync('./main.js','utf8')
  response.statusCode = 200
  response.setHeader('Content-Type','text/javascript; charset=utf-8')
  response.write(string)
  response.end()
}else if(path === '/jQuery-ajax.js'){
  var string = fs.readFileSync('./jQuery-ajax.js','utf8')
  response.statusCode = 200
  response.setHeader('Content-Type','text/javascript; charset=utf-8')
  response.write(string)
  response.end()
}else if(path === '/promise.js'){
  var string = fs.readFileSync('./promise.js','utf8')
  response.statusCode = 200
  response.setHeader('Content-Type','text/javascript; charset=utf-8')
  response.write(string)
  response.end()
}else{
  response.statusCode = 404
  response.setHeader('Content-Type', 'text/html;charset=utf-8')
  response.write(`
    {
      "error": "not found"
    }
  `)
  response.end()
}

  /******** 代码结束，下面不要看 ************/
})

server.listen(port)
console.log('监听 ' + port + ' 成功\n请用在空中转体720度然后用电饭煲打开 http://localhost:' + port)

else if(path === '/sign_up' && method === 'GET'){ //当打开 sign_up，并且 method === 'GET' 时
  var string = fs.readFileSync('sign_up.html','utf8')
  response.statusCode = 200
  response.setHeader('Content-Type','text/html; charset=utf-8')
  response.write(string)
  response.end()
}

//node http get post data
function readBody(request){
  let body = [] //
  return new Promise((resolve, reject) => {
    request.on('data', (chunk) => {
      body.push(chunk);
    }).on('end', () => {
      body = Buffer.concat(body).toString();
      resolve(body)
    })
  })
}

else if(path === '/sign_up' && method === 'POST'){//当打开 sign_up，并且 method === '' 时
  readBody(request).then((body) => { //读取输入的数据（email=1%40&password=1&password_confirmation=1）
    let strings = body.split('&') //用 split 分离（分别输入1@，1，1 得到[ 'email=1%40', 'password=1', 'password_confirmation=1' ]）
    let hash = {}
    strings.forEach((string) => {
      let parts = string.split('=') //[ 'email', '1%40' ][ 'password', '1' ][ 'password_confirmation', '1' ]
      let key = parts[0] //email password password_confirmation
      let value = parts[1] //1%40 1 1
      hash[key] = decodeURIComponent(value) //decodeURIComponent 用于将@ 转换(hash['email']='1@')
    })

    let {email, password, password_confirmation} = hash
    if(email.indexOf('@') === -1){ //如果 email 里面没有@
      response.statusCode = 400 //那么就 400
      response.setHeader('Content-Type','application/json; charset=utf-8') //此处标明为 JSON语法
      // 以下代码是后端的
      response.write(`{
        "errors":{
          "email": "invalid"
        }
      }`)
    }else if(password !== password_confirmation){ //如果 密码 与 确认密码不一样
      response.statusCode = 400
      response.write('password is not same')
    }else{
      var users = fs.readFileSync('./db/users', 'utf8') //users
      // 如果 有问题 就 清空
      try{
        users = JSON.parse(users) //[]
      }catch(exception){
        users = []
      }

      // 用户是否已存在
      let inUse = false //先默认没有注册
      for(let i=0;i<users.length;i++){
        let user = users[i]
        if(user.email === email){
          inUse = true //如果被占用
          break; //阻止注册
        }
      }
      if(inUse){ //如果用户被占用
        response.statusCode = 400 //提示错误400
        response.write('email in use') //并提示 'email in use'
      }else{ //如果没有被占用
        users.push({email: email, password: password})
        var usersString = JSON.stringify(users)
        fs.writeFileSync('./db/users', usersString)
        response.statusCode = 200
      }
    }
    response.end()
  })
}

else if(path === '/sign_in' && method === 'GET'){
    var string = fs.readFileSync('sign_in.html','utf8')
    response.statusCode = 200
    response.setHeader('Content-Type','text/html; charset=utf-8')
    response.write(string)
    response.end()
  }else if(path === '/sign_in' && method === 'POST'){
    readBody(request).then((body) => {
      let strings = body.split('&')
      let hash = {}
      strings.forEach((string) => {
        let parts = string.split('=')
        let key = parts[0]
        let value = parts[1]
        hash[key] = decodeURIComponent(value) //decodeURIComponent 用于将@ 转换
      })
      let {email, password} = hash
      var users = fs.readFileSync('./db/users', 'utf8')
      try{
        users = JSON.parse(users) //[]
      }catch(exception){
        users = []
      }
      let found
      for(let i=0;i<users.length;i++){
        if(users[i].email === email && users[i].password === password){
          found = true
          break;
        }
      }
      if(found){
        response.setHeader('Set-Cookie', `sign_in_email=${email}; HttpOnly`) // HttpOnly,禁止用户擅自修改cookie
        response.statusCode = 200
      }else{
        response.statusCode = 401
      }
      response.end()
    })
  }

myBtn.addEventListener('click',(e)=>{
	//(1) 初始化XMLHttpRequest对象（产生对象）
	let request = new XMLHttpRequest()
	//(2) 指定响应处理函数（配置对象）
	request.open('GET','http://king.com:8002/xxx')
	//(3) 发送HTTP请求（发送对象）
	request.send()
	//(4) 处理服务器返回的信息（监听对象，readyState 的变化）
	request.onreadystatechange = ()=>{
		if(request.readyState === 4){
			if(request.status >= 200 && request.status < 300){
				//把符合 JSON 语法的字符串
				let string = request.responseText
				//转换成 JS 对应的值
				let object = window.JSON.parse(string)
			}else if(request.status >= 400){
				console.log('请求失败')
			}
		}
	}
})

$.ajax({
        url: './xxx',
        type: 'post',
    }).then(
        () => {}, 
        () => {}
    ).then(
        ()=>{},
        ()=>{}
    )

$.ajax({
    url: 'http://king.com:8002/pay',
    dataType: 'jsonp',
    success: function (response){
        if(response === 'heihei'){
            amount.innerText = amount.innerText - 1
        }
    }
});

var http = require('http')
var fs = require('fs')
var url = require('url')
var port = process.argv[2]

if(!port){
  console.log('请指定端口号好不啦？\nnode server.js 8888 这样不会吗？')
  process.exit(1)
}

var server = http.createServer(function(request, response){
  var parsedUrl = url.parse(request.url, true)
  var pathWithQuery = request.url
  var queryString = ''
  if(pathWithQuery.indexOf('?') >= 0){ queryString = pathWithQuery.substring(pathWithQuery.indexOf('?')) }
  var path = parsedUrl.pathname
  var query = parsedUrl.query
  var method = request.method

  /******** 从这里开始看，上面不要看 ************/

  console.log('含查询字符串的路径\n' + pathWithQuery)

  if(path === '/'){
    var string = fs.readFileSync('./index.html','utf8')
    var amount = fs.readFileSync('./db','utf8')
    string = string.replace('&&&amount&&&',amount)
    response.setHeader('Content-Type','text/html; charset=utf-8')
    response.write(string)
    response.end()
  }else if(path === '/style.css'){
    var string = fs.readFileSync('./style.css','utf8')
    response.setHeader('Content-Type','text/css; charset=utf-8')
    response.write(string)
    response.end()
  }else if(path === '/main.js'){
    var string = fs.readFileSync('./main.js','utf8')
    response.setHeader('Content-Type','application/javascript;')
    response.write(string)
    response.end()
  }else if(path === '/pay'){
    var amount = fs.readFileSync('./db','utf8')
    var newAmount = amount - 1
    fs.writeFileSync('./db',newAmount)
    response.setHeader('Content-Type','application/javascript;')
    response.statusCode = 200
    response.write(`
      ${query.callback}.call(undefined,'heihei')
    `)
    response.end()
  }else{
    response.statusCode = 404
    response.setHeader('Content-Type', 'text/html;charset=utf-8')
    response.write('找不到对应的路径，你需要自行修改 index.js')
    response.end()
  }

  /******** 代码结束，下面不要看 ************/
})

server.listen(port)
console.log('监听 ' + port + ' 成功\n请用在空中转体720度然后用电饭煲打开 http://localhost:' + port)

${query.callback}.call(undefined,'heihei')

onclick = fn()   //fn 类型为字符串

X.onclick = fn    //fn 类型为函数对象

// 先打印1，再打印2
xx.addEventListener('click',function(){
    console.log(1)
})
xx.addEventListener('click',function(){
    console.log(2)
})
// 1
// 2

// 只打印2，后面`onclick`的把前面的覆盖了
xx.onclick = function(){
    console.log(1)
}
xx.onclick = function(){
    console.log(2)
}
// 2

// 点击 里
外.addEventListener('click',function() {
  console.log("外")
})
中.addEventListener('click',function() {
  console.log("中")
})
里.addEventListener('click',function() {
  console.log("里")
})
// 里
// 中
// 外

// 点击 里 
外.addEventListener('click',function() {
  console.log("外")
},true)
中.addEventListener('click',function() {
  console.log("中")
},true)
里.addEventListener('click',function() {
  console.log("里")
},true)
// 外
// 中
// 里

btn.addEventListener('click', function () {
    console.log('点击btn')
    popover.style.display = 'block'
})
wrapper.addEventListener('click', function (e) {
    console.log('点击wrapper')
    e.stopPropagation() // 阻止外部传播进来，所以在 document 被点击的时候，wrapper 里面不受影响
})
document.addEventListener('click', function () { 
    console.log('点击document')
    popover.style.display = 'none'
})

//方法一 stopPropagation
// 点击 btn，先后打印 '点击btn' '点击wrapper'，同时 popover 也会出现，
// 这时候就开始监听一次 document 的点击事件，点击别处，popover 会隐藏。
{
    $(btn).on('click',function () {
        console.log('点击btn')
        $(popover).show()
        $(document).one('click',function () { //只执行一次
            console.log('点击document')
            $(popover).hide()
        })
    })
    $(wrapper).on('click',function (e) {
        console.log('点击wrapper')
        e.stopPropagation()
    })
}
    
// 方法二 用 setTimeout，就不需要 stopPropagation 了；
// 点击 btn，打印 '点击btn'，同时 popover 也会出现，
// 这时候就开始监听一次 document 的点击事件，点击别处，popover 会隐藏。
{
    $(btn).on('click',function () {
        console.log('点击btn')
        $(popover).show()
        setTimeout(function() {
            $(document).one('click',function () { 
                console.log('点击document')
                $(popover).hide()
            })  
        },0)
    })
}

window.jQuery = function(nodeOrSelector){ //先用一个函数将以下内容包裹，防止污染
	let nodes = {} //声明一个数组
	if(typeof nodeOrSelector === 'string'){ //如果 nodeOrSelector 是一个 `string`
		let temp = document.querySelectorAll(nodeOrSelector) //伪数组
		for(var i=0;i<temp.length;i++){ //遍历这个伪数组
			nodes[i] = temp[i]
		}
		nodes.length = temp.length //使得该伪数组按顺序排序
	}else if(nodeOrSelector instanceof Node){ //如果 nodeOrSelector 是一个 `Node`
		nodes = {0:nodeOrSelector,length:1} //我们要让该 Node 和上面的格式保持一致
	}
//实现添加 class
	nodes.addClass = function(classes){
		classes.forEach((value) => {
			for(var i=0;i<nodes.length;i++){
				nodes[i].classList.add(value)
			}
		})
	}
//设置 或者 获取text 内容
	nodes.text = function(text){
		if(text === undefined){ //如果 text 没有给参数，那就直接输出 text 原有的值
			var texts = []
			for(var i=0;i<nodes.length;i++){
				texts.push(nodes[i].textContent)
			}
			return texts
		}else{
			for(var i=0;i<nodes.length;i++){
				nodes[i].textContent = text //否则就输出给的值
			}
		}
	}
	return nodes
}

var node3 = jQuery('ul > li') //获取li
node3.addClass(['blue']) //给 li 添加 class->blue
node3.text() //输出li的text

var btn = document.getElementById('btn')
	btn.onclick = function(){
		setTimeout("alert('3 seconds!')",3000)
	}

var a = 1
var b = a
b = 2
请问 a 显示是几？

var a = {name: 'a'}
var b = a
b = {name: 'b'}
请问现在 a.name 是多少？

var a = {name: 'a'}
var b = a
b.name = 'b'
请问现在 a.name 是多少？

var a = {name: 'a'}
var b = a
b = null
请问现在 a 是什么？

var a = 1
var b = a
b = 2 //这个时候改变 b
//a 完全不受 b 的影响
//那么我们就说这是一个深复制

var a = {name: 'frank'}
var b = a
b.name = 'b'
a.name === 'b' // true

var a = {name: 'frank'}
var b = deepClone(a) // deepClone 还不知道怎么实现
b.name = 'b'
a.name === 'a' // true