Xah Web Dev Blog

Why JavaScript is the Suckest Language

JavaScript is truly the suckest language. There's no easy way to test object equality, makes you change algorithms fundamentally.

and JavaScript syntax, is the worst possible. Code written by others is not readable.

why is js syntax unreadable? because

it has function expression, but it does not have the usual function programing languages's design to control it. JS is mostly imperative and prototype OOP, incompatible with function programing. Thus, you have passing function as argument and return function. This feature by itself, if used without fine control, creates incomprehensible code (e.g. y-combinator). (e.g. haskell has types, composition, currying, etc, to control complex function semantics.)

And JavaScript syntax is C/Java-like, provides no syntactic support for function programing. The passing function style becomes unreadable quickly. (e.g. lisp solves syntax problem by almost pure nested parenthesis, and haskell etc provides linear syntax (no parenthesis), and syntax that support semantic features such as currying, lambda, nesting, etc.)

Further, JavaScript design that was trying to emulate Java, created the following entities with exceptionally convoluted semantics.

• JS: “this” Binding
• JS: Property Key "prototype"
• JS: Operator “new”
• JS: “instanceof” Operator
• JS: Property Key "constructor"

See also: JS: Test Equality of Objects

been thinking, to fix the js problem by removing some features, we'd gain a lot by,

1. Ban the keyword function.
2. Ban the keyword this.
3. Ban the keyword new.
4. Ban the use of property key "prototype".
5. Ban the use of property key "constructor".
6. Ban the keyword delete. [see JS: Delete operator]
7. Ban the keyword var.
8. Ban ==.

the spam trend of past 3 years, is people who email you nicely and elaborately, citing your site and ask you to link to them.

Note, you get that only if your site is popular.

See also: Web Spam, Scam, Blackhat SEO Collection

and there's a scum job site plorepbqref (rot13 to see name), somehow they can always tell if you clicked their email spam read in gmail.

what's the technique to see if your spam email has been opened? (no click link) I thought Google gmail blocked all tracking gifs and indirected stuff.

JavaScript sort, is fragile, and most complex, convoluted

http://xahlee.info/javascript_es2016/ECMAScript_2016_Language_Specification.html#sec-array.prototype.sort

today's js: http://xahlee.info/js/js_array_sort.html

in September, i'll be blogging on my patreon account only.

https://www.patreon.com/xahlee

If you like my stuff, i hope you patreon me there.

JavaScript tutorial updates today

the following are updated to ES2015

• JS: Date.UTC
• JS: Function.prototype.apply
• JS: Object.defineProperties
• JS: Object.getOwnPropertyDescriptor
• JS: Object.isFrozen
• JS: Object.isSealed
• JS: Object.prototype.propertyIsEnumerable
• JS: Object.seal
• JS: Array.prototype.pop

if you like it, become my patreon https://www.patreon.com/xahlee

JavaScript tutorial updates https://www.patreon.com/posts/14058806

CSS: Data URI Scheme, Base64 Encoding (minor update)

JS: Object.setPrototypeOf (minor update)

JS: Image Rollover (updated to ES2015)

JavaScript tutorial pages updated to ES2015

The following, are updated to ES2015. Mostly, change var to let or const.

1. JS: Object.freeze
2. JS: Convert String to Number
3. JS: String Constructor
4. JS: Object.freeze
5. JS: Convert String to Number
6. JS: Number.prototype
7. JS: Function.prototype.call
8. JS: Array.isArray
9. JS: RegExp.prototype.test
10. JS: Array.prototype.length
11. JS: Array.prototype.reverse
12. JS: Map.prototype.set
13. JS: Pop-up New Window
14. What's the Difference Between jQuery Selector and DOM querySelectorAll()?
15. DOM: What Does Live Object Mean?
16. JS: Boolean Constructor
17. DOM: Basic DOM Methods
18. JS: Array.prototype.fill
19. JS: Property Descriptor
20. JS: Object.prototype.hasOwnProperty

JS: Falling Snow Effect (updated to ES2015)

JS: String Constructor (minor update)

to my patreon supporters, new article https://www.patreon.com/posts/13809835

JS: Class Tutorial (major update)

JS: Destructuring Assignment (major update)

put in a few bucks in my patreon. https://www.patreon.com/xahlee Thank you.

Google has a new JavaScript style guide, covering es2015, at https://google.github.io/styleguide/jsguide.html

Full Page Screenshot in Browser

Standard Web Fonts (added screenshot for correct illustration)

JS: escape (major rewrite)

JS: String.prototype.charAt (updated)

JS: String Code Unit vs Code Point (minor update)

JS: Convert Character To/From Codepoint (minor update)

JS: String.fromCharCode (minor update)

JS: Function Declaration vs Function Expression (updated for ES2015)

JS: var Name Scope (updated for ES2015)

JS: var/function Order (minor update)

Netflix switched from Java to node.js

[• Making Netflix.com Faster 2015-08-05 By Kristofer Baxter. At https://medium.com/netflix-techblog/making-netflix-com-faster-f95d15f2e972 , Accessed on 2017-07-01 ]

paypal switched from Java to node.js

[• Node.js at PayPal 2013-11-22 By Jeff Harrell. At https://www.paypal-engineering.com/2013/11/22/node-js-at-paypal/ , Accessed on 2017-07-01 ]

Google trying to prevent user downloading brave browser?

Interesting that Microsoft Edge browser haven't picked up. Remain below Google Chrome, Firefox, Safari, Internet Explorer.

• Chrome 63%
• Safari 17%
• Firefox 11%
• IE 3%
• Edge 1%

Firefox Linux bug. “Noto Color Emoji” font are huge

problem is also reported at

• https://www.reddit.com/r/archlinux/comments/67n16o/firefox_emoji_size_problems/
• https://www.reddit.com/r/firefox/comments/685et1/the_last_update_made_my_emojis_huge/

CSS: Multi-Column Layout for Text Flow (updated. Now supported by browsers)

CSS: Round Corners, border-radius (minor update)

CSS: Animation Tutorial (minor update)

CSS Color Spec Separator Now Allow Space

O, the whims of the standard.

https://github.com/w3c/csswg-drafts/commit/a54f8b2089d16eca696690fe7ffc3c11d4db9861

2017-05-12 thanks to xfq.

JS: Random Range Function (added es2015 code)

JS: Randomize Element Children (code updated to ES2015)

JS: Find Window Size (updated)

new CSS unit: vw vh vi vb vmin vmax

there's new CSS unit.

• vw → Equal to 1% of the width of the viewport.
• vh → Equal to 1% of the height of the viewport.
• vi → Equal to 1% of the size of the initial containing block, in the direction of the root element’s inline axis.
• vb → Equal to 1% of the size of the initial containing block, in the direction of the root element’s block axis.
• vmin → Equal to 1% of the minimum value of the height and the width of the viewport.
• vmax → Equal to 1% of the maximum value of the height and the width of the viewport.

The vw and vh are supported by Google Chrome, Firefox, Edge, Safari, latest ones as of 2017-05-06

The vi and vb are not supported by Google Chrome, and probably not others neither.

these are really needed. For example, you want to create a div box, with a specified aspect ratio of say 4/3. (width 4, height 3). You can say

style="width:100vw; height:75vw"

Often, on the side you have columns for index and ads etc. What you really want is percentage of the container box. The solution is the vb unit. Like this:

style="width:100vb; height:75vb"

But vb is not supported by Google Chrome yet.

These are most useful when you are creating SVG graphics, and you want the viewport to be max of a div, with a specified aspect ratio.

[see Practical SVG Tutorial]

See also: JS: Find Window Size

yarn, a new package manager for JavaScript. I recommend it instead of npm. https://code.facebook.com/posts/1840075619545360