Optimized way to iterate over the length in js loop?

Saurabh Ranjan — Tue, 07 Jan 2020 11:50:39 +0000

Which code is faster and optimized. Or it doesn't matter if we are not looping over larger data.


 for (var i = 0; i < msg.stackTrace.length; ++i) {
   ...
 }

var stackTraceLength = msg.stackTrace.length;
 for (var i = 0; i < stackTraceLength; ++i) {
  ....
 }

Scarily similar names in javaScript

Saurabh Ranjan — Tue, 08 Oct 2019 08:22:39 +0000

1 substr and substring

String.prototype.substr(…) the method extracts a specified number of characters in a string, from a start index (avoided when possible).

   let str = 'commonSourceOfTruth';
   // str.length : 19

substr MDN takes parameters as (from, ?length).

str.substr(1, 10);  // 'ommonSourc'

substring MDN takes parameters as (start, ?end(exclusive)).

str.substring(1, 10);  // 'ommonSour'

😠 if we start from 0 both behave the same.

str.substr(0, 10);  // 'commonSour'
str.substring(0, 10);  // 'commonSour'

Example : Remove first and last character from a given string ❓

str.substr(1, str.length-2) // ommonSourceOfTrut
str.substring(1, str.length-1) // ommonSourceOfTrut as substring takes indices

💥 Your turn now. Comment your output below.

str.substring(0, 2) // ?
str.substring(2, 0) // ?

2 `array.splice()` and `arr.slice()`

I found an amazing article on these similar methods, and the article covered all the required parts that one should know.So there is no need to write it again 😂

Splice! Slice! Shoot, I meant Shift!

Laurie ・ Jul 30 '19 ・ 4 min read

#webdev #javascript #learning #productivity

My favorite from the above article is:
Example: Remove/add a string and replace/add with the new string ❓

let content = ['post', 'tweet', 'video', 'talk']
content.splice(1, 0, 'dev', 'ten mile')
// content is ['post', 'dev', 'ten mile', 'tweet', 'video', 'talk']

let content = ['post', 'tweet', 'video', 'talk']
content.splice(1, 1, 'dev', 'ten mile')
// content is ["post", "dev", "ten mile", "video", "talk"]

and


let social = ['twitter', 'instagram', 'facebook', 'myspace']
let sliced = social.slice(1,3);
// content is ["instagram", "facebook"]

let social = ['twitter', 'instagram', 'facebook', 'myspace']
let spliced = social.splice(1,3);
// content is  ["instagram", "facebook", "myspace"]

3 `.textContent` and `.innerHTML`

// textContent
<div id="targetNode">This is <span>some </span> text</div>

let targetNodeEl = document.querySelector('#targetNode');
let targetNodeElText = targetNodeEl.textContent;

console.log(targetNodeElText) // This is some  text

textContent is not parsed as HTML.
as it's not parsed XSS can be prevented

// innerHTML
let targetNodeElHtml = targetNodeEl.innerHTML;
console.log(targetNodeElHtml) // This is <span>some </span> text

innerHTML is parsed.
it won't return hidden elements.

DEV Community: Saurabh Ranjan