学习记录1.13

闭包：

可以访问外部函数的变量，在内层函数中访问到外层函数的作用域. 她可以创建私有变量，延长变量的生命周期。

function father()

{

Var name = “baiyun”;

function son()

{

Console.log(name,”name”);

}

son()

}

father();

柯里化函数的应用：目的在于避免频繁调用具有相同参数函数的同时，又能够轻松的重用

// 假设我们有一个求长方形面积的函数

function getArea(width, height) {

return width * height

}

// 如果我们碰到的长方形的宽老是10

const area1 = getArea(10, 20)

const area2 = getArea(10, 30)

const area3 = getArea(10, 40)

// 我们可以使用闭包柯里化这个计算面积的函数

function getArea(width) {

return height => {

return width * height

}

const getTenWidthArea = getArea(10)

// 之后碰到宽度为10的长方形就可以这样计算面积

const area1 = getTenWidthArea(20)

// 而且如果遇到宽度偶尔变化也可以轻松复用

const getTwentyWidthArea = getArea(20)

应用：

数据封装： 闭包允许创建私有变量，通过函数的返回值暴露有限的访问方式，实现数据封装。
模块化开发： 闭包可以用于实现模块化的代码结构，将一些功能封装在闭包中，只暴露必要的接口。
回调函数： 闭包常常用于实现回调函数，尤其是在异步编程中，通过闭包可以保持对外部作用域的引用。
定时器和事件处理： 在定时器和事件处理中，闭包可以用于保存状态信息，以便在定时器或事件触发时使用。

优点：

数据封装： 闭包允许将数据封装在函数内，避免全局变量的污染，提高代码的可维护性。
保持状态： 闭包可以捕获外部函数的状态，使得函数在后续调用中能够记住之前的状态，有助于实现某些功能。
模块化： 闭包支持模块化开发，可以将功能划分为更小的单元，提高代码的复用性和可读性。

缺点：

内存消耗： 闭包中保留了外部作用域的引用，可能导致内存消耗较大，特别是在闭包函数体内包含大量变量或对象时。

nexttick：

因为vue更新dom是异步执行的。当修改数据的时候 vue会开启一个异步队列视图不会第一时间就进行更新而是等所有异步队列数据都变化完毕才会进行统一更新

如果想要在修改数据后立刻得到更新后的DOM结构，可以使用Vue.nextTick()

更改数据后当你想立即使用js操作新的视图的时候需要使用它。比如说数据改变后重新获取焦点

现在有一个场景就是有一个div 使用v-if来判断它是否出现点击一个按钮 v-if的值会改变变成true的时候 div出现并获取input框中的值，如果v-if的值是 false，直接去获取div内容是获取不到的，因为此时div还没有被创建出来，那么应该在点击按钮后，改变v-if的值为 true，div才会被创建，此时再去获取，

可以使用这个函数

因为获取值的时候想要实现的效果就是输入框一出现就自动获取焦点并拿到里面的值。this.$refs.inputTitle.focus()不在外面嵌套$nextTick，就会出错，因为vue是在执行完函数时候判断数据是否改变在进行重新获取焦点也就是说函数执行完之后input框才可见然后获取焦点是在函数内执行的。

所以就要使用nexttick函数。因为nexttick方法是在渲染完页面之后这才执行的就可以正常获取焦点了

————————

应用的场景是：

在created生命周期钩子里，因为这个时候未挂载DOM，若在此阶段进行DOM操作一定要放在Vue.nextTick()的回调函数中。

nextTick方法主要是使用了宏任务和微任务，定义一个异步方法，多次调用nextTick会将方法存在队列中，通过这个异步方法清空当前队列。所以这个nextTick方法就是异步方法

其实用方法一般为 this.$nextTick( ()=>{} ), 为了不影响this指向，一般为箭头函数。

methods: {

getedit(){

this.isDisabled = false

this.$nextTick(function(){

this.$refs.inputTitle.focus() //获取焦点

})