This article is for understanding old scripts
The information in this article… is useful for understanding old scripts.… But internally var is a very different beast, that originates from very old… It’s generally not used in modern scripts, but still lurks in the old ones.… That’s not something we should use nowadays, but you can find them in old scripts.
New features were added to the language while old functionality didn’t change.… To keep the old code working, most such modifications are off by default.… strict
There is no directive like "no use strict" that reverts the engine to old… If it doesn’t, e.g. in an old browser, there’s an ugly, but reliable way to ensure use strict.… the next chapters, as we learn language features, we’ll see the differences between the strict and old
All insertion methods automatically remove the node from the old place.… Old-school insert/remove methods.… Old school
This information helps to understand old scripts, but not needed… The method comes from times when there was no DOM, no standards… Really old times.… Mostly seen in old scripts.
var instead of let
In older scripts, you may also find another keyword: var instead of let… It also declares a variable but in a slightly different, “old-school” way.… We’ll cover them in detail in the chapter The old "var".… We can’t reuse the old one.… let – is a modern variable declaration.
var – is an old-school variable declaration.
For instance, test if a built-in Promise object exists (it doesn’t in really old browsers):… If there’s none (say, we’re in an old… …But more often is referred by “old-school” environment-specific names, such as window (browser) and
markup.The <script> tag has a few attributes that are rarely used nowadays but can still be found in old… code:
The type attribute: <script type=…>
The old HTML standard, HTML4, required a script to… These comments hide JavaScript code from old browsers that didn’t know how to process the <script&… released in the last 15 years don’t have this issue, this kind of comment can help you identify really old
On the other hand, how to make our modern code work on older engines that don’t understand recent features… It can parse (“read and understand”) modern code and rewrite it using older syntax constructs, so that… Now the rewritten code is suitable for older JavaScript engines.
We need to support old browsers, and don’t want polyfills (e.g. to keep scripts tiny).… status message (a string): usually OK for 200, Not Found for 404, Forbidden for 403 and so on.
response (old… Please note:
In the old… You can find readystatechange listeners in really old… Nowadays, there’s no need to use it, we can replace it with newer events, but it can often be found in older
But in the old times, there was no direct access to it.… objects created by new F will have another object as [[Prototype]], but already existing objects keep the old
In old… And it still works, we can find it in the old code.… All arguments of a function call are also available in “old-style” arguments: array-like iterable object
convenient:
Now what to do with the old… Now the old
The “nodeType” property.The nodeType property provides one more, “old-fashioned… In other words, innerHTML+= does this:
The old… The new innerHTML is written instead (a concatenation of the old and the new one).… But, as we can see in line (**), the value of the old div variable hasn’t changed!… Another piece of HTML <p>A new element</p> was inserted in its place.
div still has its old
Without "use strict", everything still works, but some features behave in the old-fashioned… Variables.Can be declared using:
let
const (constant, can’t be changed)
var (old-style, will see later
We don’t have to use XML though: the term comes from old times, that’s why that word is there.… It’s not supported by old browsers (can be polyfilled), but very well supported among the modern ones
Will the function get newer values or the old ones?… The old var has some notable differences, they will be covered in the article The old "var"… strict, an assignment to a non-existing variable creates a new global variable, for compatibility with old
There are still services that provide such access, as it works even for very old browsers.… So, even a very old server should be ready to accept a safe request.… So an old server may assume that such requests come from a privileged source, “because a webpage is unable… So, to avoid misunderstandings, any “unsafe” request – that couldn’t be done in the old times, the browser
The general algorithm of the engine:
While there are tasks:
execute them, starting with the oldest… event loop algorithm (though still simplified compared to the specification):
Dequeue and run the oldest… Execute all microtasks:
While the microtask queue is not empty:
Dequeue and run the oldest microtask
So here we cover them mainly for completeness, while you can still find them in the old scripts.… querySelector and querySelectorAll, but getElement(s)By* can be sporadically helpful or found in the old
So the code is old, but his database is new.… Use proper HTTP caching headers to avoid loading the old code, so that you’ll never have such problems… We should listen for it and close the old database connection (and probably suggest a page reload, to… If we don’t listen for the versionchange event and don’t close the old connection, then the second, new… Then, in upgradeneeded we can compare versions (e.g. old 2, now 4) and run per-version upgrades step
Some of the optimizations:
Generational collection – objects are split into two sets: “new ones” and “old… Those that survive for long enough, become “old” and are examined less often.
The outdated event.which
Old code may use event.which property that’s an old non-standard
to observe node.data (text content),
Few other options:
attributeOldValue – if true, pass both the old… otherwise only the new one (needs attributes option),
characterDataOldValue – if true, pass both the old
Old-school defences (weak).The oldest defence is a bit of JavaScript which forbids opening the page in
Now these all slowly became a part of history, but we still can find them in old scripts.… Compatibility, “nomodule”.Old browsers do not understand type="module".… Modern, bleeding-edge JavaScript syntax may be transformed to older one with similar functionality using
Old browsers may need polyfills.
Let’s say we want the last element of the array.… Loops.One of the oldest ways to cycle array items is the for loop over indexes:… To loop over the elements of the array:
for (let i=0; i<arr.length; i++) – works fastest, old-browser-compatible
Old browsers may need polyfills.
Old proxy servers do not know about WebSocket, they may see “strange” headers and abort the connection… Old servers are unable to handle WebSocket anyway, so there are no compatibility issues.
There’s a drawback:
samesite is ignored (not supported) by very old browsers, the year 2017 or so.… So if we solely rely on samesite to provide protection, then old browsers will be vulnerable.… other protection measures, like xsrf tokens, to add a layer of defence and then, in the future, when old
Default parameters in old JavaScript code
Several years ago, JavaScript didn’t support the… Nowadays, we can come across them in old scripts.
minor issue: if we access an element, and then change its name, then it is still available under the old
The prefix form returns the new value while the postfix form returns the old value (prior to increment… In the line (*), the postfix form counter++ also increments counter but returns the old
\t
Tab
\b, \f, \v
Backspace, Form Feed, Vertical Tab – mentioned for completeness, coming from old… The usual workaround is to create a whole new string and assign it to str instead of the old
Encoding strings.In old times, before URL objects appeared, people used strings for URLs.
Old browsers may need a polyfill
Class fields are a recent addition to the language.
For document scroll, document.documentElement.scrollLeft/scrollTop works in most browsers, except older
Old browsers may need polyfills.
The optional chaining ?.
addEventListener, not document.on<event>, because the latter will cause conflicts: new handlers overwrite old
It’s the oldest way to create objects with a given prototype.
triggers, with properties:
key – the key that was changed (null if .clear() is called).
oldValue – the old
After it ends, the old execution context is retrieved from the stack, and the outer function is resumed… at line 5 }
pow(2, 2)
Context: { x: 2, n: 3, at line 5 }
pow(2, 3)
There are 2 old
Which one to choose is an old holy war. Spaces are more common nowadays.
…But in the process of development, new properties are added, old
It’s not supported by some older browsers (IE, use Babel to polyfill it), but works in modern ones.
matchAll is a new method, polyfill may be needed
The method matchAll is not supported in old
They provide an alternative “old-style” way to implement the conversion.
So right now old browsers still may show it as a message, but aside of that – there’s no way to customize
Only first 50 results are shown.