vs code中文设置：
https://jingyan.baidu.com/article/7e44095377c9d12fc1e2ef5b.html
let和const
1.let定义变量,为了取代var
(1) 是否有变量提升 let没有变量提升，var有变量提升
(2) 是否有块级作用域 let块级作用域，var没有
出现ES6之前，作用域就有两种：全局作用域，局部作用域
(3) 是否重复定义 let不允许重复定义，var允许
2.const定义常量
特点：和let类似，也没有变量提升，也有块级作用域，不能重复定义，定义时必须赋值，但只能赋值一次
箭头函数
格式：
(参数1,参数2) => {
函数体
}
箭头函数与普通函数的区别：主要是this的指向问题，箭头函数本身没有this,它的this使用是父级函数的this,而普通函数有自己的this
箭头函数如果=>后面没有{},默认是带return
模板字符串
用反引号引起来的字符串： ` `
用${}来获取变量中的值
例如：var str=`你的姓名为${info.name},你的年龄是${info.age},你的籍贯是${info.address}`
解构赋值
注：主要对数组，对象进行解构
例如：
var info={
name:'关帅河北',
age:18,
address:'河北',
isMarry:'否'
}
var {name,age,address}=info
类(class)
ES5如何实现类：用函数模拟一个类，即构造函数
例如：
function Chinese() {
this.theme="黄色",
this.eyes="黑色"
}
公共方法：用prototype原型实现
Chinese.prototype.spring=function() {
console.log(`${this.name}过春节`);
}
如何实现类之间的继承：例如：chinese类如何继承Person类
原型链继承：Chinese.prototype=new Person()
缺点：不能传参，所以要引入类式继承 .call
通用作法即原型链继承和类式继承组合用
例如：
function Chinese(name) {
Person.call(this,name)
this.theme="黄色",
this.eyes="黑色"
}
Chinese.prototype=new Person()
Chinese.prototype.spring=function() {
console.log(this.name+"过春节");
}
ES6如何实现类:用class定义类
常用关键字：class,extends,super,constructor
定义一个类:
class 类名 {
}
例如：
class Person1 {
constructor(name='关帅') {
this.name=name
}
eat() {
console.log(this.name+"喜欢美食");
}
sleep() {
console.log(this.name+"喜欢欣赏枕头");
}
}
用extends实现继承
例如：
class Chinese1 extends Person1 {
constructor(name) {
super(name) // super就是要继承的父类
this.theme="黄色"
this.eyes="黑色"
}
spring() {
console.log(this.name+"过春节");
}
}
注意：只要加extends,supe是必加的
数组常用遍历方法
forEach 返回undefined
arr.forEach((item,index,arr)=>{
console.log(`第${index}的值为:`,item.name)
})
filter 返回新数组
var result=arr.filter((item,index,arr)=>{
return item.age>25
})
map 返回新数组
var result=arr.map((item,index,arr)=>{
return `姓名:${item.name},年龄:${item.age}`
})
React学习资料：
1.菜鸟教程：http://www.runoob.com/react/react-tutorial.html
2.react文档：
官方文档：https://reactjs.org/docs/hello-world.html
中文文档：http://react.html.cn/docs/getting-started.html
React初步
环境搭建：
1.用script引入方式
<script crossorigin src="https://unpkg.com/react@16/umd/react.development.js"></script>
<script crossorigin src="https://unpkg.com/react-dom@16/umd/react-dom.development.js"></script>
<script src="https://unpkg.com/@babel/standalone/babel.min.js"></script>
再script中写react代码
<script type="text/babel">
const element=<h1 className="box">我是标题1</h1>;
ReactDOM.render(element,document.getElementById('app'));
</script>
2.用react官方create-react-app脚手架来开发项目
作者：沉默成本
链接：https://www.jianshu.com/p/6aa27b424b7f
来源：简书
简书著作权归作者所有，任何形式的转载都请联系作者获得授权并注明出处。
网友评论