55 ms·
Modern Javascript: Everything you missed over the last 10 years (2020)
- XCSme 5y agoSome other important features and browser APIs released in the last ~10 years: Web Workers, WebGL, OffscreenCanvas, Typed Arrays, Web Audio, Web Notifications, WebRTC, Websockets.
- dleslie 5y agoDoes anyone have a handy reference for those, that they would recommend?
- meheleventyone 5y agohttps://developer.mozilla.org/en-US/ https://developer.mozilla.org/en-US/ MDN is amazing, coming from games and working on a web project the level of documentation is incredible.
- irrational 5y agoIt should be considering who is backing it. https://www.infoq.com/news/2017/10/microsoft-google-mozilla-mdn/ https://www.infoq.com/news/2017/10/microsoft-google-mozilla-...
- meheleventyone 5y agoEven big companies such as those supporting MDN have terrible developer documentation. MDN is something quite special even given who supports it.
- XCSme 5y agoTo be honest, MDN docs were really good even before it started getting support from other companies.
- oweiler 5y agoNot a huge fan of JS but you can't deny that the language has improved tremendously over the years while still maintaining backwards compatibility.
- swiley 5y agoI don't know if this is part of the standards but there was a backwards incompatible change in the way regex worked around firefox 73 and a bunch of sites crash in older firefox now.
- dleslie 5y agoI'd like to say it's a testament to the original design; but I can't overlook the hundreds of millions of dollars, perhaps more, that has been spent to improve the language. It's nothing short of incredible that it is as fast as it is and as useful as it is. It shows that many hands do make light work; and money can buy that effort.
- irrational 5y agoI don't have any numbers to back this up, but I'm pretty sure that between Google, Mozilla, MicroSoft, etc. more resources (both people and money) have been put towards improving JavaScript (language and performance) than any other language in the history of programming. Now I hope someone will provide numbers to show why I'm wrong.
- dleslie 5y agoI want to say that C has had more resources due to it being the defacto compiler reference target; but honestly, I doubt it.
- hajile 5y agoHuge amounts of inspiration came from coffeescript. The biggest advantage of JS has often been going last and executing what is already proven to be a great idea.
- montroser 5y ago
- paozac 5y agoProgramming languages are tools, what matters is if they do their job. And the current popularity of javascript means it works for most people. But boy, how ugly and inconsistent it is. I wish I could like it.
- gentleman11 5y agoIf people didn’t like JavaScript for front end work, it’s not like they could just switch to python
- globular-toast 5y agoI use both JS and Python for work and not a day goes by where I don't wish history had taken a different course and Python had ended up embedded in web browsers.
- paozac 5y agoOr Lua
- fit2rule 5y agoThis, a thousand times.
- qbasic_forever 5y agoThere was a strange time in the dark days of IE6 dominance 20 years ago that you actually could write page scripts in non-javascript languages. VBScript was a big option that some people used, and IIRC there was a way to get python support in IE (and Windows) script host too. When I was first learning Javascript in ~1998 I remember all the docs showed how to do stuff in both JS and VB script tags: https://stackoverflow.com/questions/17483782/vbscript-support-in-internet-explorer-11 https://stackoverflow.com/questions/17483782/vbscript-suppor...
- garyrob 5y agoThis brand-new book on using Python (via Transcrypt) in the browser to build a React app may be helpful in that regard: https://pyreact.com https://pyreact.com. Just started reading it. Seems very good so far.
- j45 5y agoNice read. I wish something would speak to the increased brittleness of software in this world too.
- tyingq 5y agoSite seems a bit overwhelmed, archive.org copy: https://web.archive.org/web/20210515151920/https://turriate.com/articles/modern-javascript-everything-you-missed-over-10-years https://web.archive.org/web/20210515151920/https://turriate....
- sandrot 5y agothank you. I had to change my idle connection timeouts. Eeep!
- tomxor 5y agoThere's a lot to like in modern Javascript, pretty much everything in the list I appreciate. The only thing I wish was never added is the new Array Functions, I mean, ok they are "handy" sometimes, but they seem to get abused heavily. Newbies like stringing them together and even nesting them, when they could have achieved the same with a single for loop and the same number of lines. In other words they seem to encourage people to artificially increase the complexity of a problem without any objective improvement in legibility, not to mention lots of GC work with throw away arrays... many people don't seem to even be conscious that under the hood of most of the array functions is just another iterator of some kind.
- contriban 5y agoMany array looping functions have been around since ES5 and I've been personally replacing them to for-of loops with very few exceptions (.map() and .filter() remain handy) Useful fresh additions are .find() and .includes()
- rm_-rf_slash 5y agoVectorized array functions are easier for the compiler to optimize than for loops. Once things get nested the performance comparison isn’t even close.
- Etheryte 5y agoAs a standalone idea yes, however in practice this is not actually the case [0], mostly due to those methods having a number of extra checks, more functionality built into them etc. [0] https://stackoverflow.com/q/21037888/1470607 https://stackoverflow.com/q/21037888/1470607
- rm_-rf_slash 5y agoFair point, although as the answer states, it depends on use cases. Working with small datasets the performance difference is negligible, but with decently large datasets (~1-100mb) and nested loops the delta is night and day.
- user3939382 5y agoThe Winchester House was continuously added onto by a huge construction crew for many years after the death of Mrs. Winchester’s husband. She believed her psychic who told her she had to continuously add onto the house to repent for the people killed by her family’s rifles during the civil war. The result is a sprawling, very crazy looking house that no one would have sat down and designed upfront. I think of JavaScript as the programming language equivalent of this house.
- nsonha 5y agoMost programing languages old enough have that problem: C#, php, C++. And modern js does not look crazy, it's the es5 and bellow that was a bit wacky. Typescript is much cleaner than the 3 languages I mentioned, my opinion.
- TchoBeer 5y agoPython is pretty old and (imo) doesn't have that problem
- finiteseries 5y agoThat’s probably why they said most, not all.
- dehrmann 5y agoOh, yes it does. Built-in method and class naming is wildly inconsistent. OO is bolted on, typing is bolted on. While not "the language," the GIL and what it means for parallelism (multiprocessing is a shit show) was a mistake.
- nsonha 5y agoI know about these things. The reason I did not use python as an example is that syntax is kind of neat. I dont think it's something to be too proud of if the only thing nice about your language is the syntax.
- 5y ago
- rm_-rf_slash 5y agoJavaScript has grown a lot in the last 10 years, the last ~5 in particular with ES5/ES6. There are still “fucking JavaScript” moments but those are few and far between compared to what they used to be. The “...” operator in particular has been hyper useful for neatly modifying complex objects without turning into spaghetti code. SPA+node/express is a pretty solid stack these days because of these improvements. I no longer find myself missing Rails for Ruby’s syntactic sugar and knowing that operations on the server will work exactly the same on the client has been great for browser console debug sessions. The holy grail would be for HPC JavaScript libraries to allow the same ease of implementation to use something like NVIDIA RAPIDS (especially RAPIDS itself) as easily as we get with Python. Given how far js has come, I don’t think that’s an unrealistic proposition.
- lanstin 5y agoAdding existing c libraries to python is trivial, and very C like experience for memory management etc. adding existing C libraries into node engine requires more skill and delicacy due to the C++ and the relatively more complicated v8 way of doing things.
- macando 5y agoasync await was the biggest breakthrough for me. Made JavaScript code 3x more readable.
- contriban 5y agoConfirmed. Every time I convert an old Node project to promises I constantly find bugs and situation that were just lost in the hell. The result is also so much cleaner that sometimes you realize you were doing something wrong entirely and you scrap the whole thing. No other JavaScript improvement comes close. Everything else is nice but only saves a few chars at most.
- macando 5y agoAnd they announced promises like a big improvement over callbacks :D Now that was hell! Fortunately, when I started doing serious Node.js development, callbacks were already on the way out.
- BenoitEssiambre 5y agoI really wish when things moved to async/await, that they would have gotten rid of promises like I proposed here: https://es.discourse.group/t/callback-based-simplified-async-await/343 https://es.discourse.group/t/callback-based-simplified-async... As it stands it's layers of caching, state machines and complexity.
- Sephr 5y agoYour proposal seems very reminiscent of the generator-based JavaScript async library I created back in 2010: https://eligrey.com/blog/pausing-javascript-with-async-js/ https://eligrey.com/blog/pausing-javascript-with-async-js/
- Oddskar 5y agoIt's building on top of something that developers should be using anyway; or at least have familiarity with. I'm quite glad they ended up going this route for that reason.
- lewisjoe 5y agoI made a similar detailed document to bring my team up on the modern web dev workflows: https://bit.ly/3oi08M2 https://bit.ly/3oi08M2
- YouthfulMarxism 5y agoI'm so disapointed by the committee. So many utterly useless or easily bootstrappable features and yet, no pattern matching and pipeline operator stage 3 proposals. 0 progress for so many years. Lack of those roadblocks Typescript implementations. ReasonML and KotlinJS will faster become practical general purpose web languages than committee would start doing something usefull.
- anonymoushn 5y agono coroutines no buy
- osmarks 5y agoGenerators are basically coroutines, aren't they?
- Cyberdog 5y ago> Lack of those roadblocks Typescript implementations. Is it JavaScript's job to improve the lives of transpiler implementers instead of improving the lives of JavaScript developers?
- epmatsw 5y agoI think they’re saying that TS won’t add the feature until JS does. Still kind of a strange take IMO, but makes a little more sense.
- YouthfulMarxism 5y agoFirst of all Typescript, is now more mainstream JS dialect than vanilla-js itself and, honestly, the only one i care about. And i thought it's kind of obvious for anyone, that until *JS* proposals are staged far enough - Javascript won't have those features too. There is a good reason why TS waits for the stage 3.
- halfmatthalfcat 5y agoIt took 6 years to ship ES6. We've now had a new spec iteration from every year after 2015. They are moving much, much faster and, having lived through ES5 to much pain and angst, I'm completely ok with them taking their time shipping these (very nice to have) features.
- jonplackett 5y agohttps://web.archive.org/web/20210515151920/https://turriate.com/articles/modern-javascript-everything-you-missed-over-10-years https://web.archive.org/web/20210515151920/https://turriate....
- flowerlad 5y ago10 years ago JavaScript was an ugly language, with its clunky prototypal inheritance and so on. Modern JavaScript is a beautiful language, however, especially when enhanced with static typing as in TypeScript. So much so, that Stanford has replaced Java with JavaScript for its introductory programming course [1]. [1] https://web.stanford.edu/class/cs106j/handouts/01-GeneralInformation.pdf https://web.stanford.edu/class/cs106j/handouts/01-GeneralInf...
- BenjiWiebe 5y agoI feel that being nicer than Java is a pretty low bar.
- qsort 5y agoWhich version? I feel like Java >=11 is absolutely fine, but if you're talking about earlier versions you have a point.
- xhkkffbf 5y agoA number of schools like Dartmouth did this more than 15 years ago.
- criddell 5y agoPicking a language to teach programming and concepts in computer science presents an interesting conundrum. Do you pick a commercially relevant language (which most students want) or go with one that might be better for academic purposes? I probably lean mostly towards the former because time spent learning something like Eiffel feels somewhat wasted.
- DrFell 5y agoJavaScript is a great browser scripting language because it's the only browser scripting language. That's a whole realm of good times, and people can and should go nuts with it there. The problem started a decade or so ago with Node. Too many people only learn JavaScript, become psychologically dependent on it, and they all collectively took it too far outside of a browser. ECMAScript is a general purpose standard, but it was invented retroactively. Node is not ECMAScript in a server-side ECMAScript engine, it's JavaScript in a browser JavaScript engine. That's just too much of a force fit, and has wasted too much potential for me to say anything positive about it.
- austincheney 5y agoThere are a couple of things that JavaScript got so incredibly correct: * Lexical scope natively without syntax or conventions * Functions as first class citizens * Inheritance, classes, OOP are not forced on you and can be ignored/omitted entirely from your code Those few things are what has kept me hooked on the language. > Node is not ECMAScript in a server-side ECMAScript engine, it's JavaScript in a browser JavaScript engine. What does that even mean? The APIs are completely unrelated and Node does different things that don’t make sense in the browser.
- galangalalgol 5y agoThat last bullet is my main complaint with java and c#.
- wvenable 5y agoC# just removed the requirement to start code with a class or a main method; you can just start typing into the file.
- metaltyphoon 5y agoI like this so much. In fact they are investigating the idea of #!/usr/bin/dotnet on a .cs file!
- Cyberdog 5y agoI didn't know JS had `??` for a nil coalescing operator, or, more specifically, I thought it already had `||` for that purpose, since I've been using it for that for a decade or so without any problems. How do the two differ?
- TooCleverByHalf 5y ago?? - returns right side operand if left side operand is null or undefined || - returns right side operand if left side operand is any falsy value
- luftbbb 5y agoNull coalescing is far more concise and basically offers a retroactive step in the case of a null. It's entirely different from using an OR condition
- qsort 5y ago> 0 ?? 1 0 > 0 || 1 1
- nailer 5y agoI like this answer because it’s practical. Eg score 0 is a different thing from score undefined (which means you don’t know the score).
- frosted-flakes 5y ago?? only coalesces nullish values (hence the name), which only includes null and undefined. || coalesces falsey values, which include false, 0, and empty strings. || might work most of the time, but it requires extra checks when falsey values are valid.
- beardyw 5y agoI think ?? only acts on null or undefined, || acts on any falsey value.
- cosmotic 5y agoPlease stop calling it modern. Call it New Features in ECMAScript 5 through 11.
- hnarn 5y agoDidn't ES11 come out last year?
- csbartus 5y agoI don’t really know. For me, it’s like PHP, or worse. Yes, this modern javascript, the old one is even worse. I’m trying to get rid of it and move to a functional language like Clojure (actively learning) or perhaps Rescript. Meantime I found Ramda.js and so far so good. No more javascript fatigue. Ramda, React, and Typescript looks like a good patch for the short term. On long term I definitely need something integrated. And something integrated with the running environment. Node, Webpack, Babel are a real pain. I think the future is bright. We’ve learnt the pain making all above work, and work together. Now something really new is coming. Statically typed, functional (the good parts), focussing on problem solving, and leaving the quirks behind.
- sherr 5y agoSome typos : "paramaters"
- riho 5y agoSeeing a lot of distain for JavaScript in here, but not enough examples of what's actually wrong with it. It's fine to criticize the language, there certainly are issues with it, but I'd like to see some actual constructive comments and examples from other languages where it's done better.
- indymike 5y agoMost of the complaints aren't really about the language syntax or capabilities. Aside missing proper support for integers, modern Javascript is pretty nice. The complaints mostly come from developers being forced to use either Javascript (only way in the browser), or being forced to change code because of breaking changes in libraries.
- hajile 5y agoLibrary changes aren’t what they used to be. It was once frameworks of the month. At this point, React has been undisputed king for over half a decade. Major libraries like react, moment, lodash, express, etc all have had stable APIs for years now and aren’t any worse that any other language I’ve used. Complaints like integers come from not studying the language and not keeping up to date. Asm.js type directives have offered 31-bit integers for years now on all major JITs. That is slowly not working again as wasm takes over, but BigInt has been included for quite a few browser versions now.
- indymike 5y ago> Complaints like integers come from not studying the language and not keeping up to date. Perhaps, or perhaps fixing one too many bugs where someone thought floats were appropriate for all the things. Regardless, forced change, even if it is a good change, is still forced.
- toolslive 5y agobesides being really insane typing wise, javascript also both really lenient and unpredictable in what it accepts as expressions. Try to guess the result of the following expressions: > [] + [] > > {} + [] > > [] + {} > > {} + {} It means that if you feed it nonsense it does not stop you but happily carries on and explodes a few milliseconds later somewhere else. Another can of worms is the difference between null, 0,undefined, '', .... Ok, you got me worked up. I need to go for a run to blow off steam.
- 29athrowaway 5y agoThis article is very distant from "Everything"... - Modules - Set and Map, WeakSet and WeakMap - String interpolation - Private methods (# prefix) - Template literals - Typed arrays - Symbol type - Generators - Proxy / Reflect - Internationalization And more...
- epaulson 5y agoI'm years behind on Javascript (I'm circa 'AJAX is new' in my knowledge) but I've been having good luck catching up using the Babel REPL with small snippets to just see how the new features get translated into the Javascript I know. Seeing what the compiler renames is a good way to understand the new scoping rules, etc. It's been especially helpful for yield and async/await, but I wonder if there's a bug in Babel with async/await. Just using the code sample from the article: function fetchUserName() { return new Promise(resolve => setTimeout(resolve, 500)) } async function withAsync() { print("withAsync: fetching...") await fetchUserName() print("withAsync: done") } await withAsync() when I set the target to be 'ie 6', so hopefully I get output that's only the Javascript that I know, most of this gets translated to (a lot of) Javascript that looks normal for 2005 Javascript - except the last 'await' line is still there. Is that a bug/limitation in Babel or was 'await' present in Javascript from years ago?
- dclowd9901 5y agoI don't know what the REPL you're running does with top level functions, but my guess is that an `await` needs to run within a function that is declared `async`. The reason (if so) would be that then babel could then transpile the function appropriately into a Promisory function. At the top level, what function would be translated?
- mweberxyz 5y agoTop-level await is very, very new and requires ES modules -- you can only use this feature without warnings recently in Node 15. For the foreseeable future, the final line should be replaced with: withAsync() .then(() => print("done") .catch((err) => console.error(err);
- sandrot 5y agoYou're right, thank you for the explanation. My REPL runs the code in the textarea in an anonymous Async function, which is why top level async works in my examples.
- qwertox 5y agoIt's a great compilation, but I'd like to have each item to have a link to the related caniuse.com page. Sometimes I can use Array.forEach() and sometimes not, and I don't know why, even if I'm only using Chrome. So I just use lodash.
- sandrot 5y agoTry using Array.from(arrayish).forEach() to convert the thing that looks like an array to an actual array. For instance, you can't use map() on a NodeList (document.querySelectorAll returns a NodeList), so you have to use Array.from(NodeList) to first convert it to an array.
- dragonwriter 5y ago> Try using Array.from(arrayish).forEach() to convert the thing that looks like an array to an actual array. Spread syntax is my goto for that: [...arrayish].forEach(...) But, it being JavaScript, there’s probably a subtle distinction in where Array.from(arrayish) works and where [...arrayish] works.
- hajile 5y agoThere's a very big distinction. `...foo` requires `foo` to be an iterable (implements the iterator known symbol). `Array.From()` only requires it to be array-like and not necessarily iterable.
- dragonwriter 5y agoGood point. I don't think I've run into many non-iterable arraylikes, but I understand they used to be more common (e.g., a number of standard things that are now specced as iterable arraylikes used to be just the latter) and there’s probably a lot lurking in library/legacy code.
- TheAceOfHearts 5y agoSomeone already commented that you can use `[...iterable]` to convert any iterable into an array, but if you're doing this just to call forEach on it then it's probably better to use for-of in order to avoid allocating an additional array: for (const item of iterable) { // do forEach stuff here }
- jonplackett 5y agoAnother really good resource with a lot of examples and explanation: https://javascript.info/ https://javascript.info/
- elevenoh 5y agoThis has been a pretty quality reference for me over the years.
- malobre 5y agoThe page HTML is weird, there's no `<html>`, `<head>` or `<body>`.
- butt__hugger 5y agoNone of those are needed for proper HTML; they're implicit.
- randompwd 5y ago> None of those are needed for proper HTML; they're implicit. They are needed for proper HTML. They're just not needed for HTML.
- chrismorgan 5y agoThey are not needed for proper HTML. <html>, <head> and <body> are all defined as having optional start tags and end tags. It’s perfectly valid and reasonable to skip their start tags if you’re not putting any attributes on them. (I always skip <head> and <body>, but never skip <html> because I always have a lang attribute on it, and sometimes more, such as a class attribute. But I definitely still skip its end tag.) There’s plenty of precedent for habitually skipping start tags in the HTML syntax. Few people write <tbody> if they are doing a simple table with no <thead>, because <tbody>’s start and end tags are both optional. <html>, <head> and <body> are the same. (I’m spelling out “in the HTML syntax” here, because if you’re using the XML syntax—not common, but not unknown—no start or end tags are optional; if you write <table><tr>…</tr></table> in an XML syntax HTML document, you will get an invalid HTML document that lacks the <tbody> element.)
- deleted 5y ago[deleted]
- bronlund 5y agoThat whole Node thing was a huge mistake and people are starting realize it. Using JavaScript on the server is bad for so many reasons and the complexity Node introduces for doing the simplest of things, is just just mind-boggling. For the future, I'm betting om Elixir with Phoenix LiveView, pushing server-side rendered HTML through WebSockets.
- amerine 5y agoHey Sandro, it’s been a long time! Excellent post!
- sandrot 5y agoThank you, Mark! Super long time.
- tomcam 5y agoFantastic! I admit I want the same article for C. I am like a walking C89 standard but after that...
- vmception 5y ago> The async/await keywords are here to save you from callback hell but does it?
- stevula 5y agoAbsolutely, unless you’re using node or library functions that require callbacks. Even then there is usually a non-callback-based alternative or you can wrap in a promise to use async/await.
- lukicdarkoo 5y agoProfessionally, I do embedded and robotics, but once a year I find an excuse to create a simple web application (to stay updated). Every time, I get impressed by power and simplicity of the web technologies in general. In JavaScript those are things mentioned in the article + WebComponents. For CSS those are flexboxes, grids, and animations. In my opinion, React made a revolution with hooks and contexts. I love the direction in which the web world has been going!
- fukmbas 5y agoWeb tech is shit
- antris 5y ago>In my opinion, React made a revolution with hooks and contexts I agree with your overall point 100%, but to be honest nothing in React was / is innovative except for the virtual DOM diffing, but even that is becoming increasingly irrelevant as apps are moving towards more and more reactive architecture. React made a huge impact on web dev and deservingly so, but all of the other ideas have been implemented and used on the web before. Of course it's great that React is bringing some of these good ideas to mainstream, but they've been there way before they have been distributed along with a VDOM algo.
- warent 5y ago> but all of the other ideas have been implemented and used on the web before. Is this true? I've worked in web dev for like 6 yrs now and React has provided a significant number of concepts and technologies I'd never seen before and still dont see elsewhere. For example, JSX. Yes, it originated in php but React was its first time being implemented in the frontend. Also the concept of hooks and functional components. The fact that you explicitly define side-effects in the render of a function, with memoization or execution dependent on arbitrary state, is a new invention as far as I'm concerned.
- antris 5y agoYes, yes and yes. All of these concepts are variations of what has been done before in a number of ways. Mostly by "FP academics" who "live in fantasy land", until everyone else starts using them too. Transpiling, hooks and components have all been done (and done better) before React came along, but often they were laughed out as esoteric toys that have nothing to with "real programming". It's just hard to teach these concepts until you actually use them, and it's hard to get people to use these concepts unless they are included in something else that you need. The same happened early with React, both JSX and VDOM were laughed at by many developers because "they looked stupid" to people who didn't understand them and were used to one way of doing things. MVC+jQuery+templates was the flavour of the day. Same thing with TypeScript, FRP and so on. Most likely, whatever concept is gaining momentum today, it's an exact or approximate copy, or in rare cases a novel remix of what has been researched 10-20 years ago, and used in production for 5 years before you heard about it on HN These people who like to apply category theory etc. in programming have heard this mocking of their work as stupid esoteric fantasy (and then seeing them become mainstream later) so often that they literally called one of their specs "Fantasy Land" https://github.com/fantasyland/fantasy-land https://github.com/fantasyland/fantasy-land There's still lot of work to be done. JavaScript doesn't even have proper immutable data structures natively, which would be a REAL low hanging fruit.
- beders 5y agoLooking forward to the next article 10 years from now. Will code written now be incomprehensible then? One thing seems clear: We won't be using webpack, react or any other current tool. I'm not sure how organization can shoulder the costs associated with that kind of churn.
- ertucetin 5y agoClojureScript, that's what you've missed...
- ashdev 5y agoGreat post. Learned something new even though I've been using JavaScript for quite some time now.
- elcapitan 5y agoWebsites without Javascript are what I missed the most of the last 10 years.
- soheil 5y agoIt's nice to see JS improving, honestly all this improvement primarily makes searching for how to do something a lot easier. Now instead of copying and pasting 15 lines to, for example, handle async calls from Stackoverflow you copy three lines. I think learning new methods to do stuff in languages isn't relevant anymore when most web programming involves googling anyway. The only problem is sometimes answers on SO are outdated and even the most voted answer may be giving a suboptimal solution. This is something both Google and SO should have a huge incentive to fix.
- wdb 5y agoGreat resource! Somehow I totally missed the existence of `for await...of`
- semireg 5y agoI love articles like this. I largely transitioned from obj-c/Swift/Kotlin mobile app dev to “modern”JS via Babel/Flow/webpack and now TS. I love it. I love the control of building my own language.
- throwawaygo 5y agoJs optimizes for the wrong thing. Writing code quickly. It's unmaintainable if you walk away from it for a year. Try doing a what you missed in 10 years for go. Lol.
- elevenoh 5y agoFor me, this isn't a matter of JS causing unmaintainability, it's node package manager that causes issues.
- throwawaygo 5y agoDude. 5 different ways to handle asynchrony and zero consensus on which is best. A dynamic type system that contains errors like "null is null or not an object". A number system that consists of entirely of floats. Var let const. hoisting. Classes that are sugar on top of prototypes. Classes intermixed with prototypes. The fact that typescript exists says so much. I think of javascript like perl. It makes things work where you need it but god I don't want to work on a codebase of more than a few files.
- yawaworht1978 5y agoIf someone can explain to me one thing I still do not grasp about react, even though I have done some small websites and apps in react. I understand the virtual Dom concept and only refreshing the necessary DOM components. But how is that much different than an ajax update? I understand ajax causes a request or more, but it only refreshes part of the DOM, right? Or does it cause a full re flow/paint?
- schneidmaster 5y agoAJAX (Asynchronous Javascript and XML) is purely orthogonal to DOM updates. An AJAX request is just a network request initiated asynchronously via some Javascript on the page, as opposed to a request initiated synchronously when a user clicks a link or submits a form. Response data from an AJAX request could be used to make a direct DOM mutation, update React state, log to the console, or anything else the developer wants.
- stevula 5y agoAJAX does not update the DOM at all. You have to write some JS to mutate the DOM based on the response data, which is one of the things React is good at.
- elevenoh 5y agoThis is seriously great. I like JS a lot these days.
- sproketboy 5y agoAnd still no basic types. FAIL.
- cgopalan 5y agoNo thanks. (j/k)
- Decabytes 5y agoI've been dabbling in javascript the past couple of days and since I already know how to program it is has been sooo easy and quick to get up and running. The tooling for web dev also feels better than what I personally have experienced doing things natively. Are there things that I don't like about JavaScript? Sure. For example. The behavior of the "==" operator freaks me out and I would always use "===" instead. But my programming experience helps me evaluate the subset of JavaScript that I need and that won't cause me too much grief in the long run. And while this is changing, there is something really nice about being able to get by in just HTML/CSS and JavaScript. Sure there are different frameworks you have to learn and they change a lot, but I'd take that over having to learn an entirely new programming language just to work on a specific domain any day (I say as I learn an entirely new programming language to work in the web). I am naive to doing any professional web development, but from what I have seen, it seems like having to handle the idiosyncrasies of the four major browsers is a lot less effort than having to handle the 4 major operating systems though I could be wrong.
- jackosdev 5y agoUse Typescript (or a build tool) and PostCSS and you don't have to worry about browsers at all
- phendrenad2 5y agoGreat writeup, these new features are a godsend for JS developers. That said, on some level it's all just lipstick on a pig. I just want a type-safe strongly-typed language in the browser. Maybe Java, Kotlin, Scala, etc. Mark my words: Someone will make a browser where a Java VM is a first- citizen like the JavaScript VM is, and people will start writing apps specifically for that browser.
- da39a3ee 5y agoIs there any chance javascript will get comprehensions (array, set, map, generator)? I know there was a proposal a few years ago that didn't go forwards.
- hajile 5y agoIt seems fairly unlikely to me at this point. Instead, you'll be told to do something like this [...foo.filter(x => x % 2 === 0)] rather than [foo | where x % 2 === 0]
- da39a3ee 5y agoApart from the arguable syntactic attractions, does it not bother people that chained maps/filters traverse the iterable multiple times, whereas comprehensions would give the language a chance to compile a complex comprehension down to a single traversal?
- hajile 5y agoThey need to add iterator versions of the built-ins. At that point, not only this, but a ton of other efficiency issues go away. At present, chaining lodash functions together will integrate once, so I’d recommend using them to save time and memory.
- z5h 5y agoHelpful article. Since I’ve avoided directly coding in JS for a while: So getters and setters add complexity and ambiguity to avoid typing “()”? Did I get that right?
- hajile 5y agoPretty much. I was surprised to see them here though. They shipped in ES5. To put that in perspective, IE9 supported them in 2011. They occasionally have uses, but generally, I think they aren't hyper useful.
- krick 5y agoCool, but as someone who does mainly backend and only rarely tries to do some FE myself (because, come on, you are supposed to be at least somewhat full-stack!), I feel like what I actually missed over the last 10 years is the current consensus on go-to tools/frameworks/libraries, both JS and CSS. Some "best practices 2021" tutorial would be way more valuable to me, but somehow I can never find one.
- earthboundkid 5y ago> Using const implies that the value will not change as the reference is immutable. Use let if the value will change. Lol, I love modern JS, but that’s factually wrong. Const means the variable cannot be reassigned in the same scope. It is 100% mutable though. It “implies” nothing. Indeed, one of the few good uses of const (it’s basically useless most of the time) is Vue’s composition API, where you want to prevent rebinding but actively mutate.
- pikelet 5y agoThe wording around the value 'changing' is a bit ambiguous, but otherwise you're basically agreeing with them: the reference is immutable (not the referenced data).
- devin 5y agoAnyone else most surprised by the inclusion of reduceRight?
- _pdp_ 5y agoJavaScript is such a polarising topic and I wonder why. Browsers are not dropping support anytime soon and the ecosystem is healthier than ever. Just use it for what it is good at. And if you are wondering what that is, it is a great high level programming language that is good at glueing things together. It is obviously not universal. You won’t write operating systems with JavaScript as much as you won’t write web applications with assembler. In both cases you can try if you are mad enough. Great programmers and hackers don’t complain about the language as it is irrelevant. They just use whatever is available to get the job done and get it done well. The more programming languages you know well the more you understand that each has advantages and disadvantages. Part of being a pro is to know what to use under what circumstances. What’s the point of comparing apples to oranges? Finally, you will always need a scripting language with a loose type system even when you start at the low levels. Don’t be so obsessed about type safety, etc. It only shows lack of skills to keep the program model in your head. Gaming engines are scriptable for a reason. It provides different ergonomics that are useful. There are plenty of Rust, Go and Java applications that that replace scripting with ill-conceived configuration templates that resemble scripts except that they are inferior. If you are writing a complex system in Rust, v8 is a modern, expressive scripting runtime that will help you rapidly prototype. That is not say it is better than Lua or Python. It really depends what you want to achieve. But choosing the right scripting language can also drive adoption. So choose wisely!
- jeswin 5y ago> JavaScript is such a polarising topic and I wonder why. If you ask me, the reasons are quite uncomfortable; and has parallels to how a lot of prejudice is seen in society when upward mobility happens. JS now encroaches server-side jobs, while earlier it was relegated to the browser. JS can do scripting. JS can now do native phone apps quite well. It can be used in desktop apps. It also pays well.
- m12k 5y ago> JavaScript is such a polarising topic and I wonder why Probably because it's a gatekeeper language - in order to run code in a browser, you have to use this language[1]. That means a lot of developers that dislike it enough that they would switch to another language if they could, are stuck with it because they need to target the browser. This "captive audience" is effectively forced to engage with the things they dislike on a daily basis - at that point you either develop Stockholm syndrome, or the resentment grows into hatred. Thus the "warts" that JavaScript has (by nature of having been thrown together in a couple weeks originally, and being iteratively turned into a "real" language over the following decades) have a chance to cause much stronger negative feelings than they would if people could just switch to something they liked more. [1] I know, I know, WebAssembly may change this, and there are already niche alternatives like Scala.js, ClojureScript, Blazor and Reason - but for the most part, you still can't effectively run things in a browser without knowing JavaScript, even if just for debugging
- mraza007 5y agoI love how JavaScript has become the lingua Franca of the browser world but there are some things that JavaScript allows the others languages don’t allow.
- MihaiSandor 5y agoDon”t forget about, Template Literal Revision (`\unicode and \u{55}`)
- jokoon 5y agoAs a JS hater, I have to admit it was a pleasant read. I would still love a "20 mistakes you need to avoid when writing JS". One of the most horrible "WHAT IS HAPPENING HERE?" moment in JS was when there was a missing semicolon after some multiline code and error messages were not helping at all. I'm wondering if JS compilers will have some linter or will one day help beginners be warned of "possible mistakes". Isn't there a list of "good practices" or "js coding standards"?
- hnarn 5y ago> a missing semicolon after some multiline code I'm not a JS dev but isn't this something almost any IDE with a linter would help you out with?
- z3t4 5y agoBecause errors dude to missing semicolon will happen so rarely, people skip them for various reasons, but the fix for these errors are to use semicolon, or a tool that will tell you where a semicolon would change the "abstract syntax tree" (AST). Because the JS ecosystem is so diverse, there are many "best practices". And the languages itself has many, many ways to do the same thing, espcially with ES6/2015 onward you have many more options, which are mostly picked by personal preferences and synthetic reasons.
- mostlystatic 5y agoFormatters like Prettier can help here. For example, this code contains a function call, because the first line doesn't end with a semicolon. let a = 123 ({a}= {a: 10}) Prettier will reformat it like this: let a = 123(({ a } = { a: 10 })); You could also use ESLint to enforce semicolons. The error messages when running code like this aren't very good though.
- ntoshev 5y agoGreat resource, I'd missed a few goodies. https://javascript.info https://javascript.info is similarly good in teaching modern Javascript. I wish there was such a resource for modern C++ though. I learned and used C++ in the 90s and early 2000s, and apparently the language has progressed a lot meanwhile. People say idiomatic modern C++ (C++14/17/20) can be pleasant and metaprogramming capabilities are really powerful.
- pmontra 5y ago> in order to use await, you have to be executing a function declared as async I feel like I'm doing the work of the compiler. Why can't it automatically make the function async whenever it sees an await within it?
- hultner 5y agoI see no mention of generators except for a link in the reference list at the end.
- hgs3 5y agoI'm saddened JavaScript adopted "classes" rather than improving support for prototypical inheritance. For a dynamic language, prototypical inheritance exemplifies beauty and simplicity. Unfortunately, JavaScript's execution of prototypes was poor and, given the languages popularity and that it is/was most developers first and only exposure to prototypes, it has left the engineering world with a bad impression.
- deleted 5y ago[deleted]
- SergeAx 5y agoStill all those goodies and sugar coating will be eventually transpiled by Babel to work in MSIE 10.
- hutzlibu 5y ago"Javascript classes are similar to the classes you know and love from other languages. " Are they? Last time I used them (some years ago) they did not came close to Class behavior I know from Java etc. It was still prototype inheritance. Or did I missed something?
- deleted 5y ago[deleted]
- russellbeattie 5y agoRepeat after me: Semicolons are not optional in JavaScript. ASI is an error correction mechanism, not a language feature. You can also do things like not using the var keyword when declaring variables or something like a = 2 < "4"; and it'll work fine. But you don't because they're all errors.
- brachika 5y agoI hated on JS a lot when I was writing.NET until I tried it. After some love-hate moments I really respect the genesis of the language and the use in the modern Web Development.
- fithisux 5y agoIs there something similar for C++?