js 变量作用域

2017-06-05 11:44:51 180 阅读 AI 写同款 · GEO 优化AI 选题数据监测一键分发 ›

封装了一个函数，希望其内部变量提取到外部来该如何处理

var picTouse = function(){

    

    function gray() {

        console.log(picTouse.id);

        $(".model").css("display", "flex");

        var id = $(".active")[0].id,

            canvas = $("#canvas"+id)[0],

            ctx = canvas.getContext('2d'),

            width = canvas.width,

            height = canvas.height,

            src = canvas.toDataURL("image/png"),

            imgs,

            img = new Image();

        img.src = src;

        imgs = img;

        imgs.onload = function () {  //图片要等其加载完成之后才能成在canvas中使用

            ctx.drawImage(imgs, 0, 0,width,height);

            var pixels = ctx.getImageData(0,0,width,height);

            var pixeldata = pixels.data;

            for(var i=0,len = pixeldata.length ;i<len;i+=4){

                var gray =parseInt( pixels.data[i]*0.3 + pixels.data[i+1] *0.59 + pixels.data[i+2]*0.11);

                pixels.data[i] = gray;

                pixels.data[i+1] = gray;

                pixels.data[i+2] = gray;

            }

            grays++;

            ctx.putImageData(pixels, 0, 0);

            $(".model").css("display", "none");

        };

    }

    /*浮雕按钮*/

    function emboss() {

        $(".model").css("display", "flex");

        var id = $(".active")[0].id,

            canvas = $("#canvas"+id)[0],

            ctx = canvas.getContext('2d'),

            width = canvas.width,

            height = canvas.height,

            src = canvas.toDataURL("image/png"),

            imgs,

            img = new Image();

        img.src = src;

        imgs = img;

        imgs.onload = function () {  //图片要等其加载完成之后才能成在canvas中使用

            ctx.drawImage(imgs, 0, 0,width,height);

            var pixels = ctx.getImageData(0,0,width,height);

            var lastR= pixels.data[0],lastG= pixels.data[1],lastB= pixels.data[2];

            for (var i=1;i<canvas.width-1;i++){

                for (var j=1;j<canvas.height-1;j++){

                    var currentPixel = 4*canvas.width*j + 4* i;

                    var r = pixels.data[currentPixel],

                        g = pixels.data[currentPixel+1],

                        b = pixels.data[currentPixel+2];

                    pixels.data[currentPixel] +=(128-lastR);

                    pixels.data[currentPixel+1] +=(128-lastG);

                    pixels.data[currentPixel+2] +=(128-lastB);

                    lastR = r;

                    lastG = g;

                    lastB = b;

                }

            }

            embosss++;

            ctx.putImageData(pixels, 0, 0);

            $(".model").css("display", "none");

        };

    }

    return{

      

        gray:gray,

        emboss:emboss,

       

    }





}()

希望把 var id = $(".active")[0].id,
canvas = $("#canvas"+id)[0],
ctx = canvas.getContext('2d'),
width = canvas.width,
height = canvas.height,
src = canvas.toDataURL("image/png"),
imgs,
img = new Image();
img.src = src;
imgs = img; 这一部分提取出来变成共有的该如何提取

...全文