javascript জাভাস্ক্রিপ্ট মধ্যে multiline স্ট্রিং তৈরি




জাভাস্ক্রিপ্ট বই pdf (24)

আমি Ruby নিম্নলিখিত কোড আছে। আমি এই কোডটি জাভাস্ক্রিপ্টে রূপান্তর করতে চাই। জেএস সমান কোড কি?

text = <<"HERE"
This
Is
A
Multiline
String
HERE

ES6 আপডেট:

প্রথম উত্তরটি ইএস 6 / বাবেল দিয়ে উল্লেখ করা হয়েছে, আপনি এখন ব্যাকটিক্স ব্যবহার করে কেবল মাল্টি লাইন স্ট্রিং তৈরি করতে পারেন:

const htmlString = `Say hello to 
multi-line
strings!`;

Interpolating ভেরিয়েবল একটি জনপ্রিয় নতুন বৈশিষ্ট্য যা ব্যাক-টিক সীমাবদ্ধ স্ট্রিংগুলির সাথে আসে:

const htmlString = `${user.name} liked your post about strings`;

এই শুধু concatenation নিচে transpiles:

user.name + ' liked your post about strings'

মূল ES5 উত্তর:

গুগল এর জাভাস্ক্রিপ্ট স্টাইল গাইড নতুন লাইন থেকে বেরিয়ে যাওয়ার পরিবর্তে স্ট্রিং কনক্যাটেনেশন ব্যবহার করার পরামর্শ দেয়:

এটা করো না:

var myString = 'A rather long string of English text, an error message \
                actually that just keeps going and going -- an error \
                message to make the Energizer bunny blush (right through \
                those Schwarzenegger shades)! Where was I? Oh yes, \
                you\'ve got an error and all the extraneous whitespace is \
                just gravy.  Have a nice day.';

প্রতিটি লাইনের শুরুতে হোয়াইটস্পেসটি কম্পাইল সময়তে সুরক্ষিতভাবে মোছা যাবে না; স্ল্যাশ পরে হোয়াইটস্পেস চতুর ত্রুটি হতে হবে; এবং বেশিরভাগ স্ক্রিপ্ট ইঞ্জিন এটি সমর্থন করে, তবে এটি ECMAScript এর অংশ নয়।

পরিবর্তে স্ট্রিং concatenation ব্যবহার করুন:

var myString = 'A rather long string of English text, an error message ' +
               'actually that just keeps going and going -- an error ' +
               'message to make the Energizer bunny blush (right through ' +
               'those Schwarzenegger shades)! Where was I? Oh yes, ' +
               'you\'ve got an error and all the extraneous whitespace is ' +
               'just gravy.  Have a nice day.';

জাভাস্ক্রিপ্ট সমতুল্য হয়:

var text = `
This
Is
A
Multiline
String
`;

এখানে specification । এই পৃষ্ঠার নীচে ব্রাউজার সমর্থন দেখুন। এখানে কিছু examples


ইন্টারনেট ব্যবহার স্ট্রিং concatenation প্রেমের জন্য অনুগ্রহ করে এবং এই জন্য ES6 সমাধান ব্যবহার না করার জন্য অনুগ্রহ করে।ES6 সমস্ত বোর্ড জুড়ে সমর্থিত নয়, CSS3 এর মত অনেক এবং কিছু ব্রাউজার CSS3 স্লিপে মানিয়ে নিতে ধীর হচ্ছে। সাধারণ প্লেট ব্যবহার করুন 'জাভাস্ক্রিপ্ট, আপনার শেষ ব্যবহারকারীরা আপনাকে ধন্যবাদ হবে।

উদাহরণ:

var str = "This world is neither flat nor round. "+ "Once was lost will be found";


Downvoters : এই কোড শুধুমাত্র তথ্যের জন্য সরবরাহ করা হয়।

এটি ফ্যাক্স 19 এবং ম্যাকের ক্রোম ২4 এ পরীক্ষা করা হয়েছে

DEMO

var new_comment; /*<<<EOF 
    <li class="photobooth-comment">
       <span class="username">
          <a href="#">You</a>
       </span>
       <span class="comment-text">
          $text
       </span>
       <span class="comment-time">
          2d
       </span>
    </li>
EOF*/
// note the script tag here is hardcoded as the FIRST tag 
new_comment=document.currentScript.innerHTML.split("EOF")[1]; 
alert(new_comment.replace('$text','Here goes some text'));

আমার এক্সটেনশানটি https://.com/a/15558082/80404 । এটি একটি ফর্ম /*! any multiline comment */ মন্তব্য মন্তব্য আশা করি /*! any multiline comment */ /*! any multiline comment */ যেখানে প্রতীক! খনির দ্বারা অপসারণ প্রতিরোধ করতে ব্যবহৃত হয় (অন্তত YUI সংকোচকারী জন্য)

Function.prototype.extractComment = function() {
    var startComment = "/*!";
    var endComment = "*/";
    var str = this.toString();

    var start = str.indexOf(startComment);
    var end = str.lastIndexOf(endComment);

    return str.slice(start + startComment.length, -(str.length - end));
};

উদাহরণ:

var tmpl = function() { /*!
 <div class="navbar-collapse collapse">
    <ul class="nav navbar-nav">
    </ul>
 </div>
*/}.extractComment();

যোগ করার জন্য, আমি ব্যবহারকারী জাভাস্ক্রিপ্ট প্রোগ্রামিং (অপেরা 11.01) এখানে তালিকাভুক্ত 2 টি পন্থা চেষ্টা করেছি:

তাই আমি অপেরা ব্যবহারকারী জেএস ব্যবহারকারীদের জন্য কাজ পদ্ধতির সুপারিশ করি। লেখক কি বলছে এর বিপরীতে:

এটা ফায়ারফক্স বা অপেরা কাজ করে না; শুধুমাত্র IE, ক্রোম এবং safari উপর।

এটি অপেরা 11 এ কাজ করে। অন্তত ব্যবহারকারী JS স্ক্রিপ্টগুলিতে। খুব খারাপ আমি ব্যক্তিগত উত্তরগুলিতে মন্তব্য করতে পারছি না বা উত্তরের উত্তর দিতে পারছি না, আমি তা অবিলম্বে করব। যদি সম্ভব হয়, উচ্চ অধিকার সঙ্গে কেউ আমার জন্য এটা করুন।


স্ট্রিং কনট্যাটের জন্য অ্যারের-ভিত্তিক আমার সংস্করণ যোগদান করুন:

var c = []; //c stands for content
c.push("<div id='thisDiv' style='left:10px'></div>");
c.push("<div onclick='showDo(\'something\');'></div>");
$(body).append(c.join('\n'));

এটি আমার জন্য ভাল কাজ করেছে, বিশেষ করে আমি প্রায়ই এইভাবে নির্মিত HTML এ মানগুলি সন্নিবেশ করি। কিন্তু এটা সীমাবদ্ধতা প্রচুর আছে। ইন্ডেন্টেশন চমৎকার হবে। নেস্টেড উদ্ধৃতি চিহ্ন মোকাবেলা করা হচ্ছে সত্যিই চমৎকার হবে না, এবং এটি মাত্রাতিরিক্ততা আমার বিরক্ত।

.Push () অ্যারে যোগ করার সময় অনেক সময় নিতে? এই সম্পর্কিত উত্তর দেখুন:

( জাভাস্ক্রিপ্ট ডেভেলপাররা Array.push () ব্যবহার করেন না কেন?

এই (বিরোধিতা) পরীক্ষার রানগুলির দিকে তাকিয়ে দেখে মনে হচ্ছে .push () স্ট্রিং অ্যারেগুলির জন্য জরিমানা যা 100 টিরও বেশি আইটেমের উপরে বাড়বে না - আমি বড় অ্যারের জন্য সূচিবদ্ধ যোগের পক্ষে এটি এড়াতে পারি।


এই লাইব্রেরিটি এটি সুন্দর করে তোলে:

https://github.com/sindresorhus/multiline

আগে

var str = '' +
'<!doctype html>' +
'<html>' +
'   <body>' +
'       <h1>❤ unicorns</h1>' +
'   </body>' +
'</html>' +
'';

পরে

var str = multiline(function(){/*
<!doctype html>
<html>
    <body>
        <h1>❤ unicorns</h1>
    </body>
</html>
*/});

ES6 আপনাকে একাধিক লাইনে একটি স্ট্রিং নির্দিষ্ট করার জন্য একটি ব্যাক্টিক ব্যবহার করতে দেয়। এটি একটি টেমপ্লেট literal বলা হয়। এটার মত:

var multilineString = `One line of text
    second line of text
    third line of text
    fourth line of text`;

ব্যাকডিক ব্যবহার করে নোডজেএস-এ কাজ করে এবং এটি Chrome, ফায়ারফক্স, এজ, সাফারি এবং অপেরা দ্বারা সমর্থিত।

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals


2015 এর জন্য আপডেট করা হয়েছে : এটি ছয় বছর পরে এখন: বেশিরভাগ লোকেরা একটি মডিউল লোডার ব্যবহার করে এবং প্রতিটি প্রধান মডিউল সিস্টেমগুলিতে টেম্পলেটগুলি লোড করার উপায় রয়েছে। এটি ইনলাইন নয়, তবে মাল্টিলাইন স্ট্রিংয়ের সবচেয়ে সাধারণ প্রকার হল টেমপ্লেট এবং সাধারণভাবে টেমপ্লেটগুলি অবশ্যই JS এর ​​বাইরে রাখা উচিত

requ.js: 'টেক্সট প্রয়োজন'।

Template.html এ একটি মাল্টিলাইন টেমপ্লেট সহ প্রয়োজনীয়.জেএস 'টেক্সট' প্লাগইন ব্যবহার করে

var template = require('text!template.html')

এনপিএম / ব্রাউজারিফাই: 'ব্রফ' মডিউল

ব্রাউজারিফাই টেক্সট ফাইলগুলি লোড করতে একটি 'ব্রফ' মডিউল ব্যবহার করে। এটি আসলে আপনার বিন্যস্ত HTML এ আপনার টেমপ্লেট তৈরি করবে।

var fs = require("fs");
var template = fs.readFileSync(template.html', 'utf8');

সহজ।


আপনি আপনার স্ট্রিংকে সংযোজন করতে += ব্যবহার করতে পারেন, মনে হচ্ছে কেউ উত্তর দেয় না, যা পঠনযোগ্য, এবং আরও পরিষ্কার ... এর মতো কিছু

var hello = 'hello' +
            'world' +
            'blah';

এছাড়াও হিসাবে লেখা যেতে পারে

var hello = 'hello';
    hello += ' world';
    hello += ' blah';

console.log(hello);

শুধু বেনামী উত্তর চেষ্টা করে দেখেছি এখানে একটি ছোট্ট কৌশল আছে, ব্যাকস্ল্যাশের পরে একটি স্থান থাকলে এটি কাজ করে না \
তাই নিম্নোক্ত সমাধান কাজ করে না -

var x = { test:'<?xml version="1.0"?>\ <-- One space here
            <?mso-application progid="Excel.Sheet"?>' 
};

কিন্তু স্থান মুছে ফেলা হয় যখন এটি কাজ করে -

var x = { test:'<?xml version="1.0"?>\<-- No space here now
          <?mso-application progid="Excel.Sheet"?>' 
};

alert(x.test);​

আশা করি এটা সাহায্য করবে !!


আমি এই ওয়ার্কারাউন্ড IE, ক্রোম, ফায়ারফক্স, সাফারি, অপেরা কাজ করা উচিত মনে হয় -

JQuery ব্যবহার করে :

<xmp id="unique_id" style="display:none;">
  Some plain text
  Both type of quotes :  " ' " And  ' " '
  JS Code : alert("Hello World");
  HTML Code : <div class="some_class"></div>
</xmp>
<script>
   alert($('#unique_id').html());
</script>

বিশুদ্ধ জাভাস্ক্রিপ্ট ব্যবহার করে:

<xmp id="unique_id" style="display:none;">
  Some plain text
  Both type of quotes :  " ' " And  ' " '
  JS Code : alert("Hello World");
  HTML Code : <div class="some_class"></div>
</xmp>
<script>
   alert(document.getElementById('unique_id').innerHTML);
</script>

চিয়ার্স !!


আপনি TypeScript (জাভাস্ক্রিপ্ট সুপারসেট) ব্যবহার করতে পারেন, এটি মাল্টিলাইন স্ট্রিংগুলিকে সমর্থন করে এবং ওভারহেড ব্যতীত বিশুদ্ধ জাভাস্ক্রিপ্টে ফিরে যান:

var templates = {
    myString: `this is
a multiline
string` 
}

alert(templates.myString);

আপনি যদি প্লেইন জাভাস্ক্রিপ্টের সাথে একই কাজ করতে চান:

var templates = 
{
 myString: function(){/*
    This is some
    awesome multi-lined
    string using a comment 
    inside a function 
    returned as a string.
    Enjoy the jimmy rigged code.
*/}.toString().slice(14,-3)

}
alert(templates.myString)

উল্লেখ্য যে আইপ্যাড / সাফারি 'functionName.toString()' সমর্থন করে না

আপনার যদি প্রচুর লিগ্যাসি কোড থাকে, তবে আপনি টাইপস্ক্রিপ্টে (ক্লিনআপ উদ্দেশ্যে) প্লেইন জাভাস্ক্রিপ্ট ভেরিয়েন্ট ব্যবহার করতে পারেন:

interface externTemplates
{
    myString:string;
}

declare var templates:externTemplates;

alert(templates.myString)

এবং আপনি সমতল জাভাস্ক্রিপ্ট রূপান্তর থেকে মাল্টিলাইন-স্ট্রিং অবজেক্টটি ব্যবহার করতে পারেন, যেখানে আপনি টেমপ্লেটগুলিকে অন্য কোনও ফাইলে রাখেন (যা আপনি বান্ডলে মার্জ করতে পারেন)।

আপনি টাইপস্ক্রিপ্ট এ চেষ্টা করতে পারেন
TypeScript


এটি IE, Safari, Chrome এবং Firefox এ কাজ করে:

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<div class="crazy_idea" thorn_in_my_side='<table  border="0">
                        <tr>
                            <td ><span class="mlayouttablecellsdynamic">PACKAGE price $65.00</span></td>
                        </tr>
                    </table>'></div>
<script type="text/javascript">
    alert($(".crazy_idea").attr("thorn_in_my_side"));
</script>

যদি আপনি কেবল নোডে চলতে থাকেন তবে আপনি ফাইল থেকে মাল্টি-লাইন স্ট্রিং পড়তে fs মডিউলটি ব্যবহার করতে পারেন:

var diagram;
var fs = require('fs');
fs.readFile( __dirname + '/diagram.txt', function (err, data) {
  if (err) {
    throw err; 
  }
  diagram = data.toString();
});

আপনি পালানো নতুন লাইন ব্যবহার করতে ইচ্ছুক হন, তাহলে তারা সুন্দরভাবে ব্যবহার করা যেতে পারে। এটি একটি পৃষ্ঠার সীমানার সাথে একটি দস্তাবেজের মতো দেখায়


আপনি কনক্যাটেনেশন অপারেটর '+' ব্যবহার করতে হবে।

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <p id="demo"></p>
    <script>
        var str = "This "
                + "\n<br>is "
                + "\n<br>multiline "
                + "\n<br>string.";
        document.getElementById("demo").innerHTML = str;
     </script>
</body>
</html>

\nআপনার উৎস কোড ব্যবহার করে দেখতে হবে -

This 
 <br>is
 <br>multiline
 <br>string.

<br>আপনার ব্রাউজার আউটপুট ব্যবহার করে দেখতে হবে -

This
is
multiline
string.

স্ক্রিপ্ট ট্যাগ ব্যবহার করে:

  • একটি head <script>...</script> আপনার মাল্টিলাইন পাঠ্য head ব্লক যুক্ত করুন;
  • আপনার মাল্টিলাইন পাঠ্যটি যেমন আছে ... (টেক্সট এনকোডিংয়ের জন্য দেখুন: UTF-8, ASCII)

    <script>
    
        // pure javascript
        var text = document.getElementById("mySoapMessage").innerHTML ;
    
        // using JQuery's document ready for safety
        $(document).ready(function() {
    
            var text = $("#mySoapMessage").html(); 
    
        });
    
    </script>
    
    <script id="mySoapMessage" type="text/plain">
    
        <soapenv:Envelope xmlns:soapenv="http://schemas.xmlsoap.org/soap/envelope/" xmlns:typ="...">
           <soapenv:Header/>
           <soapenv:Body>
              <typ:getConvocadosElement>
                 ...
              </typ:getConvocadosElement>
           </soapenv:Body>
        </soapenv:Envelope>
    
        <!-- this comment will be present on your string -->
        //uh-oh, javascript comments...  SOAP request will fail 
    
    
    </script>

হালনাগাদ:

ECMAScript 6 (ES6) একটি নতুন ধরনের আক্ষরিক নামকরণ করে, যেমন টেমপ্লেট লিখন। তাদের মধ্যে অনেকগুলি বৈশিষ্ট্য রয়েছে, অন্যের মধ্যে পরিবর্তনশীল ইন্টারপোলেশন, কিন্তু এই প্রশ্নটির জন্য সবচেয়ে গুরুত্বপূর্ণ, তারা মাল্টিলিন হতে পারে।

একটি টেমপ্লেট আক্ষরিক ব্যাকটিক দ্বারা সীমিত হয়:

var html = `
  <div>
    <span>Some HTML here</span>
  </div>
`;

(দ্রষ্টব্য: আমি স্ট্রিংগুলিতে এইচটিএমএল ব্যবহার করার পক্ষে সমর্থন করছি না)

ব্রাউজার সমর্থন ঠিক আছে , কিন্তু আপনি আরও উপযুক্ত হতে transpilers ব্যবহার করতে পারেন।

মূল ES5 উত্তর:

জাভাস্ক্রিপ্ট একটি এখানে-ডকুমেন্ট সিনট্যাক্স নেই। আপনি আক্ষরিক নতুন লাইন থেকে পালাতে পারেন, যাইহোক, যা কাছাকাছি আসে:

"foo \
bar"

এই অর্জন করার একাধিক উপায় আছে

1. স্ল্যাশ concatenation

  var MultiLine=  '1\
    2\
    3\
    4\
    5\
    6\
    7\
    8\
    9';

2. নিয়মিত concatenation

var MultiLine = '1'
+'2'
+'3'
+'4'
+'5';

3. অ্যারে concatenation যোগ দিন

var MultiLine = [
'1',
'2',
'3',
'4',
'5'
].join('');

কর্মক্ষমতা অনুযায়ী, স্ল্যাশ concatenation (প্রথম এক) দ্রুততম।

কর্মক্ষমতা সংক্রান্ত আরও বিস্তারিত জানার জন্য এই পরীক্ষা ক্ষেত্রে পড়ুন

হালনাগাদ:

ES2015 এর সাথে আমরা তার টেমপ্লেট স্ট্রিং বৈশিষ্ট্যগুলির সুবিধা নিতে পারি। এটির সাথে, আমাদের মাল্টি লাইন স্ট্রিং তৈরির জন্য কেবল ব্যাক-টিক্স ব্যবহার করতে হবে

উদাহরণ:

 `<h1>{{title}}</h1>
  <h2>{{hero.name}} details!</h2>
  <div><label>id: </label>{{hero.id}}</div>
  <div><label>name: </label>{{hero.name}}</div>
  `

আমি একটি মাল্টি রেখাযুক্ত স্ট্রিং এই খুব জিম্মি rigged পদ্ধতি সঙ্গে এসেছিলেন। কোনও ফাংশনটিকে স্ট্রিংয়ে রূপান্তর করার পরেও ফাংশনের ভেতর কোনও মন্তব্য ফেরত পাঠানো হয় যা আপনি মাল্টিলাইন মন্তব্য / ** / ব্যবহার করে আপনার স্ট্রিং হিসাবে মন্তব্যগুলি ব্যবহার করতে পারেন। আপনি শুধু শেষ বন্ধ ছাঁটাই আছে এবং আপনার স্ট্রিং আছে।

var myString = function(){/*
    This is some
    awesome multi-lined
    string using a comment 
    inside a function 
    returned as a string.
    Enjoy the jimmy rigged code.
*/}.toString().slice(14,-3)

alert(myString)

জাভাস্ক্রিপ্টে মাল্টিলাইন স্ট্রিংগুলি তৈরি করার সবচেয়ে সহজ উপায় ব্যাকটিক্স (``) ব্যবহার করে। এটি আপনাকে মাল্টিলাইন স্ট্রিং তৈরি করতে দেয় যার মধ্যে আপনি ভেরিয়েবলগুলি সন্নিবেশ করতে পারেন ${variableName}

উদাহরণ:

let name = 'Willem'; 
let age = 26;

let multilineString = `
my name is: ${name}

my age is: ${age}
`;

console.log(multilineString);

সামঞ্জস্য

  • এটা ES6// //es2015
  • এটি এখন সকল প্রধান ব্রাউজার বিক্রেতাদের দ্বারা সমর্থিত (ইন্টারনেট এক্সপ্লোরার ব্যতীত)

এখানে মজিলা ডক্সে সঠিক সামঞ্জস্য চেক করুন


এছাড়াও লক্ষ্য করুন যে, প্রতিটি লাইনের শেষে ফরোয়ার্ড ব্যাকস্ল্যাশ ব্যবহার করে একাধিক লাইনের স্ট্রিং প্রসারিত করার সময়, অতিরিক্ত ব্যাকস্ল্যাশের পরে অতিরিক্ত অক্ষর (বেশিরভাগ স্থান, ট্যাব এবং মন্তব্যগুলি ভুল করে যোগ করা হয়েছে) অপ্রত্যাশিত চরিত্র ত্রুটি সৃষ্টি করবে, যা আমি খুঁজে পেতে একটি ঘন্টা সময় নিই আউট

var string = "line1\  // comment, space or tabs here raise error
line2";




heredoc