git es6
目录
一、Git简介
Git 是一个开源的分布式版本控制系统，用于敏捷高效地处理任何或小或大的项目。
Git 是 Linus Torvalds 为了帮助管理 Linux 内核开发而开发的一个开放源码的版本控制软件。
Git 与常用的版本控制工具 CVS, Subversion 等不同，它采用了分布式版本库的方式，不必服务器端软件支持。
二、使用gitee管理git仓库
官网地址
新建仓库
生成ssh key
ssh-keygen -t ed25519 -C "1183391880@qq.com"或者：
ssh-keygen -t rsa -C "1183391880@qq.com" 
配置ssh公钥
确保启用 SSH 代理：
$ eval "$(ssh-agent -s)"为 SSH key 启用 SSH 代理：
$ ssh-add ~/.ssh/id_rsa
安装git
安装小乌龟
忽略提交.gitignore
在使用Git的过程中，我们喜欢有的文件比如日志，临时文件，编译的中间文件等不要提交到代码仓库，这时就要设置相应的忽略规则，来忽略这些文件的提交。
/mtk 过滤整个文件夹
*.zip 过滤所有.zip文件
参考链接：https://www.jianshu.com/p/74bd0ceb6182
git配置用户名和邮箱
全局配置用户名：
git config --global user.name "xutongbao"全局配置邮箱：
git config --global user.email "1183391880@qq.com"ssh配置失败的同学，可以用https协议下载代码，而且也可以配置免密！
用git时，每次都需要输入密码会比较麻烦。
可以进行设置，这样在输入过一次密码之后，以后就不需要每次都输入密码了。
打开终端输入 ：
touch ~/.git-credentials再输入：
git config --global credential.helper store克隆代码
git clone git@github.com:baweireact/m-app-test.git添加要上传的文件：
git add README.md提交到本地：
git commit -m "first commit"提交到远程：
git push origin master
git add readme.txt
git add readme.txt ant.txt
git add *.html
git add all
git add .
git add *
git log
git statusgit add . 会把本地所有untrack的文件都加入暂存区，并且会根据.gitignore做过滤，但是git add * 会忽略.gitignore把任何文件都加入
使用 git add 命令将想要快照的内容写入缓存区， 而执行 git commit 将缓存区内容添加到本地仓库中。
参考链接
git使用简易指南：
https://www.bootcss.com/p/git-guide/
设置ssh key出问题的可以参考下面的链接：
https://blog.csdn.net/felicity294250051/article/details/53606158
https://blog.csdn.net/goawaycow1/article/details/78069487
三、ES6
ES6简介
ECMAScript 和 JavaScript 的关系
ECMAScript 和 JavaScript 的关系是，前者是后者的规格，后者是前者的一种实现。
S6与ECMAScript2015的关系
ES6 的第一个版本，就这样在 2015 年 6 月发布了，正式名称就是《ECMAScript 2015 标准》（简称 ES2015）
Let&const命令
在循环中给按钮绑定事件：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<button>按钮1</button>
<button>按钮2</button>
<button>按钮3</button>
<script>
var buttons = document.getElementsByTagName('button')
console.log(buttons)
for (var i = 0; i < buttons.length; i++) {
buttons[i].onclick = function () {
console.log(i)
}
}
</script>
</body>
</html>
点击任意一个按钮均输出3
使用let代替var
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<button>按钮1</button>
<button>按钮2</button>
<button>按钮3</button>
<script>
var buttons = document.getElementsByTagName('button')
console.log(buttons)
for (let i = 0; i < buttons.length; i++) {
buttons[i].onclick = function () {
console.log(i)
}
}
</script>
</body>
</html>
点击按钮依次输出 0 1 2
ES6 新增了let命令，用来声明变量。它的用法类似于var，但是所声明的变量，只在let命令所在的代码块内有效。
在使用let声明变量之前不能使用变量，及时使用typeof检查变量的类型也不行
console.log(typeof title)
let title = '你好'
console.log(title)
//使用const定义的简单类型的数据不可以修改
const title = '你好'
//title = '1' //报错
//使用const定义的引用类型的数据可以修改属性
const user = {
name: 'xu',
}
user.name = 'tongbao'
console.log(user)数组和对象的解构赋值
const user = {
name: 'xu',
age: 33,
}
const { name, age, sex = 'male' } = user
console.log(name, age, sex)
let arr = ['apple', 'egg']
const [apple, egg] = arr
console.log(apple, egg)模板字符串
const name = 'xu'
const title = `姓名： ${name}`
console.log(title)字符串includes方法
const name = 'xu'
const title = `姓名： ${name}`
console.log(title)
let isIncludes = title.includes('xu')
console.log(isIncludes)数组
数组拼接
let a = [1, 2, 3]
let b = [4, 5]
let c = [...a, ...b]
console.log(c)查找下标
let arr = [1, 2, 3]
const resultIndex = arr.findIndex(item => item === 2)
console.log(resultIndex) //1查找值
let arr = [1, 2, 3]
const result = arr.find(item => item === 2)
console.log(result) //2过滤
let arr = [1, 2, 3]
const result = arr.filter(item => item !== 2)
console.log(result) //[1, 3]包含
let arr = [1, 2, 3]
const result = arr.includes(2)
console.log(result) //true排序
let arr = [1, 2, 3]
arr.sort((a, b) => b - a)
console.log(arr) //[3, 2, 1]判断是否是数组
let arr = [1, 2, 3]
console.log(Array.isArray(arr)) //truemap
let arr = [1, 2, 3]
let newArr = arr.map(item => item * 2)
console.log(newArr) //[2, 4, 6]forEach
let arr = [1, 2, 3]
let newArr = []
arr.forEach((item) => {
newArr.push(item * 2)
})
console.log(newArr) //[2, 4, 6]对象的扩展
属性的简介标识法
let name = 'xu'
let user = {
name,
}
console.log(user) //{name: 'xu'}属性名表达式
let field = 'title'
let user = {
[field]: 'xu',
}
console.log(user) //{title: 'xu'}Object.is()
const result = Object.is(25, 25)
console.log(result) // true参考链接：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object/is
Object.assign()
let user = {
name: 'xu',
}
let info = {
age: 33,
}
Object.assign(user, info)
console.log(user) //{name: 'xu', age: 33}
console.log(info) //{age: 33}
const result = { ...user, ...info }
console.log(result) //{name: 'xu', age: 33}函数的扩展
函数参数的默认值
function getId(id = '1') {
return id
}
let id = getId()
console.log(id) //1rest参数
function fun(...values) {
console.log(values) //[1, 2, 3]
}
fun(1, 2, 3)箭头函数及普通函数的区别
箭头函数都是匿名函数
箭头函数不能用于构造函数，不能使用new
在普通函数中，this总是指向调用它的对象，如果用作构造函数，this指向创建的对象实例。
也可以说箭头函数本身没有this，但是它在声明时可以捕获其所在上下文的this供自己使用。
Symbol
作为属性名的Symbol
let title = Symbol('title')
let title2 = Symbol('title')
let user ={
[title]: '徐',
[title2]: 'xu'
}
console.log(title, title2) //Symbol(title)
console.log(user) //{Symbol(title): '徐'}消除魔术字符串
const shapeType = {
triangle: Symbol()
};
function getArea(shape, options) {
let area = 0;
switch (shape) {
case shapeType.triangle:
area = .5 * options.width * options.height;
break;
}
return area;
}
getArea(shapeType.triangle, { width: 100, height: 100 });
set数据结构
基本用法
ES6 提供了新的数据结构 Set。它类似于数组，但是成员的值都是唯一的，没有重复的值
实例属性方法属性
- size
- add、delete、has、clear
数组去重
let arr = [1, 1, 2]
console.log([...new Set(arr)]) //[1, 2]map数据结构
含义和基本用法
Object 结构提供了“字符串—值”的对应，Map 结构提供了“值—值”的对应
实例属性方法属性
- size
- set、get、has、delete、clear
for of 遍历
let obj = {}
const map = new Map([
['name', '张三'],
['title', 'Author'],
[obj, '1'],
])
for (let item of map) {
console.log(item[0], item[1])
}
proxy与Reflect
概述
Proxy 用于修改某些操作的默认行为
Reflect用于获取某些操作的默认行为
get
let obj = new Proxy({}, {
get: function(target, propKey, receiver) {
console.log(target, propKey, receiver)
return Reflect.get(target, propKey, receiver)
}
})
obj.title = 'xu'
console.log(obj.title) //xuset
let obj = new Proxy(
{},
{
get: function (target, propKey, receiver) {
console.log(target, propKey, receiver)
return Reflect.get(target, propKey, receiver)
},
set: function (target, propKey, value, receiver) {
console.log(target, propKey, value, receiver)
return Reflect.set(target, propKey, value, receiver)
},
}
)
obj.title = 'xu'
console.log(obj.title) //xuhas
let obj = new Proxy(
{},
{
get: function (target, propKey, receiver) {
console.log('get', target, propKey, receiver)
return Reflect.get(target, propKey, receiver)
},
set: function (target, propKey, value, receiver) {
console.log('set', target, propKey, value, receiver)
return Reflect.set(target, propKey, value, receiver)
},
has: function (target, propKey) {
console.log('has', target, propKey)
return Reflect.has(target, propKey)
},
}
)
obj.title = 'xu'
console.log(obj.title) //xu
console.log('title' in obj) //truedeleteProperty
let obj = new Proxy(
{},
{
get: function (target, propKey, receiver) {
console.log('get', target, propKey, receiver)
return Reflect.get(target, propKey, receiver)
},
set: function (target, propKey, value, receiver) {
console.log('set', target, propKey, value, receiver)
return Reflect.set(target, propKey, value, receiver)
},
has: function (target, propKey) {
console.log('has', target, propKey)
return Reflect.has(target, propKey)
},
deleteProperty(target, propKey) {
console.log('deleteProperty', target, propKey)
return Reflect.deleteProperty(target, propKey)
},
}
)
obj.title = 'xu'
console.log(obj.title) //xu
console.log('title' in obj) //true
delete obj.title
console.log('title' in obj) //falseownKeys
let obj = new Proxy(
{},
{
ownKeys: function (target) {
console.log('ownKeys', target)
return Reflect.ownKeys(target)
},
}
)
obj.title = 'xu'
console.log(Object.getOwnPropertyNames(obj)) //['title']defineProperty
let obj = new Proxy(
{},
{
defineProperty: function (target, property, descriptor) {
descriptor.writable = false
console.log('defineProperty', target, property, descriptor)
return Reflect.defineProperty(target, property, descriptor)
},
}
)
obj.title = 'xu'
obj.title = '徐' //赋值不生效
console.log(obj.title) //xu