JavaScript es6 template literals

-

Template literals are a new syntax to create strings in JavaScript

Embedding expressions in a string is now possible using template literals thus there's a new way to embed expressions into strings effectively interpolating the values done using syntax ${expression}
within a string for instance

const text = 'Hello world'
const string = `Say ${text}` // Say hello world.

You're not only limited to that you can as well perform more advanced expressions and arithmetics as well

const string = `${1 + 2}` // returns 3

strings that spawn more than one line are now possible with template literals initially the only way to create strings that spawn multiple lines was to break it up in parts the syntax below is now possible

const text = `
loading....
processing...`

Comments

Post a Comment

Popular posts from this blog

How to use canvas context rect method for drawing rectangles

-
canvas context rect method does as it says. It's used for drawing a rectangle on a canvas context Parameters context.rect(positionX, positionY, Width, Height) PositionX specifies the x coordinate at which the rectangle should be drawn at on the context PositionY specifies the y coordinate at which the rectangle should be drawn at on the context Width specifies the width of the rectangle Height specifies the height of the rectangle Stroking and filling the rectangle In order for the rectangle to be actually visible you have to either stroke it or fill it with a color. Stroke Stroking a rectangle means to draw a line that joins all of it's vertices To specify the fill color you should set it and call stroke to draw context.strokeStyle = "#colors" context.stroke() Fill Similar to srokings filling a rectangle means to paint it's inner bounding box with a specified color context.fillStyle = "#colors" context.fill() Example context.rect...
Read more

Tar basic commands to store and extract files

-
Targeted is an archiving program designed to package, store, and compress multiple files into a single portable package the name tar is an abbreviation for tape archiver Apart from creating .tar archives tar is also capable of compressing files using zip, bzip2, and gzip compression algorithms Tar flags c — compress directive x — extract directive t — tabulate contents f — specify filename z — use zip/gzip compression j — use bzip2 compression k — do not overwrite t — files from file w — ask for configuration v — verbose gzip flags d — decompress file Tar commandline commands syntax tar -{arguments} {params} Example tar commands tar -cf music.tar music.mp3 Tar archiver will be directed to compress music.mp3 into a tar archive named music.tar and save it in the current working directory tar -xf music.tar Tar will be directed to extract music.tar archive and save the constituent contents of the archive...
Read more

Rest operator in JavaScript

-
Rest operator is similar to spread operator its an es6 feature that allows converting arguments to an array of values; Syntax of spread operator is as follows; function spr(...params) { console.log(params) } spr(1,2,3) // [1, 2, 3] You can use rest operator among other arguments function sprr(args, ...params) { console.log(params) } spr('foo', 1, 2, 3) // [1, 2, 3] More information: Rest parameters MDN
Read more

JavaScript var const and let

-
Signification and let are new JavaScript methods of declaring a variables on modern browser's you don't need to enable strict mode to make use of const, and let What's the difference between var , let and const Immutability when you declare a variable using const its value is immutable ie you can't simply reassign the variable with another value neither can you declare const variables as const variable, another; because it's pointless afterall scope of this let variable decelerations are block scoped therefore if used in an if statement or in a function its value is scoped within that block
Read more

How to use fetch api submit an html form

-
Fetch api allows asynchronous means of reading files and a more simplified way of making http requests in JavaScript. How to submit an existing html form using fetch api; Assuming you have html source code with a form and some input fields; <form id="form" action="./submit" method="post" onsubmit="handle(event)"> <input name="query"> <button>     submit </button> </form> You can pass an instance of a dom form to formData constructor as the first parameter; const handle = function(event) {     event.preventDefault()     const data = new formData(event.target) fetch('//localhost/api/post', {     method: 'POST',     body: data }) } Fetch api returns a new pending promise to process the response you will need to await asynchronous process once ready to consume parse it as follows; .then(response => response.json()) .then(response => console.log(response))
Read more