javascript - জাভাস্ক্রিপ্ট বই pdf




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

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.';

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

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

হালনাগাদ:

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

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

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

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

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

মূল ES5 উত্তর:

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

"foo \
bar"

আপনি 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


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

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

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

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

console.log(hello);

আপনি বিশুদ্ধ জাভাস্ক্রিপ্ট মধ্যে multiline স্ট্রিং থাকতে পারে।

এই পদ্ধতি ফাংশন serialization উপর ভিত্তি করে, যা বাস্তবায়ন-নির্ভরশীল হিসাবে সংজ্ঞায়িত করা হয় । এটি বেশিরভাগ ব্রাউজারে কাজ করে (নিচে দেখুন), তবে ভবিষ্যতে এটি এখনও কাজ করবে বলে কোন গ্যারান্টি নেই, তাই এতে নির্ভর করবেন না।

নিম্নলিখিত ফাংশন ব্যবহার করে:

function hereDoc(f) {
  return f.toString().
      replace(/^[^\/]+\/\*!?/, '').
      replace(/\*\/[^\/]+$/, '');
}

আপনি এখানে এই ধরনের নথি থাকতে পারেন:

var tennysonQuote = hereDoc(function() {/*!
  Theirs not to make reply,
  Theirs not to reason why,
  Theirs but to do and die
*/});

পদ্ধতিটি সফলভাবে নিচের ব্রাউজারগুলিতে পরীক্ষা করা হয়েছে (উল্লেখ নেই = পরীক্ষিত নয়):

  • IE 4 - 10
  • অপেরা 9 .05 - 1২ (9-তে নয়)
  • সাফারি 4-6 (3-তে নয়)
  • ক্রোম 1 - 45
  • ফায়ারফক্স 17 - 21 ( 16-তে নয় )
  • রেকনক 0.7.0 - 0.8.0
  • কনকরার 4.7.4 সমর্থিত নয়

যদিও, আপনার minifier সঙ্গে সতর্কতা অবলম্বন করা। এটা মন্তব্য অপসারণ করতে থাকে। YUI সংকোচকারীর জন্য , /*! দিয়ে শুরু হওয়া একটি মন্তব্য /*! (আমি ব্যবহার করা এক মত) সংরক্ষিত করা হবে।

আমি মনে করি একটি বাস্তব সমাধান CoffeeScript ব্যবহার করা হবে।


আমার এক্সটেনশানটি 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();

আমি এই সিনট্যাক্স এবং indendation পছন্দ করি:

string = 'my long string...\n'
       + 'continue here\n'
       + 'and here.';

(কিন্তু আসলে multiline স্ট্রিং হিসাবে বিবেচনা করা যাবে না)


আমি একটি div আউটপুট করে এটি সমাধান, এটা লুকানো, এবং আমি প্রয়োজন যখন jQuery দ্বারা ডিভ আইডি কলিং।

যেমন

<div id="UniqueID" style="display:none;">
     Strings
     On
     Multiple
     Lines
     Here
</div>

তারপর যখন আমি স্ট্রিং পেতে হবে, আমি শুধু নিম্নলিখিত jQuery ব্যবহার করুন:

$('#UniqueID').html();

যা একাধিক লাইন আমার টেক্সট ফেরত। যদি আমি কল

alert($('#UniqueID').html());

আমি পাই:


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

উদাহরণ:

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


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

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>
  `

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

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

এটি 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>

তুমি এটি করতে পারো...

var string = 'This is\n' +
'a multiline\n' + 
'string';

প্যাটার্ন text = <<"HERE" This Is A Multiline String HERE জেসে পাওয়া যায় না (আমি আমার ভাল পুরানো পার্ল দিনগুলিতে এটি ব্যবহার করে মনে রাখি)।

জটিল বা দীর্ঘ মাল্টিলাইন স্ট্রিংগুলির সাথে তত্ত্বাবধান করতে আমি কখনও কখনও অ্যারে প্যাটার্ন ব্যবহার করি:

var myString = 
   ['<div id="someId">',
    'some content<br />',
    '<a href="#someRef">someRefTxt</a>',
    '</div>'
   ].join('\n');

বা প্যাটার্ন বেনামী ইতিমধ্যে দেখানো হয়েছে (নতুন রেখাচিত্রমালা), যা আপনার কোডের একটি কুৎসিত ব্লক হতে পারে:

    var myString = 
       '<div id="someId"> \
some content<br /> \
<a href="#someRef">someRefTxt</a> \
</div>';

এখানে অন্য অদ্ভুত কিন্তু কাজ 'কৌশল' 1 :

var myString = (function () {/*
   <div id="someId">
     some content<br />
     <a href="#someRef">someRefTxt</a>
    </div>        
*/}).toString().match(/[^]*\/\*([^]*)\*\/\}$/)[1];

বাহ্যিক সম্পাদনা: jsfiddle

ES20xx টেমপ্লেট স্ট্রিং ব্যবহার করে একাধিক লাইনের উপর স্ট্রিং স্প্যানিং সমর্থন করে:

let str = `This is a text
    with multiple lines.
    Escapes are interpreted,
    \n is a newline.`;
let str = String.raw`This is a text
    with multiple lines.
    Escapes are not interpreted,
    \n is not a newline.`;

1 দ্রষ্টব্য: আপনার কোড minifying / obfuscating পরে এটি হারিয়ে যাবে


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

  • একটি 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>

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

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 টিরও বেশি আইটেমের উপরে বাড়বে না - আমি বড় অ্যারের জন্য সূচিবদ্ধ যোগের পক্ষে এটি এড়াতে পারি।


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'));

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

<!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.

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

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

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

উদাহরণ:

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

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

my age is: ${age}
`;

console.log(multilineString);

সামঞ্জস্য

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

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






heredoc