JS作用域及对象的基本使用

一、作用域

1、作用域定义

变量在不同的范围内取不同的值。

2、分类

全局作用域：

在整个script标签的范围内都起作用。

注：同一个页面中若存放两个script标签，上一个Script标签中的全局变量 会影响下面script标签中的相同变量。（不建议一个页面设置两个script标签）

局部作用域：

主要是函数作用域，函数中的形参默认是局部作用域。在函数内定义的数据，其作用域是函数内的大括号部分。

若函数作用域内没有定义变量却使用了变量，那么会往全局作用域寻找声明的变量，若也没有则报错。（就近原则）

二、匿名函数

使用方式：

没有名字 无法使用的函数。如下：

<script>
    //fn() 报错  fn未声明
  let fn = function (x = 0, y = 0) {
    console.log(x + y);

  }
  console.log("~  fn", fn())
</script>

匿名函数相当于讲一个没有名字的函数赋值给变量，此时，必须先声明变量 再调用。具名函数在任何位置都可以调用（js预解析）

立即执行函数：

避免全局变量之间的污染

使用方法如下：

 let num = 10;
  // 立即执行前的代码后必须加;
  (function () {
    console.log(111);
  })();
  (function () {
    console.log(111);
  }());

注：立即执行函数前的代码后必须加；

三、对象

定义：

对象简单来说就是一组无序的键值对的集合

使用方式：对象中存放的数据以键值对的形式存放，

let 对象名字 = { //1.用花括号表示对象
    属性名:属性值，//2.属性名和属性值之间用:隔开（英文分号）
    方法名:函数//3.如果下面还有属性，上面需要用逗号隔开（英文逗号）
}

  let goods = {
    name: '小米10青春版',
    num: 100012816024,
    weight: '0.55kg',
    address: '中国大陆',
    sing: function () {
      console.log('我会唱歌');
    }
  }

使用方式：

增删改查：

// 1.申明
let obj = {
    'goods': '小米10青春版', //属性名加不加引号都可以，加的话都加，不加的话就都不加
    num: '100012816024',
    weight: '0.55kg',
    address: '中国大陆'
}
// 2.查询对象的某个属性 语法：对象.属性
console.log(obj.address);//查询obj对象的address属性

// 3.修改对象的某个属性 语法：对象.属性 =  值
obj.address = '中国合肥闽商国贸'//修改obj对象的address属性 就是赋值
console.log(obj.address);

// 4.添加对象的某个属性 语法：对象.属性 =  值(和修改一样的语法，有就是改，没有就是新增)
obj.price = '1999'//新增obj对象的price属性
console.log(obj.price);


// 5.删除对象的某个属性 语法：delete 对象.属性(delete 需要空格一下)用的较少
obj.gender = '男'//新增obj对象的gender属性
console.log(obj.gender); //先演示下在控制台删除
// delete obj.gender
// console.log(obj.gender);

对象中的查询另一种方式：

let jsonObj = {
    'user-name':'jsonWang'
}
console.log(jsonObj.user-name); //这个会报错，因为把-当成了减号？
// 解决方法  查询的另一种语法  
//对象[属性]    对象.属性 都要掌握
console.log(jsonObj['user-name']);//用中括号括起来是一组，里面用''告诉js这个是字符串

总结：

• 对象是什么？特点？

  • 对象是一种数据类型

  • 无序的数据的集合，描述某个事物

• 对象的基本使用

  • 查语法:

    • 对象名.属性
    • 对象名[‘属性’]

  • 改语法: 对象名.属性 = 新值

  • 增语法: 对象名.新属性名 = 新值

  • 删语法（一嘴带过）delete 对象名.属性名

遍历对象：

for in方法用于遍历对象（无固定长度），for方法用于遍历数组（有固定长度）

for (let 属性名 in 对象名) {}

使用：

// for in 我们不推荐遍历数组
   let arr = ['三国演义','西游记','红楼梦','水浒传']
    for (let k in arr) {
      console.log(k)  // 数组的下标 索引号  但是是字符串 '0'
      console.log(arr[k])  // arr[k]
    }
// 1. 遍历对象 for in(为什么不用for遍历对象，无需没有索引)
let obj = {
    uname: 'jsonWang',
    age: 18,
    gender: '男'
}
// 2. 遍历对象
for (let k in obj) {
    console.log(k) // 属性名  'uname'   'age'
    // console.log(obj.uname)
    // console.log(obj.k)
    // console.log(obj.'uname')
    // console.log(obj['uname'])   'uname'  === k
    console.log(obj[k])  // 输出属性值  obj[k]
}

遍历数组对象：

let students = [
    { name: '小明', age: 18, gender: '男', hometown: '河北省' },
    { name: '小红', age: 19, gender: '女', hometown: '河南省' },
    { name: '小刚', age: 17, gender: '男', hometown: '山西省' },
    { name: '小丽', age: 18, gender: '女', hometown: '山东省' }
]
for (let i = 0; i < students.length; i++) {
    // console.log(i)  // 下标索引号
    // console.log(students[i]) // 每个对象
    console.log(students[i].name)
    console.log(students[i].hometown)
}