QNimate

  • CoursesVideos
  • WP PremiumPlugins
  • DemosLab
  • Home
  • QIdea
  • QTrack
Home Carbon Ads Python like Multiline Strings In JavaScript

Python like Multiline Strings In JavaScript

This post is a part 6 of ECMAScript 6 Complete Tutorial post series.

One of the most loved python language features is multiline strings. In JavaScript there is actually no support for multiline strings. But by doing some tricks we can get this feature. In this post I will show you three different ways to get this feature in JavaScript.


What is Python Multiline Strings

Python multiline string(or block string) is a string which is spread over multiple lines and also new line characters are preserved. A python multiline string looks like this:

Multiline string In JavaScript

There are basically two native methods and one hacked method.

Method 1
Using the “\” character. Actually “\” character allows us to spread the string over multiple lines but it doesn’t preserve new line characters. Therefore if you are using this method then remember to put new line characters manually. So we can say “\” allows us to create line concatenated string.
JS Bin

Method 2
We can use ECMAScript 6 Template String to achieve the same type of multiline string as python.
JS Bin
Many browsers don’t yet support ECMAScript 6 therefore the above example may not work.
ECMAScript 6 template string also support string substitution feature as shown in the above example.

Method 3
This is basically a hacked way of getting this feature. This method converts JavaScript comments into multiline string preserving the new line characters.

Let’s see an example of this:
JS Bin

You can also achieve string substitution using more advanced regular expression functionality.

This is my favorite method and is very compatible. I don’t use this feature from scratch instead I use a library called as JavaScript multiline which provides the same.

One major problem with this method is JS minifiers remove javascript comments. But you can stop them from removing these special comments by this way:

  • Uglify: Use /*@preserve instead of /* and enable the comments option
  • Closure Compiler: Use /*@preserve instead of /*
  • YUI Compressor: Use /*! instead of /*
Aug 7, 2014Narayan Prusty
HTML Table Designing and Best Practices with Examples Pre-rendering In Browser using rel="prerender"
Comments: 2
  1. haochibu
    4 years ago

    I think it is very awesome except for the link to the next post is all wrong!!

    ReplyCancel
  2. web designer nyc
    5 years ago

    I think it is very awesome except for the link to the next post is all wrong!!

    ReplyCancel

Leave a Reply to web designer nyc Cancel reply

To create code blocks or other preformatted text, indent by four spaces:

    This will be displayed in a monospaced font. The first four
    spaces will be stripped off, but all other whitespace
    will be preserved.
    
    Markdown is turned off in code blocks:
     [This is not a link](http://example.com)

To create not a block, but an inline code span, use backticks:

Here is some inline `code`.

For more help see http://daringfireball.net/projects/markdown/syntax

Narayan Prusty

I am a software engineer specialising in Blockchain, DevOps and Go/JavaScript. This is my personal blog where I write about things that I learn and feel interesting to share.

8 years ago 2 Comments Web Development
Share this
0
GooglePlus
0
Facebook
0
Twitter
0
Linkedin
  • What is Python Multiline Strings
  • Multiline string In JavaScript
Related Articles
  • Maintaining Aspect Ratio of iFrame in Responsive Site
  • Displaying And Highlighting Source code in HTML Page
  • JSON.parse() throws “unexpected token” error for valid JSON
  • JavaScript “const” Keyword
  • JavaScript Function Return Multiple Values
Our Sponsor
My Books

2014 - 2015 © QNimate
All tutorials MIT license