数组

• 什么是数组？
• 字面了解就是 数字的组合
• 其实不太精确，精确的来说数组是一个 数据的汇合

• 也就是咱们把一些数据放在一个盒子外面，依照程序排好

  [1, 2, 3, 'hello', true, false]

• 这个货色就是一个数组，存储着一些数据的汇合

数据类型分类

• number / string / boolean / undefined / null / object / function / array / …
• 数组也是数据类型中的一种
• 咱们简略的把所有数据类型分为两个大类 根本数据类型 和 简单数据类型
• 根本数据类型：number / string / boolean / undefined / null
• 简单数据类型：object / function / array / …

创立一个数组

• 数组就是一个 []
• 在 [] 外面存储着各种各样的数据，依照程序顺次排好

字面量创立一个数组

• 间接应用 [] 的形式创立一个数组

  // 创立一个空数组
  var arr1 = []
  
  // 创立一个有内容的数组
  var arr2 = [1, 2, 3]

内置构造函数创立数组

• 应用 js 的内置构造函数 Array 创立一个数组

  // 创立一个空数组
  var arr1 = new Array()
  
  // 创立一个长度为 10 的数组
  var arr2 = new Array(10)
  
  // 创立一个有内容的数组
  var arr3 = new Array(1, 2, 3)

数组的 length

• length: 长度的意思

• length 就是示意数组的长度，数组外面有多少个成员，length 就是多少

  // 创立一个数组
  var arr = [1, 2, 3]
  
  console.log(arr.length) // 3

数组的索引

• 索引，也叫做下标，是指一个数据在数组外面排在第几个的地位
• 留神：在所有的语言外面，索引都是从 0 开始的

• 在 js 外面也一样，数组的索引从 0 开始

  // 创立一个数组
  var arr = ['hello', 'world']

• 下面这个数组中，第 0 个 数据就是字符串 hello， 第 1 个 数据就是字符串 world

• 想获取数组中的第几个就应用 数组[索引] 来获取

  var arr = ['hello', 'world']
  
  console.log(arr[0]) // hello
  console.log(arr[1]) // world

数据类型之间存储的区别（重点）

• 既然咱们辨别了根本数据类型和简单数据类型
• 那么他们之间就肯定会存在一些区别
• 他们最大的区别就是在存储上的区别
• 咱们的存储空间分成两种 栈 和 堆
• 栈：次要存储根本数据类型的内容
• 堆：次要存储简单数据类型的内容

根本数据类型在内存中的存储状况

• var num = 100，在内存中的存储状况
• 间接在 栈空间 内有存储一个数据

简单数据类型在内存中的存储状况

• 上面这个 对象 的存储

  var obj = {
    name: 'Jack',
    age: 18,
    gender: '男'
  }

• 简单数据类型的存储

  1. 在堆外面开拓一个存储空间
  2. 把数据存储到存储空间内
  3. 把存储空间的地址赋值给栈外面的变量
• 这就是数据类型之间存储的区别

数据类型之间的比拟

• 根本数据类型是 值 之间的比拟

  var num = 1
  var str = '1'
  
  console.log(num == str) // true

• 简单数据类型是 地址 之间的比拟

  var obj = {name: 'Jack'}
  var obj2 = {name: 'Jack'}
  
  console.log(obj == obj2) // false

  • 因为咱们创立了两个对象，那么就会在 堆空间 外面开拓两个存储空间存储数据（两个地址）
  • 尽管存储的内容是一样的，那么也是两个存储空间，两个地址
  • 简单数据类型之间就是地址的比拟，所以 obj 和 obj2 两个变量的地址不一样
  • 所以咱们失去的就是 false

数组的罕用办法

• 数组是一个简单数据类型，咱们在操作它的时候就不能再想根本数据类型一样操作了

• 比方咱们想扭转一个数组

  // 创立一个数组
  var arr = [1, 2, 3]
  
  // 咱们想把数组变成只有 1 和 2
  arr = [1, 2]

  • 这样必定是不合理，因为这样不是在扭转之前的数组
  • 相当从新弄了一个数组给到 arr 这个变量了
  • 相当于把 arr 外面存储的地址给换了，也就是把存储空间换掉了，而不是在之前的空间外面批改
  • 所以咱们就须要借助一些办法，在不扭转存储空间的状况下，把存储空间外面的数据扭转了

数组罕用办法之 push

• push 是用来在数组的开端追加一个元素

  var arr = [1, 2, 3]
  
  // 应用 push 办法追加一个元素在开端
  arr.push(4)
  
  console.log(arr) // [1, 2, 3, 4]

数组罕用办法之 pop

• pop 是用来删除数组开端的一个元素

  var arr = [1, 2, 3]
  
  // 应用 pop 办法删除开端的一个元素
  arr.pop()
  
  console.log(arr) // [1, 2]

数组罕用办法之 unshift

• unshift 是在数组的最后面增加一个元素

  var arr = [1, 2, 3]
  
  // 应用 unshift 办法向数组的最后面增加一个元素
  arr.unshift(4)
  
  console.log(arr) // [4, 1, 2, 3]

数组罕用办法之 shift

• shift 是删除数组最后面的一个元素

  var arr = [1, 2, 3]
  
  // 应用 shift 办法删除数组最后面的一个元素
  arr.shift()
  
  console.log(arr) // [2, 3]

数组罕用办法之 splice

• splice 是截取数组中的某些内容，依照数组的索引来截取

• 语法：splice(从哪一个索引地位开始，截取多少个，替换的新元素)（第三个参数能够不写）

  var arr = [1, 2, 3, 4, 5]
  
  // 应用 splice 办法截取数组
  arr.splice(1, 2)
  
  console.log(arr) // [1, 4, 5]

  • arr.splice(1, 2) 示意从索引 1 开始截取 2 个内容
  • 第三个参数没有写，就是没有新内容替换掉截取地位

  var arr = [1, 2, 3, 4, 5]
  
  // 应用 splice 办法截取数组
  arr.splice(1, 2, '我是新内容')
  
  console.log(arr) // [1, '我是新内容', 4, 5]

  • arr.splice(1, 2, '我是新内容') 示意从索引 1 开始截取 2 个内容
  • 而后用第三个参数把截取完空进去的地位填充

数组罕用办法之 reverse

• reverse 是用来反转数组应用的

  var arr = [1, 2, 3]
  
  // 应用 reverse 办法来反转数组
  arr.reverse()
  
  console.log(arr) // [3, 2, 1]

数组罕用办法之 sort

• sort 是用来给数组排序的

  var arr = [2, 3, 1]
  
  // 应用 sort 办法给数组排序
  arr.sort()
  
  console.log(arr) // [1, 2, 3]

  • 这个只是一个根本的简略用法

数组罕用办法之 concat

• concat 是把多个数组进行拼接

• 和之前的办法有一些不一样的中央，就是 concat 不会扭转原始数组，而是返回一个新的数组

  var arr = [1, 2, 3]
  
  // 应用 concat 办法拼接数组
  var newArr = arr.concat([4, 5, 6])
  
  console.log(arr) // [1, 2, 3]
  console.log(newArr) // [1, 2, 3, 4, 5, 6]

  • 留神：concat 办法不会扭转原始数组

数组罕用办法之 join

• join 是把数组外面的每一项内容链接起来，变成一个字符串
• 能够本人定义每一项之间链接的内容 join(要以什么内容链接)

• 不会扭转原始数组，而是把链接好的字符串返回

  var arr = [1, 2, 3]
  
  // 应用 join 链接数组
  var str = arr.join('-')
  
  console.log(arr) // [1, 2, 3]
  console.log(str) // 1-2-3

  • 留神：join 办法不会扭转原始数组，而是返回链接好的字符串

for 和 for in 循环

• 因为数组的索引就能够获取数组中的内容
• 数组的索引又是依照 0 ～ n 顺序排列
• 咱们就能够应用 for 循环来循环数组，因为 for 循环咱们也能够设置成 0 ～ n 程序减少

• 咱们把这个行为叫做 遍历

  var arr = [1, 2, 3, 4, 5]
  
  // 应用 for 循环遍历数组
  for (var i = 0; i < arr.length; i++) {console.log(arr[i])
  }
  
  // 会在控制台顺次打印出 1，2，3，4，5

  • i < arr.length 因为 length 就是数组的长度，就是一个数字，所以咱们能够间接用它来决定循环次数
  • console.log(arr[i]) 因为随着循环，i 的值会从 0 开始顺次减少
  • 所以咱们实际上就相当于在打印 arr[0] / arr[1] / …

• 因为 对象 是没有索引的，所以咱们没有方法应用 for 循环来遍历
• 这里咱们应用 for in 循环来遍历对象

• 先来看一段代码

  var obj = {
    name: 'Jack',
    age: 18
  }
  
  for (var key in obj) {console.log(key)
  }
  
  // 会在控制台打印两次内容，别离是 name 和 age

  • for in 循环的遍历是依照对象中有多少成员来决定了
  • 有多少成员，就会执行多少次
  • key 是咱们本人定义的一个变量，就和 for 循环的时候咱们定义的 i 一个情理
  • 在每次循环的过程中，key 就代表着对象中某一个成员的 属性名

数组的排序

• 排序，就是把一个乱序的数组，通过咱们的解决，让他变成一个有序的数组
• 明天咱们解说两种形式来排序一个数组 冒泡排序 和 抉择排序

冒泡排序

• 先遍历数组，让挨着的两个进行比拟，如果前一个比后一个大，那么就把两个换个地位
• 数组遍历一遍当前，那么最初一个数字就是最大的那个了
• 而后进行第二遍的遍历，还是依照之前的规定，第二大的数字就会跑到倒数第二的地位

• 以此类推，最初就会依照程序把数组排好了

  1. 咱们先来筹备一个乱序的数组

     var arr = [3, 1, 5, 6, 4, 9, 7, 2, 8]

     • 接下来咱们就会用代码让数组排序

  2. 先不焦急循环，先来看数组外面内容换个地位

     // 假设我当初要让数组中的第 0 项和第 1 项换个地位
     // 须要借助第三个变量
     var tmp = arr[0]
     arr[0] = arr[1]
     arr[1] = tmp

  3. 第一次遍历数组，把最大的放到最初面去

     for (var i = 0; i < arr.length; i++) {
       // 判断，如果数组中的以后一个比后一个大，那么两个替换一下地位
       if (arr[i] > arr[i + 1]) {var tmp = arr[i]
         arr[i] = arr[i + 1]
         arr[i + 1] = tmp
       }
     }
     
     // 遍历结束当前，数组就会变成 [1, 3, 5, 4, 6, 7, 2, 8, 9]

     • 第一次完结当前，数组中的最初一个，就会是最大的那个数字
     • 而后咱们把下面的这段代码执行屡次。数组有多少项就执行多少次

  4. 依照数组的长度来遍历多少次

     for (var j = 0; j < arr.length; j++) {for (var i = 0; i < arr.length; i++) {
         // 判断，如果数组中的以后一个比后一个大，那么两个替换一下地位
         if (arr[i] > arr[i + 1]) {var tmp = arr[i]
           arr[i] = arr[i + 1]
           arr[i + 1] = tmp
         }
       }
     }
     
     // 完结当前，数组就排序好了

  5. 给一些优化

     • 设想一个问题，假如数组长度是 9，第八次排完当前
     • 前面八个数字曾经依照顺序排列好了，剩下的那个最小的肯定是在最后面
     • 那么第九次就曾经没有意义了，因为最小的曾经在最后面了，不会再有任何换地位呈现了

     • 那么咱们第九次遍历就不须要了，所以咱们能够缩小一次

       for (var j = 0; j < arr.length - 1; j++) {for (var i = 0; i < arr.length; i++) {
           // 判断，如果数组中的以后一个比后一个大，那么两个替换一下地位
           if (arr[i] > arr[i + 1]) {var tmp = arr[i]
             arr[i] = arr[i + 1]
             arr[i + 1] = tmp
           }
         }
       }

     • 第二个问题，第一次的时候，曾经把最大的数字放在最初面了
     • 那么第二次的时候，其实倒数第二个和最初一个就不必比了
     • 因为咱们就是要把倒数第二大的放在倒数第二的地位，即便比拟了，也不会换地位
     • 第三次就要倒数第三个数字就不必再和后两个比拟了

     • 以此类推，那么其实每次遍历的时候，就遍历以后次数 – 1 次

       for (var j = 0; j < arr.length - 1; j++) {for (var i = 0; i < arr.length - 1 - j; i++) {
           // 判断，如果数组中的以后一个比后一个大，那么两个替换一下地位
           if (arr[i] > arr[i + 1]) {var tmp = arr[i]
             arr[i] = arr[i + 1]
             arr[i + 1] = tmp
           }
         }
       }

  6. 至此，一个冒泡排序就实现了

抉择排序

• 先假设数组中的第 0 个就是最小的数字的索引
• 而后遍历数组，只有有一个数字比我小，那么就替换之前记录的索引
• 晓得数组遍历完结后，就能找到最小的那个索引，而后让最小的索引换到第 0 个的地位
• 再来第二趟遍历，假设第 1 个是最小的数字的索引
• 在遍历一次数组，找到比我小的那个数字的索引
• 遍历完结后换个地位

• 顺次类推，也能够把数组排序好

  1. 筹备一个数组

     var arr = [3, 1, 5, 6, 4, 9, 7, 2, 8]

  2. 假设数组中的第 0 个是最小数字的索引

     var minIndex = 0

  3. 遍历数组，判断，只有数字比我小，那么就替换掉原先记录的索引

     var minIndex = 0
     for (var i = 0; i < arr.length; i++) {if (arr[i] < arr[minIndex]) {minIndex = i}
     }
     
     // 遍历完结后找到最小的索引
     // 让第 minIndex 个和第 0 个替换
     var tmp = arr[minIndex]
     arr[minIndex] = arr[0]
     arr[0] = tmp

  4. 依照数组的长度反复执行下面的代码

     for (var j = 0; j < arr.length; j++) {
       // 因为第一遍的时候假设第 0 个，第二遍的时候假设第 1 个
       // 所以咱们要假设第 j 个就行
       var minIndex = j
       
       // 因为之前曾经把最小的放在最后面了，前面的循环就不须要判断后面的了
       // 间接从 j + 1 开始
       for (var i = j + 1; i < arr.length; i++) {if (arr[i] < arr[minIndex]) {minIndex = i}
       }
     
       // 遍历完结后找到最小的索引
       // 第一遍的时候是和第 0 个替换，第二遍的时候是和第 1 个替换
       // 咱们间接和第 j 个替换就行
       var tmp = arr[minIndex]
       arr[minIndex] = arr[j]
       arr[j] = tmp
     }

  5. 一些优化

     • 和之前一样，倒数第二次排序结束当前，就曾经排好了，最初一次没有必要了

       for (var j = 0; j < arr.length - 1; j++) {
         var minIndex = j
         
         for (var i = j + 1; i < arr.length; i++) {if (arr[i] < arr[minIndex]) {minIndex = i}
         }
       
         var tmp = arr[minIndex]
         arr[minIndex] = arr[j]
         arr[j] = tmp
       }

     • 在替换变量之前，能够判断一下，如果咱们遍历后失去的索引和以后的索引始终
     • 那么就证实以后这个就是目前最小的，那么就没有必要替换

     • 咱们只有判断，最小值的索引和以后索引不一样的时候，才替换

       for (var j = 0; j < arr.length - 1; j++) {
         var minIndex = j
         
         for (var i = j + 1; i < arr.length; i++) {if (arr[i] < arr[minIndex]) {minIndex = i}
         }
       
         if (minIndex !== j) {var tmp = arr[minIndex]
           arr[minIndex] = arr[j]
           arr[j] = tmp   
         }
       }

  6. 至此，抉择排序实现

函数参数传递根本数据类型和简单数据类型的区别

• 之前咱们晓得了，根本数据类型和简单数据类型在存储上是有区别的
• 那么他们在赋值之间也是有区别的

• 根本数据类型之间的赋值

  var num = 10
  var num2 = num
  
  num2 = 200
  
  console.log(num) // 100
  console.log(num2) // 200

  • 相当于是把 num 的值复制了一份一摸一样的给了 num2 变量
  • 赋值当前两个在没有关系

• 简单数据类型之间的赋值

  var obj = {name: 'Jack'}
  var obj2 = obj
  
  obj2.name = 'Rose'
  
  console.log(obj.name) // Rose
  console.log(obj2.name) // Rose

  • 因为简单数据类型，变量存储的是地址，实在内容在 堆空间 内存储
  • 所以赋值的时候相当于把 obj 存储的那个地址复制了一份给到了 obj2 变量
  • 当初 obj 和 obj2 两个变量存储的地址一样，指向一个内存空间
  • 所以应用 obj2 这个变量批改空间内的内容，obj 指向的空间也会跟着扭转了

函数的参数

• 函数的参数也是赋值的之中，在函数调用的时候，实参给行参赋值
• 和之前变量赋值的规定是一样的

• 函数传递根本数据类型

  function fn(n) {
    n = 200
    console.log(n) // 200
  }
  
  var num = 100
  fn(num)
  console.log(num) // 100

  • 和之前变量赋值的时候一样，在把 num 的值复制了一份一摸一样的给到了函数外部的行参 n
  • 两个之间在没有任何关系了

• 函数传递简单数据类型

  function fn(o) {
    o.name = 'Rose'
    console.log(o.name) // Rose
  }
  
  var obj = {name: 'Jack'}
  fn(obj)
  console.log(obj.name) // Rose

  • 和之前变量赋值的时候一样，把 obj 内存储的地址复制了一份一摸一样的给到函数外部的行参 o
  • 函数内部的 obj 和函数外部的行参 o，存储的是一个地址，指向的是一个存储空间
  • 所以两个变量操作的是一个存储空间
  • 在函数外部扭转了空间内的数据
  • obj 看到的也是扭转当前的内容