zoukankan      html  css  js  c++  java
  • [Javascript] Closure Cove, Common mistake

    They’ve got a problem with their existing code, which tries to use a closure. Check it out:

    function assignLaser( shark, sharkList ){
      var stationAssignment;
      for(var i = 0; i<sharkList.length; i++){
        if(shark == sharkList[i]){
          stationAssignment = function(){
            alert("Yo, " +
                  shark +
                  "!
    " +
                  "Visit underwater strapping station " +
                  i +
                  " for your sweet laser.
    " +
                  "'Bout to get real up in here."
                 );
          };
        }
      }
      return stationAssignment;
    }

    Solution ONE:

    Remove stationAssignment here, it will hold the i variable until the loop end, so return the fucntion immediatly when you find the value.

    function assignLaser( shark, sharkList ){
      for(var i = 0; i<sharkList.length; i++){
        if(shark == sharkList[i]){
          return function(){
            alert("Yo, " +
                  shark +
                  "!
    " +
                  "Visit underwater strapping station " +
                  i +
                  " for your sweet laser.
    " +
                  "'Bout to get real up in here."
                 );
          };
        }
      }
    }

    Solution TWO:

    var sharkList = ["yrr", "wff", "eff", "gee"];
    function makerLaserAssigner(sharkList){
        return function(shark){
            for(var i = 0; i<sharkList.length; i++){
                if(shark == sharkList[i]){
                    alert("Yo, " +
                          shark +
                          "!
    " +
                          "Visit underwater strapping station " +
                          i +
                          " for your sweet laser.
    " +
                          "'Bout to get real up in here."
                         );                
                }
            }
        };
    }
    var getSharkLaser = makerLaserAssigner(sharkList);
    getSharkLaser("eff");

    --------------------------------EX-----------------------

    The Dev Girls now need a target assignment for each shark. For your reference, the lists of sharks and targets is as follows:

    var listOfSharks = ["Sea Pain", "Great Wheezy",
                        "DJ Chewie", "Lil' Bitey",
                        "Finmaster Flex", "Swim Khalifa",
                        "Ice Teeth", "The Notorious J.A.W."];
    var listOfTargets = ["icicle bat", "snow yeti",
                         "killer penguin", "frost tiger",
                         "polar bear", "iceberg",
                         "blue witch", "wooly mammoth"];

    The Devs want to use the following function call whenever they need to find the right target for any shark:

    var getTargetFor = makeTargetAssigner(  listOfSharks,
                                            listOfTargets );
    getTargetFor("Ice Teeth");

    Here’s an example of the pop-up alert that the devs would like their call to getTargetFor to produce:

    What up, Ice Teeth!
    There've been blue witch sightings in our 'hood!
    Time for a swim-by lasering, homie!

    *Note: A shark’s list index matches the index of the target it is supposed to eliminate.

    YOUR goal is to build out the makeTargetAssigner function with a useful closure, so that it returns a function that can be used in the manner the devs are asking for. To help us check your work more efficiently, use shark as the parameter for a shark’s name in your closure function. You may want to use your own browser’s console to test a few inputs!

    Answer:

    function makeTargetAssigner( sharks, targets ){
      return function(shark){
            var s_i = sharks.indexOf(shark);
        var t_i = s_i;
        var target = targets[t_i];
        alert("What up,"+" "+
             shark+
             "!
    "+
             "There've been"+" "+
             target+
             " sightings in our 'hood!
    "+
             "Time for a swim-by lasering, homie!");
      };
    }
  • 相关阅读:
    mysql数据库全局只读和会话只读问题解析
    git仓库管理笔录
    使用 keytool 生成安卓应用程序签名
    html标签种类很多,为什么不都用div?
    css不受高度限制实现文本超出隐藏并以省略号结束
    进程、单线程、多线程
    CentOS7防火墙firewalld设置
    js 浏览器上调试方法多样
    javascript中call()、apply()、bind()的用法终于理解
    将图标LOGO之类的图形图像转换成字体调用方法大全
  • 原文地址:https://www.cnblogs.com/Answer1215/p/3890976.html
Copyright © 2011-2022 走看看