Freecodecamp: Basic Algorith Scripting: Seek and Destroy

Created on 18 May 2016  路  10Comments  路  Source: freeCodeCamp/freeCodeCamp

Seek and Destroy

https://www.freecodecamp.com/challenges/seek-and-destroy#?solution=%0Afunction%20destroyer(arr)%20%7B%0A%20%20%2F%2F%20Remove%20all%20the%20values%0A%20%20for%20(var%20i%20%3D%201%3B%20i%20%3C%3D%20arguments.length%3B%20i%2B%2B)%20%7B%0A%20%20%20%20%0A%20%20%20%20arr%20%3D%20arr.filter(function%20(value)%20%7B%0A%20%20%20%20%0A%20%20%20%20%20%20return%20value%20!%3D%3D%20this%3B%0A%20%20%20%20%7D%2C%20arguments%5Bi%5D)%3B%0A%20%20%7D%0A%20%20return%20arr%3B%0A%7D%0A%0Adestroyer(%5B3%2C%205%2C%201%2C%202%2C%202%5D%2C%202%2C%203%2C%205)%3B%0A

Issue Description

The code passes every test, but still, after hitting ctrl+enter nothing happens.

Browser Information

  • Browser Name, Version: Google Chrome, 50.0.2661.102 m
  • Operating System: Windows 10
  • Mobile, Desktop, or Tablet: Desktop

Your Code

function destroyer(arr) {
  // Remove all the values
  for (var i = 1; i <= arguments.length; i++) {

    arr = arr.filter(function (value) {

      return value !== this;
    }, arguments[i]);
  }
  return arr;
}

destroyer(["tree", "hamburger", 53], "tree", 53);

Screenshot

wontfix

Most helpful comment

@erictleung Yes. That is correct.

@Frozenprobe since you are using this keyword, the scope (Lexical Scoping) changes while evaluating the tests, and the behavior is unpredictable depending on the browser.

I am not sure if you are aware what that means. But as a best practice if you use below, you should be able to pass the challenge.

function destroyer(arr) {
'use strict'; // <--------- this tells the browser to bind 'this' object to the functions scope.
...
...
}

On that thought maybe we can add that in the seed code for the Algorithms? Not sure I don't want to be confusing campers suddenly with this topic. But that's the way JavaScript Closures work.

All 10 comments

If it passes all tests, usually it should work. Tried to refresh page? Or you can go to the next challenge manually from the map on the right

@Frozenprobe I suspect this is occurring because of how FCC parses your code and so the this keyword will change contexts in unintended ways. But I'm not quite sure.

cc/ @FreeCodeCamp/issue-moderators

@erictleung Yes. That is correct.

@Frozenprobe since you are using this keyword, the scope (Lexical Scoping) changes while evaluating the tests, and the behavior is unpredictable depending on the browser.

I am not sure if you are aware what that means. But as a best practice if you use below, you should be able to pass the challenge.

function destroyer(arr) {
'use strict'; // <--------- this tells the browser to bind 'this' object to the functions scope.
...
...
}

On that thought maybe we can add that in the seed code for the Algorithms? Not sure I don't want to be confusing campers suddenly with this topic. But that's the way JavaScript Closures work.

@raisedadead Thank you for the explanation, this makes sense :)

@raisedadead Very interesting stuff. Didn't know about the this context changes with with eval and strict mode.

However, despite that I would tend to air on the side of "won't fix" for this. This code (as shown by how brittle it is) is too clever for it's own good and I don't think we need to aim our challenges to accommodate hacky code like this (I don't mean that as an insult, it's just not what our courseware or environment is aimed at). It would be much clearer what this code is doing (and less brittle) if you simply made made a copy of the top level arguments with a different name so the filter function arguments wouldn't shadow over it.

Since the site isn't broken (it's simply following JS scoping) and there's a workaround ('use strict';) I don't feel like introducing potential confusion to the lessons to try and avoid this rare edgecase is a worthwhile tradeoff.

@ltegman Yup. I agree and I don't want to be confusing the campers either as I mentioned earlier.

@raisedadead @ltegman agreed. I'll close this issue and just mark it as "won't fix" for future reference. Happy coding y'all!

Just adding my code for future reference. It works when I use the 'use strict' directive.

function filterByElem(elem) {
  'use strict';
  if (elem === this) return false;
  else return true;
}

function destroyer(arr) {
  // Remove all the values
  var array = arguments[0];
  for (i=1; i<arguments.length; i++) {
    array = array.filter(filterByElem, arguments[i]);
  }

  return array;
}

destroyer([1, 2, 3, 5, 1, 2, 3], 2, 3);

Since it didn't pass without the directive, I am wondering... is it some kind of bad practice?

@MarcCoet Nope its not "bad" practice per say, but its a work around for the environment you are in, in most practical implementations, you may never need this kind of a work around, but most importantly you need to know what 'use strict'; does, and how it binds the variable to the context of the scope of the function.

Thanks @raisedadead

Was this page helpful?
0 / 5 - 0 ratings