• 让你的javascript函数拥有记忆功能,降低全局变量的使用


    考虑例如以下场景:假如我们须要在界面上画一个圆,初始的时候界面是空白的。当鼠标移动的时候,圆须要尾随鼠标移动。鼠标的当前位置就是圆心。我们的实现方案是:假设界面上还没有画圆,那么就新创建一个;假设已经存在,就直接更新其位置。这样可以避免先销毁。后创建的开销。

    var circle = null;
    
    function drawCircle(position)
    {
    	if(circle == null)
    	{
    		circle = GUI.Create(position);//创建1个圆
    	}
    	else
    	{
    		circle.updatePositon(position);//更新圆的位置
    	}
    }


    这段代码没有什么问题,除了引入了全局变量circle,而实际上circle仅仅会在drawCircle()函数中使用。也就说为了实现if-else的推断,我们不得不使用全局变量。

    有没有什么方式可以让函数拥有记忆功能,可以记住之前是否创建了圆。

    这种话,我们就不用使用全局变量了。

    var drawCircle = function(position)
    {
    	var circle = null;
    	
    	function innerFunc(position)
    	{
    		if(circle == null)
    		{
    			circle = GUI.Create(position);
    		}
    		else
    		{
    			circle.updatePositon(position);
    		}
    	}
    	
    	return innerFunc;
    }();


    这段代码可以正确的实现须要的功能,并且不会引入没有必要的全局变量。

    var drawCircle = function(position)
    {
    	
    }();

    这段代码会定义1个作用域。大括号内部定义的变量和函数,对于外部都是不可见的。并且大括号内部的代码会立马运行,代码 之前完之后将innerFunc赋值给drawCircle函数。这种话。就行缩小变量的作用域。 

     

     

  • 相关阅读:
    tableview加tap手势,cell点击无效了
    设置UISlider的ThumbImage,图片非常模糊, 使用代码生成图片就OK了
    思考阿里巴巴系的前端解决方案
    箭头函数和普通函数区别
    webpack
    this.$nextTick
    Node使用path和fs进行目录替换
    new操作符及原理
    javascript的设计模式发布订阅者模式
    vue2 和 vue3 对比
  • 原文地址:https://www.cnblogs.com/mengfanrong/p/5222609.html
Copyright © 2020-2023  润新知