js常用语法系列教程如下

这部分教程我们主要讲解以下几个常用语法

  • 如何创建对象,如何给对象添加属性和方法
  • var 与 let 申明变量时的异同点
  • 解构对象
  • 解构数组
  • 解构函数参数

如何创建对象,如何给对象添加属性和方法

 1 componentDidMount() {
 2
 3     // 创建一个小明对象
 4     let xiaoming = {}
 5
 6     // 给小明这个对象添加属于他的属性
 7     xiaoming.name = 'XiaoMing'
 8     xiaoming.age = 20
 9     xiaoming.height = 180
10
11     // 给小明这个对象添加属于他的方法
12     xiaoming.eat = () => {console.log('eat')}
13     xiaoming.learn = () => {console.log('learn RN')}
14
15     // 获取小明的名字
16     console.log(xiaoming.name)
17
18     // 调用小明自己的方法
19     xiaoming.eat()
20     xiaoming.learn()
21
22     // 打印小明对象看看效果吧
23     console.log(xiaoming)
24   }

日志

 
obj

var 与 let 申明变量时的区别

  • 只申明变量不赋值,表现相同
1 (function() {
2   var varVariable
3   let letVariable
4   console.log(varVariable) // 输出 undefined
5   console.log(letVariable) // 输出 undefined
6 }())
  • 使用未声明的变量时,表现相同
1 (function() {
2   console.log(varTest) // 输出 undefined
3   console.log(letTest) // 输出 undefined
4
5   var varTest = 'varTest'
6   let letTest = 'varTest'
7 }())
  • 重复声明同一个变量时,表现不同
 1 (function() {
 2
 3   var varTest = 'test var OK.'
 4   let letTest = 'test let OK.'
 5
 6   var varTest = 'varTest changed.'
 7   let letTest = 'letTest changed.' // 直接报错:SyntaxError:Identifier 'letTest' has already been declared
 8
 9   console.log(varTest) // 输出 varTest changed,覆盖掉了之前的值:test
10   // var OK.
11   console.log(letTest)
12 }())
  • 变量作用域,表现不同
 1 var xx
 2
 3 const test = () => {
 4   var aa // 声明一
 5   let bb //声明二
 6   this.cc //声明三
 7
 8   // 声明一局部代码块
 9   {
10     let dd //声明四
11   }
12 }

区别

那么,用this声明的变量呢?

var 与 let 总结

  • 使用 var 申明的变量,可以重复申明,只是后申明的会覆盖前面申明的
  • 使用 let 申明的变量,不能够重复申明,重复申明直接报错
  • 使用 let 声明变量,该变量的作用范围限于声明它的代码块中
  • 如果未在 var \ let 语句中初始化变量,则将自动为其分配 JavaScript 值 undefined

解构对象

1 const breakfast = () => {2   return {dessert: '
02-11 12:35