js闭包的学习

函数作为参数的使用

// 将函数作为参数进行传递
// function bar (aaa) {
//   aaa()
// }

// function foo(){
//   console.log('foo');
// }

// bar(foo)  // foo


// 案例
function calc(num1, num2, fn){
  console.log( fn(num1, num2) );
}

function add (a1, a2) {
  return a1 + a2
}

calc(15, 15, add)

函数作为返回值的使用

// js允许函数嵌套定义
// function one() {
//   function two() {
//     function there() {
//       console.log('Fhup');
//     }
//     return there
//   }
//   return two
// }

// const oneFn = one()
// const twoFn = oneFn()
// twoFn()  //Fhup

function makeAdder(count){
  function add(num){
    return num + count
  }
  return add
}

const add5 = makeAdder(5) 
console.log(add5(4));


// 高阶函数: 一个函数如果接受另外一个函数作为参数,或者该函数会返回另外一个函数作为返回值的函数, 那么这个函数就称之为是一个高阶函数

数组中的函数使用

var nums = [10, 5, 11, 100, 55]

// var newNums = []
// for (var i = 0; i < nums.length; i++) {
//   var num = nums[i]
//   if (num % 2 === 0) {
//     newNums.push(num)
//   }
// }
// console.log(newNums)

// 函数和方法的区别:
// 函数function: 独立的function, 称之为函数
function foo() {}
// 方法method: 当我们的一个函数属于某一个对象时, 我们称这个函数是这个对象的方法
var obj = {
  foo: function() {}
}
obj.foo() // obj的方法

// 1.filter: 过滤
// [10, 5, 11, 100, 55]
// 10 => false => 不会被放到newNums
// var newNums = nums.filter(function(item) {
//   return item % 2 === 0 // 偶数
// })
// console.log(newNums)

// 2.map: 映射
// [10, 5, 11, 100, 55]
// var newNums2 = nums.map(function(item) {
//   return item * 10
// })
// console.log(newNums2)

// 3.forEach: 迭代,无返回值.相当于for循环
// nums.forEach(function(item) {
//   console.log(item)
// })

// 4.find/findIndex, 找到对应的一个值或索引
// es6~12
// var item = nums.find(function(item) {
//   return item === 11
// })
// console.log(item)

// var friends = [
//   {name: "why", age: 18},
//   {name: "kobe", age: 40},
//   {name: "james", age: 35},
//   {name: "curry", age: 30},
// ]

// var findFriend = friends.find(function(item) {
//   return item.name === 'james'
// })
// console.log(findFriend)

var friendIndex = friends.findIndex(function(item) {
  return item.name === 'james'
})
// console.log(friendIndex)


// 5.reduce: 累加
// [10, 5, 11, 100, 55]
// var total = 0
// for (var i = 0; i < nums.length; i++) {
//   total += nums[i]
// }
// console.log(total)
// prevValue: 0, item: 10
// prevValue: 10, item: 5
// prevValue: 15, item: 11
var total = nums.reduce(function(prevValue, item) {
  return prevValue + item
}, 0) // 默认值为0
console.log(total)

高阶函数执行过程

function foo() {
  function bar() {
    console.log("bar")
  }

  return bar
}

var fn = foo()
fn()

闭包到底是什么

// 闭包: 二部分组成 函数+可以访问外层作用域的自由变量 (如:bar()访问name值)

function foo() {
  // foo的AO: 不会被销毁,因为GO的fn指向bar()的内存地址. 而bar()的scopechain的AO也指向foo()的AO对象
  var name = "foo"
  function bar() {
    console.log("bar", name)
  }
  return bar
}

var fn = foo() // foo()解析时拿到函数的内存地址(0xa00) 执行时将内存地址赋值给fn
fn()



// 这样就是一个闭包
var name = "Fhup"
function demo() {
  console.log(name)
}


// 可以访问age: test就是闭包
// 必须访问到age: test就是不是闭包
var age = 3
function test() {
}

// 狭义来说: 函数有访问到外层作用域的自由变量,就形成一个闭包

函数的执行过程的内存

function foo() {
  var name = "foo"
  var age = 18
}

function test() {
  console.log("test")
}

foo()
test()

函数的执行过程的内存(闭包)

function foo() {
  var name = "foo"
  var age = 18

  function bar() {
    console.log(name)
    console.log(age)
  }
  return bar
}

var fn = foo()
fn()

// 处理内存泄露
fn = null
foo = null

// 内存泄露问题看法: 
// 继续使用,不会造成泄露. 不使用,则发生泄露

// fn()
// fn()
// fn()