This is how it feels to learn Javascript in 2016
-
@cark said in This is how it feels to learn Javascript in 2016:
@dkf said in This is how it feels to learn Javascript in 2016:
@cark said in This is how it feels to learn Javascript in 2016:
Giving an object more features than the spec specifies completely goes against ensuring portability
There's no reason that a language can't take the DOM core and profile it to work like I said. The only issue you'd have then is that you wouldn't have portability between programming languages, and nobody really cares that much about that. Really. The code has to be rewritten anyway when being ported to that extent.
The DOM spec by itself is too vague to work with for DOM implementations (e.g. How do you implement
iterable
?). Every DOM implementation today (that I know of) uses Javascript, and the specs for that are WebIDL and ECMAScript. It's a bit pointless to talk about DOM implementions in any other language until the equivalent of WebIDL is produced for that languageAnd for Javascript, WebIDL already specifies a way to loop over
NodeList
andHTMLCollection
like an Array: the for...in loop. No point in making them actual Arrays. Plus, the 'live'-ness requirement of these collections make Array operations on them a bit unintuitive. In the current spec, applying this codevar divs = document.querySelectorAll('div'); for (let d in divs) { d.remove(); }
to this html
<div id='1'></div> <div id='2'></div> <div id='3'></div> <div id='4'></div>
is actually well defined and must delete items 1 and 3 according to spec. Nobody wants to go through the whole suite of Array operations and attributes and figure out how 'live'-ness interacts with each of them.
> var divs = document.querySelectorAll('div'); undefined > for(let d in divs){d.remove();} VM471:1 Uncaught TypeError: d.remove is not a function(…)(anonymous function) @ VM471:1 > divs [<div id="1">1</div>, <div id="2">2</div>, <div id="3">3</div>, <div id="4">4</div>]
@masonwheeler said in This is how it feels to learn Javascript in 2016:
@Rhywden said in This is how it feels to learn Javascript in 2016:
@Yamikuronue Again, you're drawing conclusions from your own condition to mine.
Yes, that's called
"wisdom."the false-consensus effect. The basic idea here is thatpeople are more similar than they are different, and those who have experience in something frequently understand principles that are applicable to others in similar situations."people tend to overestimate the extent to which their opinions, beliefs, preferences, values, and habits are normal and typical of those of others (i.e., that others also think the same way that they do)."FTFY.
@bb36e said in This is how it feels to learn Javascript in 2016:
@anotherusername said in This is how it feels to learn Javascript in 2016:
@dkf well, then, blame the W3C for that, too.
So I think we've all agreed on the conclusion that the web is a shit, we just need to decide on whose fault it is
I thought it was already widely agreed to be Brendan Eich.
-
@Dreikin said in This is how it feels to learn Javascript in 2016:
> var divs = document.querySelectorAll('div'); undefined > for(let d in divs){d.remove();} VM471:1 Uncaught TypeError: d.remove is not a function(…)(anonymous function) @ VM471:1 > divs [<div id="1">1</div>, <div id="2">2</div>, <div id="3">3</div>, <div id="4">4</div>]
That's actually a good catch.
querySelectorAll
returns a non-liveNodeList
. Whenremove
is called on each node, it is removed from the document, but theNodeList
that you're iterating isn't changed.Also, @cark's code was wrong... the variable in
for...in
isn't the element, it's the index to the element, so you need to usedivs[d].remove()
. But then, also,for...in
includes theitem
andlength
properties -- not what you'd want. I think he was thinking offor...of
, which does work correctly for arrays and array-like objects, and the loop variable is the item itself, not the item's index. Another thing,for...of
will iterate through the items in order;for...in
can not be relied upon to visit the object's properties in any specific order.var divs = document.querySelectorAll('div'); for (var d of divs) { d.remove(); }
is correct. However, it iterates all of the elements, and at the end of the loop,
divs
still contains all the elements; it is not a liveNodeList
:Now try it with a live
NodeList
, likeelement.children
:var divs = document.body.children; for (var d of divs) { d.remove(); }
...that code works as @cark expected:
(edit:
document.body.children
is anHTMLCollection
rather than aNodeList
, but it works the same way. If you grabbeddocument.body.childNodes
instead, that would actually be aNodeList
. But it contained text nodes in addition to the element nodes, and I didn't want to deal with that.)
-
@anotherusername Damnit, that'll teach me not to publish code without testing it. You're right on all counts
-
And this is why JavaScript is fuuuuuuuuuuun.
-
@coderpatsy said in This is how it feels to learn Javascript in 2016:
console.log(i, typeof i, arr[j]);
Where is j defined?
-
@Greybeard Ah @accalia s.
-
@masonwheeler said in This is how it feels to learn Javascript in 2016:
Wow. I've gotta send that to my brother. (He's a web developer.)
Just got an email back from my brother:
This is pretty much the truth. Except where it says "we are going to do assembly in the web in a year or two". You can already do assembly in the javascript. There are at least two libraries for it...
But seriously, I really like the ideas in React, but the pure hell of getting it up and running keeps me from ever using it.
-
@Luhmann said in This is how it feels to learn Javascript in 2016:
@Dragnslcr said in This is how it feels to learn Javascript in 2016:
Then have one more drink.
Then post your JavaScript theories on TDWTF.
Thanks in advance.Javascript killed JFK
Elvis faked his own death with Javascript
They're hiding alien Javascript at area 51
-
@anonymous234 said in This is how it feels to learn Javascript in 2016:
I hate how true this is. Idiot network admins have effectively killed every protocol but HTTP.
I keep saying "HTTP is the new TCP" because it pretty much is, except if you try TCP over HTTP you're going to have a bad time.
-
@cartman82 said in This is how it feels to learn Javascript in 2016:
“JavaScript Fatigue Fatigue” @ossia https://medium.freecodecamp.com/javascript-fatigue-fatigue-66ffb619f6ce
Counter-article.
-
@anotherusername said in This is how it feels to learn Javascript in 2016:
node.childNodes is a live NodeList -- changes to the node's descendants affect any reference to that NodeList object in real time.
All this fuss about ArrayLikes.
Was that so hard?
-
@anotherusername said in This is how it feels to learn Javascript in 2016:
With the added gotcha that asynchronous callbacks can't use the loop variable because it changes.
let
/const
don't have this problem.var
should be treated as deprecated.
-
Nowadays you can do:
for( const key of Object.keys( foo ) ) {
for( const value of Object.values( foo ) ) {
for( const [ key, value ] of Object.entries( foo ) ) {
throw in a polyfill and have decent browser support.
JavaScript does still have some warts but most of the problems in this thread have already been addressed.
-
@error now you just need to set up a babel build system, figure out how to best optimize different bundles for http caching, hope all the buggy source maps will work if you need to debug anything, and you're good to go.
-
@ben_lubar said in This is how it feels to learn Javascript in 2016:
Why do we even need jQuery? Is typing
$('#foo.bar').css({backgroundColor: '#abc'})
so much easier than typingdocument.querySelector("#foo.bar").style.backgroundColor = '#abc'
that we need to include a quarter megabyte of JavaScript to make that possible?jQuery includes code that handles fallback if your browser does not support something.
It's just safety net for javascript. If you don't need it's fallback, it just pass the call to corresponding DOM methods. In cases that you need it, you code won't break where it would break otherwise.
It's all about crossbrowser compatibility. We thought crossbrowser compatibility should be an issue that just need to be considered in the past, but sadly that's not true because the standard is still evolving.
-
@masonwheeler said in This is how it feels to learn Javascript in 2016:
When his argument is "this is the way it's done in a huge, horrible, hard-to-understand XML-and-Reflection-based tarpit of a mess in a language that works nothing like JavaScript anyway," then yes.
Maybe the greater wisdom at this point is to know when to give up.
-
@another_sam said in This is how it feels to learn Javascript in 2016:
I keep saying "HTTP is the new TCP" because it pretty much is, except if you try TCP over HTTP you're going to have a bad time.
I've done it once. Once only. It wasn't great but it was the best option at the time.
We were in a multi-day meeting at an office where it turned out that the assurance “yes, you've got access to the internet” evaluated to be HTTP-only port-80-only behind a horrible proxy that basically had trouble with almost everything except GET and (fortunately!) POST. There was no CONNECT. There was no HTTPS. There was definitely no other usable port. (I think that even DNS was somehow restricted, but I forget exactly how. It was quite a while ago.) This was at a time when mobile internet was very slow and very expensive. After the hell of the first day, someone set up a BLOAT server on a system they controlled, set up the proxy on their laptop, and everyone then just used that. It was slow, but it worked; we could SSH out and manage the infrastructure that we were going to demo. Fun project, slightly mad participants…
We blacklisted that venue after that for the rest of the project, despite it being extremely convenient for travel. ;)
-
@error said in This is how it feels to learn Javascript in 2016:
@anotherusername said in This is how it feels to learn Javascript in 2016:
node.childNodes is a live NodeList -- changes to the node's descendants affect any reference to that NodeList object in real time.
All this fuss about ArrayLikes.
Was that so hard?
You're making a naive assumption that people are using browsers that support something that was added to the standard last year.
Fun fact, according to the page you linked, this feature has no mobile support except on Firefox. Meaning that, out of box, Android or iOS devices don't support it.
-
@powerlord said in This is how it feels to learn Javascript in 2016:
@error said in This is how it feels to learn Javascript in 2016:
@anotherusername said in This is how it feels to learn Javascript in 2016:
node.childNodes is a live NodeList -- changes to the node's descendants affect any reference to that NodeList object in real time.
All this fuss about ArrayLikes.
Was that so hard?
You're making a naive assumption that people are using browsers that support something that was added to the standard last year.
Fun fact, according to the page you linked, this feature has no mobile support except on Firefox. Meaning that, out of box, Android or iOS devices don't support it.
A few minutes later, I linked to a polyfill that contains it.
-
@error said in This is how it feels to learn Javascript in 2016:
@anotherusername said in This is how it feels to learn Javascript in 2016:
node.childNodes is a live NodeList -- changes to the node's descendants affect any reference to that NodeList object in real time.
All this fuss about ArrayLikes.
Was that so hard?
function makeArrayFrom(input) { var result = []; for (var i = 0; i < input.length; i += 1) { result.push(input[i]) } return result; }
no, not really.
-
@accalia Why reimplement the standard API?
-
@error said in This is how it feels to learn Javascript in 2016:
@accalia Why reimplement the standard API?
- the standard API isn't standard across all browsers i need to support
- because the API isn't implemented by every browser i need to support
- there are browsers that i need to support that do not implement the API
- Among the browsers i support there are those that do not comply with the API
-
Also, there's a reasonable chance of supporting browser versions not yet deployed without major code revisions if you delegate the crap to a library that's specifically maintained to handle all this stuff. Because who wants to have to rewrite everything just to handle yet another special ?!
-
@another_sam said in This is how it feels to learn Javascript in 2016:
except if you try TCP over HTTP you're going to have a bad time
I'm pretty sure at least one person has written a Javascript VM that attempts it.
-
@Adynathos said in This is how it feels to learn Javascript in 2016:
That is why I find the Polymer library promising.
https://elements.polymer-project.org/guides/using-elements
Polymer contains a few primary collections of elements:
- Iron elements. A set of utility elements including generic UI elements (such as icons, input and layout components), as well as non-UI elements providing features like AJAX, signaling and storage.
- Paper elements. A set of UI elements that implement the material design system.
- Gold elements. Form elements for ecommerce.
- Neon elements. Animation-related elements.
- Platinum elements. Elements for app-like features, like push notifications, offline caching and bluetooth.
I think I'll pass, thanks. If they can't even think of non-stupid names for their components, I don't want to see what their code looks like. (Gold elements? Seriously?)
-
@ChrisH said in This is how it feels to learn Javascript in 2016:
If they can't even think of non-stupid names for their components
I can't say whether their code is any good, but I like these names more than average names.
-
@Adynathos said in This is how it feels to learn Javascript in 2016:
@ChrisH said in This is how it feels to learn Javascript in 2016:
If they can't even think of non-stupid names for their components
I can't say whether their code is any good, but I like these names more than average names.
Well I mean they're better than Kafka and Ooze, but not much.
-
@pydsigner said in This is how it feels to learn Javascript in 2016:
they're better than Kafka and Ooze, but not much.
Naming things is hard. Naming things after elements is not terrible. Naming things "Kafka" and "Ooze" is pants-on-head.
-
@HardwareGeek said in This is how it feels to learn Javascript in 2016:
@pydsigner said in This is how it feels to learn Javascript in 2016:
they're better than Kafka and Ooze, but not much.
Naming things is hard. Naming things after elements is not terrible. Naming things "Kafka" and "Ooze" is pants-on-head.
Sure, and I get what they're going for with the whole "element" "elements" thing, but when you stop and think about it "Gold elements" or "Neon elements" is just awful.
-
@HardwareGeek said in This is how it feels to learn Javascript in 2016:
Naming things after elements
@ChrisH said in This is how it feels to learn Javascript in 2016:
Paper elements
TIL
-
@pydsigner said in This is how it feels to learn Javascript in 2016:
"Neon elements"
-
@pydsigner said in This is how it feels to learn Javascript in 2016:
Sure, and I get what they're going for with the whole "element" "elements" thing, but when you stop and think about it "Gold elements" or "Neon elements" is just awful.
I think just the opposite. Gold...commerce. Neon...animation...like neon signs. There's some sense there.
-
@boomzilla said in This is how it feels to learn Javascript in 2016:
I think just the opposite. Gold...commerce. Neon...animation...like neon signs. There's some sense there
I get what they're doing there too, but it all breaks down and feels hipsterish and forced.
-
@pydsigner said in This is how it feels to learn Javascript in 2016:
it all breaks down and feels hipsterish and forced
This is how it feels to learn Javascript in 2016.
-
@pydsigner said in This is how it feels to learn Javascript in 2016:
but it all breaks down and feels hipsterish and forced.
-
@accalia said in This is how it feels to learn Javascript in 2016:
@pydsigner said in This is how it feels to learn Javascript in 2016:
but it all breaks down and feels hipsterish and forced.
Javascript
-
@pydsigner said in This is how it feels to learn Javascript in 2016:
@accalia said in This is how it feels to learn Javascript in 2016:
@pydsigner said in This is how it feels to learn Javascript in 2016:
but it all breaks down and feels hipsterish and forced.
Javascript
nothing is a barrier to if your is strong enough.
-
@accalia said in This is how it feels to learn Javascript in 2016:
nothing is a barrier to if your is strong enough.
I really must disagree. Politicians are the canonical case where EWWWbot is required instead…
-
@dkf said in This is how it feels to learn Javascript in 2016:
@accalia said in This is how it feels to learn Javascript in 2016:
nothing is a barrier to if your is strong enough.
I really must disagree. Politicians are the canonical case where EWWWbot is required instead…
/me pauses in the middle of attempting to strap Trump to a giant dildo shaped like Abraham Lincoln and filled with Ammonium Perchlorate (with included burn chanel and twisted fluted nozzle for rotational stability
really? they why do i launch politicians into space on giant (used) dildo rockets?
-
@accalia said in This is how it feels to learn Javascript in 2016:
they why do i launch politicians into space on giant (used) dildo rockets?
-
@dkf said in This is how it feels to learn Javascript in 2016:
@accalia said in This is how it feels to learn Javascript in 2016:
they why do i launch politicians into space on giant (used) dildo rockets?
IN SPACE.......
NO ONE CAN HEAR YOU KABOOM........
</epic_narrator_sagan>