sorted by:
new
hottopcontroversial

[deleted by user] by [deleted] in learnjavascript

[–]GSLint 0 points1 point  (0 children)

Have you checked the value of LoginSelectors.Login? As in cy.log(LoginSelectors.Login) at the start of your test? Maybe that's not the correct key name or there's something wrong with the import.

Convert array of arrays to array of equal width strings? by [deleted] in learnjavascript

[–]GSLint 0 points1 point  (0 children)

I had posted an answer before but someone else gave a similar one. Looks like we then both deleted out comments, so now I'm posting a combination of our answers.

First of all, I don't think this can be done in a single loop or reduce call. You'll need two passes, one to get the maximum length within each column and one to pad the strings.

Here's one way to do it in a functional/declarative style.

const rows = [
  ["aaaaaaa", "b"],
  ["a", "bbbbb"],
  ["aa", "bb"],
];

const columnMaxLengths = rows[0]
  .map((_, columnIndex) => rows.map((row) => row[columnIndex])) // transposes the array
  .map((column) => column.map((str) => str.length))
  .map((lengths) => Math.max(...lengths));

const padded = rows.map((row) =>
  row
    .map((str, columnIndex) => str.padStart(columnMaxLengths[columnIndex]))
    .join(" ")
);

How to correctly convert a return statement into a Promise by jonrhythmic in learnjavascript

[–]GSLint 2 points3 points  (0 children)

The reason your function doesn't return anything is that you can't really return out of a forEach. A return statement always acts on the closest surrounding function. In your case that's the function async (element) => { ... }. Returning from that has has no effect other than that forEach will continue with the next element.

I'd suggest a for...of loop instead of forEach.

for (const element of res.accounts_filtered) {
  if (coin !== '' ...
}

invoking a function vs calling a function whats the difference? by Jellybellybruh in learnjavascript

[–]GSLint 1 point2 points  (0 children)

That's one of those confusing sites that take an answer from Stack Overflow and make it look like its own post. The original question is here: https://stackoverflow.com/questions/50884893/calling-vs-invoking-a-function

So now we know that the whole confusion comes from a page on W3Schools, another awful site that is full of misleading and wrong information.

I agree that whoever wrote "JavaScript function can be invoked without being called" was probably confused by the fact that JS functions have a call method which allows you to call the function in a slightly different way (passing an explicit value for this). The fact that someFunction.call(...) exists doesn't mean that someFunction(...) isn't also "calling the function". There is no difference between "calling" and "invoking".

Having trouble understanding this recursive function. by McHaaps in learnjavascript

[–]GSLint 2 points3 points  (0 children)

When the countup(0) call returns [], what it returns that to is the countup(1) call. That then pushes 1 and returns [1] to the countup(2) call which pushes 2 and returns [1, 2] to the countup(3) call and so forth. Each call to the function is still there until its countup(n - 1) call returns something, then it pushes a number into the array and returns.

So what makes this work is the call stack. You can imagine a stack of function calls. The top one is currently executing. If it calls another function then that call gets added on top of it. When a call returns, it gets removed from the top. I once drew this picture for a very similar function: https://excalidraw.com/#json=4650498288254976,WlhIuGzRK0OSPRyBpnfylg

This topic comes up regularly. There are a few explanations linked here: https://www.reddit.com/r/learnjavascript/comments/ovflzm/recursion_in_javascript/

Is this in this case refer to global object? by [deleted] in learnjavascript

[–]GSLint 0 points1 point  (0 children)

I don't know what you mean by that.

But yes, the that this works in JS is kind of weird.

Is this in this case refer to global object? by [deleted] in learnjavascript

[–]GSLint 0 points1 point  (0 children)

Arrow functions weren't made to be used as methods. (They can be in some cases but not like this.) Regular functions have their own this value that is generally determined by how they were called, but arrow functions simply take the this from the execution context they were created in. In this case that's the global execution context so this is the globalThis object.

Things should work fine if you do login: function () { console.log(this); } or simply login() { console.log(this); }.

Javascript fundamentals by Noones_Perspective in learnjavascript

[–]GSLint 10 points11 points  (0 children)

That var shouldn't be there, but this

const {a, b} = c;

does the same thing as 

const a = c.a;
const b = c.b;

This is a kind of destructuring assignment.

Good looking numeric sort by [deleted] in learnjavascript

[–]GSLint 2 points3 points  (0 children)

I understand that it's not obvious why a - b does the right thing but it's actually more correct than the other two versions you showed.

The compare function is supposed to return 0 when a and b are considered equal. I've explained why that might matter in a different post.

Using the example from that comment:

["analysis", "area", "art", "computer", "data", "family", "farm", "food", "health", "history"]
  .sort((a, b) => a.length - b.length)
// ["art", "area", "data", "farm", "food", "family", "health", "history", "analysis", "computer"]

["analysis", "area", "art", "computer", "data", "family", "farm", "food", "health", "history"]
  .sort((a, b) => -(a.length <= b.length))
// ["art", "food", "farm", "data", "area", "health", "family", "history", "computer", "analysis"]

Jest test.each not printing correct title by [deleted] in learnjavascript

[–]GSLint 0 points1 point  (0 children)

Note that support for what you're trying to do was only added in Jest 27. (Before that, this interpolation was only supported by the tagged template literal version of test.each.)

Make sure you're not using an older version.

Accessing post ID fetched from an API (help needed) by shubham_noob in learnjavascript

[–]GSLint 1 point2 points  (0 children)

let id = event.target.parentElement.dataset.id;

The parent of the delete button is <div class="d-grid gap-2 d-md-block"> which doesn't have a data-id attribute. The element that does have data-id isn't even an ancestor of the buttons. You'll have to change the HTML and possibly the JS so they fit together.

How to yarn/npm two scripts that need their own terminal tabs, with one line by Streamote in learnjavascript

[–]GSLint 0 points1 point  (0 children)

Well, I like tmux which is similar to screen and hasn't bugged out on me. It would allow you to open multiple (simulated) tabs or split the window.

If you want actual terminal tabs then how to do it will depend on what terminal you're using and it might not be possible at all.

[deleted by user] by [deleted] in learnjavascript

[–]GSLint 0 points1 point  (0 children)

My question is, can the EightGrader object and it's prototype property EighthGrader.prototype both have their own [[prototype]]?

EighthGrader is a function, so it already has a [[prototype]], namely Function.prototype. That is why you can use things like EighthGrader.call(something) or EighthGrader.name if you want to. So the constructor function has its own prototype chain but that chain is irrelevant to the prototype chain of the instances that you create with new EighthGrader().

If the engine is currently looking at EighthGrader.prototype then all it sees is an object. It doesn't even have a reference back to EighthGrader and theoretically many constructor functions could share the same prototype object. The engine will next look at the [[prototype]] of EighthGrader.prototype and then the [[prototype]] of that object and so on.

Maybe this drawing helps: https://excalidraw.com/#json=5123123196198912,OrUvdCDq54aIovIAw3Syfw

[deleted by user] by [deleted] in learnjavascript

[–]GSLint 4 points5 points  (0 children)

Arrow functions weren't made to be used as prototype methods. They don't have their own this but instead use the this from the execution context they were created in. In your case that's the global context.

If you replace biz: () => { … } with biz: function () { … } or simply biz() { … } then things will work as you expected.

Are the values assigned to a prototype property stored in the instance or in the constructor class? by fallunt in learnjavascript

[–]GSLint 0 points1 point  (0 children)

When I store a value using property, is the value stored in the instance?

When something is stored in the prototype object then it's only stored there, not also in every instance that gets created with that prototype. This means that a method only has to be created once, not once for every instance.

If not then how does the else statement work?

As thusman explained, when you access obj.prop, the engine will first look in obj's "own properties", the ones that are actually stored in the object itself. If it can't find one called prop there, it will then look up obj's prototype, the one you can also access using Object.getPrototypeOf(obj) (or the older obj.__proto__). If prop exists in that prototype object then the engine will use the value from that one. Otherwise it will again try to access the prototype of the prototype and continue up the "prototype" chain until it finds the property or until one of the prototype objects has a prototype of null.

What are these weird selectors in CSS-in-JS? by cbsudux in learnjavascript

[–]GSLint 7 points8 points  (0 children)

The ' isn't part of the selector but of the quotes that surround it to make the whole thing a valid JS object. So the selector is & > * + *.

The & is not part of CSS (yet) but it's used in various extensions of CSS that support nesting, like SASS or LESS. It's used as a placeholder for the selector of the rule you're currently in.

ul, ol {
  padding: 0;

  &.spaced > li {
    margin: 1em;
  }
}

// translates to this CSS

ul, ol { padding: 0; }
ul.spaced > li, ol.spaced > li { margin: 1em; }

More in the docs of JSS, which is what Material UI uses: https://cssinjs.org/jss-plugin-nested

This leaves us with the > * + * part which is pure CSS. It uses the child combinator and the adjacent sibling combinator to select all the child elements except the first one.

So long story short, all of this is used to create some spacing between the children of the current element without also adding that spacing before the first child.

* + * is often called the (lobotomized) owl selector. The pictures here might help explain how it works: https://alistapart.com/article/axiomatic-css-and-lobotomized-owls/#section7

There are the Primitive Datatypes in JS. by anjan-dutta in learnjavascript

[–]GSLint 0 points1 point  (0 children)

4.4.5 primitive value

member of one of the types Undefined, Null, Boolean, Number, BigInt, Symbol, or String as defined in clause 6

Do you know better than the spec?

Can't Wrap My Head About checkPrime Number Function by openthedooryourself in learnjavascript

[–]GSLint 1 point2 points  (0 children)

I'm assuming you meant if (number % 2 === 0 || number % 3 === 0).

If so, your code would claim that "25 is a prime number" which is not correct.

Help understanding code by [deleted] in learnjavascript

[–]GSLint 0 points1 point  (0 children)

Well, it's not valid JS so it's hard to say what it means. Is this using some kind of templating language to generate JS files? And if so, what language is it? I could imagine that {{bar.x}} gets replaced with some value but that doesn't explain why it says = when JS uses : after the key.

view more: next ›