Unclear code in: "Use class Syntax to Define a Constructor Function"

JavaScript
1

Tell us what’s happening:
why did we use the first function??
why couldn’t we use:

Your code so far


class Vegetable {
     constructor(Vegetable){
       this.name = Vegetable;
     }
   }

const carrot = new Vegetable('carrot');
console.log(carrot.name); // => should be 'carrot'

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_2) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/71.0.3578.98 Safari/537.36.

Link to the challenge:
https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/es6/use-class-syntax-to-define-a-constructor-function

2

It seems like the function in this challange has no use, i just removed everything relating to the function and the code worked and let me pass. So i would also be interested in knowing, if the function has any other benefit to it. Maybe it was just to show us that you can put classes in a function? But jeah that would be my best guess.

3

I agree, there may be a reason but it isn’t clear at all what that might be.

4

Pretty sure it’s for the test.

5

Well that was odd. Somehow he thought he needed to reassign an existing class to a new variable, but there was nothing in either the problem statement or tests that indicated that that was necessary. Anyway if you want to assign a class name to another variable you just do it. for example:

class v {
  constructor(name) {
    this.name = name;
  }
}

const Vegetable = v;
const carrot = new Vegetable('carrot');
console.log(carrot.name); // => should be 'carrot'
6

Again I’m not sure but.

I think it has to do with the ‘use strict’ directive. I think the directive has to be scoped to an enclosing function for each test. So the class will also be scoped to that function and you can’t get to the class from the outside.

function scoped() {
'use strict'
  class v {
    constructor(name) {
  	this.name = name;
    }
  }
}

// Can't do that
const Vegetable = v;
7

Essentially you are right about the tests.

‘use strict’ was a directive with es5 that forced the JS interpreter to throw errors on certain things when it would normally just fail silently and a couple other things to make JS more secure and forward compatible (for things like class, which are es6).

Modern browsers’ JS engines automatically default to strict mode and you don’t totally need the directive, but there is always the chance that someone may be using an old IE or some such. Also, when these lessons were written, there was less uniformity of the implementation of strict mode and es6 among the browsers.

Because of this, the best way to ensure that the tests would work no matter what was to wrap the problem in a function that packaged the ‘use strict’ every time.

Incidentally, this is also part of why Babel is such a useful tool.

8

The ‘use strict’ directive can be in the global scope. Although in general it is good practice to restrict it to function scope (or name-spaced in an IIFE). The reason is that if you were to include scripts from sources that you don’t control then you might break them because then they would also be subject to the directive and if they are sloppily written they might error out in ‘strict mode’. That is not the case here.

I haven’t seen the need for ‘strict mode’ in any of the other exercises, although I might have missed it, so I find it odd that it is suddenly deemed necessary here.

The reason to make a point of it is that introducing such an odd construct is unnecessary and confusing, thus the original poster’s question. If for no other reason than clarity this problem should be rewritten.

1 Like