আমি কীভাবে জাভাস্ক্রিপ্টে স্ট্রিং ইন্টারপোলেশন করতে পারি?


533

এই কোডটি বিবেচনা করুন:

var age = 3;

console.log("I'm " + age + " years old!");

স্ট্রিং সংমিশ্রণ ব্যতীত কোনও স্ট্রিংয়ে ভেরিয়েবলের মান sertোকানোর জন্য কি অন্য কোনও উপায় আছে?


7
আপনি কফিস্ক্রিপ্ট চেকআউট করতে পারেন: coffeescript.org
dennismonsewicz

1
অন্যরা যেমন সূচিত করেছে, আপনি যে পদ্ধতিটি ব্যবহার করছেন তা হ'ল এটির সহজতম উপায়। আমি স্ট্রিংগুলির অভ্যন্তরে ভেরিয়েবলগুলি উল্লেখ করতে সক্ষম হতে চাই তবে জাভাস্ক্রিপ্টে আপনাকে কনকেন্টেশন (বা অন্য কোনও কিছু সন্ধান / প্রতিস্থাপনের পদ্ধতি) ব্যবহার করতে হবে। আপনার মতো লোকেরা এবং আমাদের নিজের ভালোর জন্য সম্ভবত পিএইচপি-র সাথে কিছুটা যুক্ত রয়েছি।
লেভ

4
অ্যান্ডস্কোর.জেএস টেমপ্লেট
জাহান

2
কনটেনটেশন কোনও দ্বিধায়িতকরণ নয় এবং ব্যবহারকারী কীভাবে ইন্টারপোলেশন করবেন তা জিজ্ঞাসা করেছিলেন। আমি মনে করি লেব শেষ পর্যন্ত উত্তরটি সরবরাহ করেছে, অর্থ দেশীয় জেএসে এটি করার কোনও উপায় নেই is কেন এটি আসল প্রশ্ন নয় তা আমি বুঝতে পারি না।
gitb

4
যদি আমাকে উত্তর দেওয়ার অনুমতি দেওয়া যেতে পারে, তবে এখন নতুন সমাধানকারীদের জন্য একটি সমাধান শুরু হচ্ছে (2015 এফএফ এবং ক্রোম ইতিমধ্যে সমর্থন করে): developer.mozilla.org/en-US/docs/Web/JavaScript/References/… । যেমন। Show GRAPH of : ${fundCode}-${funcCode} আমাকে পায় Show GRAPH of : AIP001-_sma (স্ট্রিং 1 এর চারপাশে ব্যাকটিক্স ব্যবহার করুন .... এখানে প্রদর্শিত হবে বলে মনে হচ্ছে না)
মার্কোস

উত্তর:


535

ES6 যেহেতু আপনি টেম্পলেট আক্ষরিক ব্যবহার করতে পারেন :

const age = 3
console.log(`I'm ${age} years old!`)

দ্রষ্টব্য উল্লেখ্য ব্যাকটিক এর ব্যবহার: ``


3
আমি ভাবছি কেন তারা এ নিয়ে ব্যাকটিক্স নিয়ে গেলেন, "{{বয়স}" দোলন করার পক্ষে যথেষ্ট হবে না?
হাসি লেমনাদে

5
নিঃসৃত যদি এটি সেভাবে কার্যকর করা হয়, তবে সমস্ত বিদ্যমান কোড যা সেই বিন্যাসে একটি স্ট্রিং প্রিন্ট করে তা ব্যর্থ হবে।
thefourtheye

1
@ জোনাথান আমি একটি অর্থবহ চরিত্র হিসাবে সর্বদা ব্যাকটিক্স পছন্দ করি না। তবে আমি নিশ্চিত নই যে কারণটি সর্বজনীন বা কেবল আমার ভাষার কীবোর্ড-লেআউটের ক্ষেত্রে প্রযোজ্য। ব্যাকটিক একটি বিশেষ ধরণের চরিত্র যা পরবর্তী অক্ষর না হওয়া পর্যন্ত এটি রচিত হওয়ার জন্য অপেক্ষা করে, এটি লেখার জন্য দুটিবার আঘাত করা প্রয়োজন (এবং এই মুহুর্তে তাদের দুটি লিখেছেন)। এটি কারণ "অক্ষর" যেমন কিছু অক্ষর তাদের সাথে যোগাযোগ করে। আমি যদি তাদের সাথে "ইলো" লেখার চেষ্টা করি তবে আমি èlloè পেয়ে যাব `` এটি কিছুটা বিরক্তিকরভাবে অবস্থিত (শিফট + ফরোয়ার্ডটিক, যা অন্যরকম বিশেষ চেহারাযুক্ত চরিত্র), কারণ এটির পরিবর্তে টাইপ করার জন্য শিফ্টের প্রয়োজন হয়।
ফেলিক্স

@ ফেলিক্স এটি এমন একটি ধারণা যা আপনার কীবোর্ড বিন্যাসের সাথে নির্দিষ্ট; আপনি যা বর্ণনা করছেন তাকে "মৃত কী" বলা হয়। তারা নরওয়েজিয়ান কীবোর্ড লেআউটে (আমি যেখান থেকে এসেছি) উপস্থিত রয়েছি, যা আমি সমস্ত প্রোগ্রামিংয়ের জন্য মার্কিন কীবোর্ড বিন্যাসে স্যুইচ করার কারণ part (অন্যান্য অক্ষর রয়েছে - যেমন [এবং] - যা ইউএস কীবোর্ডে আরও সহজ))
আইভিন্দ একলুন্ড

239

TL; ড

প্রযোজ্য হলে ECMAScript 2015 এর টেম্পলেট স্ট্রিং লিটারালগুলি ব্যবহার করুন।

ব্যাখ্যা

এটি করার কোনও প্রত্যক্ষ উপায় নেই, ইসমাএসক্রিপ্ট ৫ টি নির্দিষ্টকরণ অনুসারে, তবে ইসিএমএসক্রিপ্ট-তে টেমপ্লেট স্ট্রিং রয়েছে , যা স্পেসের খসড়া তৈরির সময় আধা-লিটারাল হিসাবেও পরিচিত ছিল । তাদের এইভাবে ব্যবহার করুন:

> var n = 42;
undefined
> `foo${n}bar`
'foo42bar'

আপনি এর মধ্যে কোনও বৈধ জাভাস্ক্রিপ্ট এক্সপ্রেশন ব্যবহার করতে পারেন {}। উদাহরণ স্বরূপ:

> `foo${{name: 'Google'}.name}bar`
'fooGooglebar'
> `foo${1 + 3}bar`
'foo4bar'

অন্য গুরুত্বপূর্ণ বিষয়টি হ'ল, আপনাকে মাল্টি-লাইন স্ট্রিংগুলির বিষয়ে আর চিন্তা করতে হবে না। আপনি এগুলি সহজভাবে লিখতে পারেন

> `foo
...     bar`
'foo\n    bar'

দ্রষ্টব্য: আমি উপরে দেখানো সমস্ত টেম্পলেট স্ট্রিং মূল্যায়নের জন্য io.js v2.4.0 ব্যবহার করেছি। উপরের প্রদর্শিত উদাহরণগুলি পরীক্ষা করতে আপনি সর্বশেষতম ক্রোমও ব্যবহার করতে পারেন।

দ্রষ্টব্য: ES6 স্পেসিফিকেশনগুলি এখন চূড়ান্ত হয়েছে , তবে এখনও সমস্ত বড় ব্রাউজার দ্বারা প্রয়োগ করা হয়নি।
মতে মোজিলা ডেভেলপার নেটওয়ার্ক পৃষ্ঠাগুলি , এই মৌলিক সমর্থন নিম্নলিখিত সংস্করণে শুরু করার জন্য প্রয়োগ করা হবে: ফায়ারফক্স 34, ক্রোম 41, ইন্টারনেট এক্সপ্লোরার 12. আপনি একটি অপেরা, সাফারি বা Internet Explorer ব্যবহারকারী হন এবং এখন এই সম্পর্কে জানতে আগ্রহী হন, তাহলে , এই পরীক্ষার বিছানাটি সবার পক্ষে সমর্থন না পাওয়া পর্যন্ত চারদিকে খেলতে ব্যবহার করা যেতে পারে।


3
আপনি যদি ব্যাবেলজ ব্যবহার করেন তবে এটি ব্যবহারযোগ্য , সুতরাং আপনি এটি আপনার কোডবেসে প্রবর্তন করতে পারেন এবং পরে ব্রাউজারগুলির এটির প্রয়োগের জন্য সহায়তা করার পরে প্রতিস্থাপনের পদক্ষেপটি ফেলে দিতে পারেন।
ivarni

স্ট্যান্ডার্ড স্ট্রিংকে কোনও টেম্পলেট স্ট্রিংকে আক্ষরিক রূপান্তর করার কোনও উপায় আছে কি? উদাহরণস্বরূপ, যদি কারও কাছে যদি একটি অনুবাদ শিরোনামযুক্ত একটি জেসন ফাইল থাকে যা প্রদর্শনের উদ্দেশ্যে তাদের মধ্যে অন্তর্ভুক্ত মানগুলির প্রয়োজন হয়? আমি মনে করি প্রথম সমাধানটি সম্ভবত এই পরিস্থিতির জন্য ভাল কাজ করে তবে আমি সাধারণভাবে নতুন স্ট্রিং টেম্পলেট বাক্য গঠনটিকে পছন্দ করি।
nbering

যেহেতু এটি এখনও জেএস স্ট্রিং অন্তরঙ্গকরণের প্রথম অনুসন্ধান ফলাফলগুলির মধ্যে একটি, তাই এখনই সাধারণ উপলব্ধতার প্রতিফলন ঘটানোর জন্য আপনি এটি আপডেট করতে পারলে দুর্দান্ত হবে। "এটি করার কোনও প্রত্যক্ষ উপায় নেই" সম্ভবত বেশিরভাগ ব্রাউজারের ক্ষেত্রেই সত্য নয়।
ফেলিক্স ডমব্যাক

2
দর্শকদের দুর্বল দৃষ্টিশক্তির জন্য 'চরিত্রটি আলাদা'। আপনার যদি এই কাজ করতে সমস্যা হয় তবে নিশ্চিত হয়ে নিন যে আপনার কবর উদ্ধৃতি, (ওরফে টিল্টেড উদ্ধৃতি, পিছনের উদ্ধৃতি) en.wikedia.org/wiki/Grave_accent ব্যবহার করুন । এটি আপনার কীবোর্ডের উপরে বাম দিকে রয়েছে :)
কুইন্সি

@ কুইনসি নীচে একটি ম্যাক কীবোর্ডের বাম - এটি ব্যাক-টিক নামেও পরিচিত:
আরবি।

192

ডগলাস ক্রকফোর্ডের প্রতিকার প্রতিকার জাভাস্ক্রিপ্ট একটি String.prototype.supplantফাংশন অন্তর্ভুক্ত । এটি সংক্ষিপ্ত, পরিচিত এবং সহজেই ব্যবহারযোগ্য:

String.prototype.supplant = function (o) {
    return this.replace(/{([^{}]*)}/g,
        function (a, b) {
            var r = o[b];
            return typeof r === 'string' || typeof r === 'number' ? r : a;
        }
    );
};

// Usage:
alert("I'm {age} years old!".supplant({ age: 29 }));
alert("The {a} says {n}, {n}, {n}!".supplant({ a: 'cow', n: 'moo' }));

আপনি যদি স্ট্রিংয়ের প্রোটোটাইপ পরিবর্তন করতে না চান, আপনি সর্বদা এটি স্ট্যান্ডেলোন হিসাবে মানিয়ে নিতে পারেন, বা এটিকে অন্য কোনও নেমস্পেসে বা যেকোনো কিছুতে রাখতে পারেন।


102
দ্রষ্টব্য: এটি কেবল সংক্ষেপণের চেয়ে দশগুণ ধীর হবে।
cllpse

36
এবং প্রায় তিনগুণ বেশি কীস্ট্রোক এবং বাইট নিন।
ma11hew28

8
@ রুস্টেরোনাসিড - আপনি কি এই গতি হ্রাস সম্পর্কে কিছু দৃষ্টিভঙ্গি দিতে পারেন? যেমন, 0.01s থেকে 0.1s (গুরুত্বপূর্ণ) বা 0.000000001 থেকে 0.00000001s (অপ্রাসঙ্গিক)?
ক্রিস

16
@ জর্জি: আমার মেশিনে একটি দ্রুত পরীক্ষা 7312 এনএসের জন্য দিয়েছে "গাভী মো, মো, মও বলে!" প্রোকম্প্লাইড ফাংশনের জন্য ক্রোকফোর্ডের পদ্ধতি বনাম 111 এনএস ব্যবহার করে যা উত্তীর্ণ বস্তুর বাইরে চলকগুলি টানতে পারে এবং টেম্পলেট স্ট্রিংয়ের ধ্রুবক অংশগুলির সাথে তাদের সংযুক্ত করে। এটি ছিল ক্রোম 21.
জর্জ

13
বা এটির মতো ব্যবহার করুন:"The {0} says {1}, {1}, {1}!".supplant(['cow', 'moo'])
রবার্ট ম্যাসা

54

সাবধানতার কথা: এমন কোনও টেম্পলেট সিস্টেম এড়িয়ে চলুন যা আপনাকে তার নিজস্ব বিযুক্তকারীদের হাত থেকে বাঁচতে দেয় না। উদাহরণস্বরূপ, এখানে supplant()উল্লিখিত পদ্ধতিটি ব্যবহার করে নিম্নলিখিত আউটপুট দেওয়ার কোনও উপায় থাকবে না ।

"আমার {বয়স} পরিবর্তনশীলটির জন্য আমি 3 বছর বয়সী" "

সাধারণ অন্তরঙ্গকরণ ছোট স্ব-অন্তর্ভুক্ত স্ক্রিপ্টগুলির জন্য কাজ করতে পারে তবে প্রায়শই এই ডিজাইনের ত্রুটিটি আসে যা কোনও গুরুতর ব্যবহারকে সীমাবদ্ধ করে। আমি সত্যই DOM টেম্পলেট পছন্দ করি, যেমন:

<div> I am <span id="age"></span> years old!</div>

এবং jQuery ম্যানিপুলেশন ব্যবহার করুন: $('#age').text(3)

বিকল্পভাবে, আপনি যদি কেবল স্ট্রিং কনটেনটেশন দিয়ে ক্লান্ত হয়ে থাকেন তবে সর্বদা বিকল্প বাক্য গঠন রয়েছে:

var age = 3;
var str = ["I'm only", age, "years old"].join(" ");

4
পার্শ্ব দ্রষ্টব্য: Array.join()প্রত্যক্ষ ( +শৈলী) কনকাটেনেশনের চেয়ে ধীর , কারণ ব্রাউজার ইঞ্জিনগুলি (যার মধ্যে ভি 8 অন্তর্ভুক্ত রয়েছে, যার মধ্যে নোড এবং আজ জেএস চালানো প্রায় সমস্ত কিছুই রয়েছে) এটিকে ব্যাপকভাবে অনুকূলিত করেছে এবং সরাসরি সংক্ষিপ্ততার
পাইলা

1
সাপ্লান্ট পদ্ধতি আপনাকে বর্ণিত স্ট্রিং তৈরি করার অনুমতি দেয়: object টোকেন only কেবল তখনই প্রতিস্থাপন করা হয় যদি ডেটা অবজেক্টটিতে কোনও সদস্য নামে পরিচিত থাকে token- সুতরাং আপনি যদি কোনও ageসদস্যের সাথে থাকা কোনও ডেটা অবজেক্ট সরবরাহ না করেন তবে তা ঠিক থাকবে।
ক্রিস Fewtrell

1
ক্রিস, আমি দেখতে পাচ্ছি না কীভাবে এটি একটি সমাধান। বয়সের পরিবর্তনশীল এবং {বয়স} স্ট্রিং উভয়ই ব্যবহার করতে আমি উদাহরণটি সহজেই আপডেট করতে পারি। আপনি কি টেম্পলেট অনুলিপি পাঠ্যের উপর ভিত্তি করে আপনার ভেরিয়েবলের নাম রাখতে পারেন তা নিয়ে কি সত্যিই উদ্বিগ্ন হতে চান? - এছাড়াও, এই পোস্টটি যেহেতু আমি ডেটা বাঁধাই পাঠাগারগুলির একটি বড় অনুরাগী হয়েছি। র‌্যাকটিভজেএস-এর মতো কিছু আপনাকে পরিবর্তনশীল স্প্যানগুলির সাহায্যে লোড করা ডোম থেকে রক্ষা করবে। এবং গোঁফের বিপরীতে, এটি কেবলমাত্র সেই পৃষ্ঠাটিকেই আপডেট করে।
গ্রেগ.কিন্ডেল

3
আপনার প্রাথমিক উত্তরটি ধরেই মনে হচ্ছে যে এই জাভাস্ক্রিপ্টটি ব্রাউজার পরিবেশে চলছে যদিও এইচটিএমএল দিয়ে প্রশ্ন ট্যাগ করা হয়নি।
ক্যানন

2
আপনার সম্পর্কিত "সতর্কতার শব্দ" supplantঅনিয়ন্ত্রিত: "I am 3 years old thanks to my {age} variable.".supplant({}));প্রদত্ত স্ট্রিংটি হুবহু ফিরিয়ে দেয়। যদি ageদেওয়া হয় তবে এখনও কেউ মুদ্রণ করতে {এবং }ব্যবহার করতে পারে{{age}}
le_m

23

স্প্রিন্টফ গ্রন্থাগারটি চেষ্টা করুন (একটি সম্পূর্ণ ওপেন সোর্স জাভাস্ক্রিপ্ট স্প্রিন্টফ বাস্তবায়ন)। উদাহরণ স্বরূপ:

vsprintf('The first 4 letters of the english alphabet are: %s, %s, %s and %s', ['a', 'b', 'c', 'd']);

ভিএসপ্রিন্টফ আর্গুমেন্টের অ্যারে নেয় এবং একটি ফর্ম্যাট স্ট্রিং দেয়।


21

আপনি যদি বাদাম ফাটানোর জন্য স্লেজহ্যামার ব্যবহার করে সত্যিই মনে করেন তবে আপনি প্রোটোটাইপের টেম্পলেট সিস্টেমটি ব্যবহার করতে পারেন :

var template = new Template("I'm #{age} years old!");
alert(template.evaluate({age: 21}));

প্রোটোটাইপ ব্যবহার করে আপনি সরাসরি ইন্টারপোলেট কল করতে পারেন api.prototypejs.org/language/String/prototype/interplate (অভ্যন্তরীণভাবে এটি টেমপ্লেট ব্যবহার করে)
rvazquezglez

21

আমি এই প্যাটার্নটি অনেকগুলি ভাষায় ব্যবহার করি যখন আমি এখনও এটি সঠিকভাবে কীভাবে করতে হয় তা জানি না এবং কেবল দ্রুত একটি ধারণা পেতে চাই:

// JavaScript
var stringValue = 'Hello, my name is {name}. You {action} my {relation}.'
    .replace(/{name}/g    ,'Indigo Montoya')
    .replace(/{action}/g  ,'killed')
    .replace(/{relation}/g,'father')
    ;

বিশেষভাবে দক্ষ না হলেও, আমি এটি পঠনযোগ্য বলে মনে করি। এটি সর্বদা কার্যকর হয় এবং এটি সর্বদা উপলব্ধ:

' VBScript
dim template = "Hello, my name is {name}. You {action} my {relation}."
dim stringvalue = template
stringValue = replace(stringvalue, "{name}"    ,"Luke Skywalker")     
stringValue = replace(stringvalue, "{relation}","Father")     
stringValue = replace(stringvalue, "{action}"  ,"are")

সর্বদা

* COBOL
INSPECT stringvalue REPLACING FIRST '{name}'     BY 'Grendel'
INSPECT stringvalue REPLACING FIRST '{relation}' BY 'Mother'
INSPECT stringvalue REPLACING FIRST '{action}'   BY 'did unspeakable things to'

12

আপনি template stringইএস 6 ব্যবহার করে সহজেই করতে পারেন এবং ব্যাবেলের মতো কোনও উপলভ্য ট্রান্সপিলার ব্যবহার করে ইএস 5 এ ট্রান্সপেল করতে পারেন।

const age = 3;

console.log(`I'm ${age} years old!`);

http://www.es6fiddle.net/im3c3euc/


6

কিউই চেষ্টা করুন , স্ট্রিং ক্ষেপক জন্য একটি হালকা ওজন জাভাস্ক্রিপ্ট মডিউল।

আপনি করতে পারেন

Kiwi.compose("I'm % years old!", [age]);

অথবা

Kiwi.compose("I'm %{age} years old!", {"age" : age});

6

আপনি যদি console.logআউটপুটটিতে ইন্টারপোলেট করতে চান তবে ঠিক

console.log("Eruption 1: %s", eruption1);
                         ^^

এখানে, %sযাকে "ফর্ম্যাট স্পেসিফায়ার" বলা হয়। console.logঅন্তর্নির্মিত এই ধরণের অন্তরঙ্গ সমর্থন আছে।


1
এটিই একমাত্র সঠিক উত্তর। প্রশ্ন হ'ল টেমপ্লেট স্ট্রিং নয় সংযোগের বিষয়ে ।
সসপেড্রা

5

এখানে এমন একটি সমাধান রয়েছে যার জন্য আপনাকে মানগুলি সরবরাহ করতে হবে। আপনি যদি কোনও বিষয়কে প্যারামিটার হিসাবে সরবরাহ না করেন তবে এটি গ্লোবাল ভেরিয়েবলগুলি ব্যবহার করে ডিফল্ট হবে। তবে প্যারামিটারটি ব্যবহার করার জন্য এটি আরও ভাল clean

String.prototype.interpolate = function(props) {
    return this.replace(/\{(\w+)\}/g, function(match, expr) {
        return (props || window)[expr];
    });
};

// Test:

// Using the parameter (advised approach)
document.getElementById("resultA").innerText = "Eruption 1: {eruption1}".interpolate({ eruption1: 112 });

// Using the global scope
var eruption2 = 116;
document.getElementById("resultB").innerText = "Eruption 2: {eruption2}".interpolate();
<div id="resultA"></div><div id="resultB"></div>


3
ব্যবহার করবেন না eval, evalমন্দ!
chris97ong 13

5
@ chris97ong যদিও এটি "সত্য", কমপক্ষে একটি কারণ দিন ("মন্দ" সাহায্য করে না) বা বিকল্প সমাধান দিন। প্রায় সবসময় ব্যবহারের কাছাকাছি উপায় থাকে evalতবে কখনও কখনও তা হয় না। উদাহরণস্বরূপ, যদি ওপি অনুসন্ধান দৃষ্টিকোণ (যেমন গ্রোভির অন্তরঙ্গকরণ কীভাবে কাজ করে) পাস না করে বর্তমান সুযোগ ব্যবহার করে ইন্টারপোলেটের কোনও উপায় চায় তবে আমি নিশ্চিত evalযে এর প্রয়োজন হবে। কেবল পুরানো "ইওল ইজ অশুভ" অবলম্বন করবেন না।
আয়ান

1
কখনই ইভাল ব্যবহার করবেন না বা কখনও এটি ব্যবহার করার পরামর্শ দিন না
hasen

2
@ হাসেনজ এ কারণেই আমি বলেছিলাম যে এটি "সেরা ধারণা নাও হতে পারে" এবং একটি বিকল্প পদ্ধতি সরবরাহ করেছে। কিন্তু দুর্ভাগ্যক্রমে, evalসুযোগে স্থানীয় ভেরিয়েবলগুলি অ্যাক্সেস করার একমাত্র উপায় । সুতরাং এটিকে কেবল অস্বীকার করবেন না কারণ এটি আপনার অনুভূতিতে আঘাত করে। বিটিডব্লিউ, আমি বিকল্প উপায়টিকেও বেশি পছন্দ করি কারণ এটি নিরাপদ, তবে evalপদ্ধতিটিই ওপি-র প্রশ্নের সুনির্দিষ্টভাবে উত্তর দেয়, সুতরাং এটি উত্তরে রয়েছে।
লুকাস ট্রজেসনিউস্কি

1
সমস্যাটি evalহ'ল এটি অন্য সুযোগ থেকে ভার্স অ্যাক্সেস করতে পারে না, তাই যদি আপনার .interpolateকলটি অন্য কোনও ফাংশনের মধ্যে থাকে এবং বিশ্বব্যাপী না হয় তবে এটি কার্যকর হবে না।
জর্জি

2

গ্রেগ কিন্ডেলের দ্বিতীয় উত্তরটি প্রসারিত করে আপনি কিছু বয়লারপ্লেট দূর করতে একটি ফাংশন লিখতে পারেন:

var fmt = {
    join: function() {
        return Array.prototype.slice.call(arguments).join(' ');
    },
    log: function() {
        console.log(this.join(...arguments));
    }
}

ব্যবহার:

var age = 7;
var years = 5;
var sentence = fmt.join('I am now', age, 'years old!');
fmt.log('In', years, 'years I will be', age + years, 'years old!');

1

আমি আপনাকে একটি উদাহরণ দিয়ে দেখাতে পারি:

function fullName(first, last) {
  let fullName = first + " " + last;
  return fullName;
}

function fullNameStringInterpolation(first, last) {
  let fullName = `${first} ${last}`;
  return fullName;
}

console.log('Old School: ' + fullName('Carlos', 'Gutierrez'));

console.log('New School: ' + fullNameStringInterpolation('Carlos', 'Gutierrez'));


1

ES6 যেহেতু আপনি যদি অবজেক্ট কীগুলিতে স্ট্রিং ইন্টারপোলেশন করতে চান, আপনি SyntaxError: expected property name, got '${'যদি এমন কিছু করেন তবে আপনি একটি পাবেন :

let age = 3
let obj = { `${age}`: 3 }

পরিবর্তে আপনার নিম্নলিখিতটি করা উচিত:

let obj = { [`${age}`]: 3 }

1

@ ক্রিস নিলসনের পোস্টের ES6 সংস্করণটির জন্য আরও সহায়তা করুন ।

String.prototype.supplant = function (o) {
  return this.replace(/\${([^\${}]*)}/g,
    (a, b) => {
      var r = o[b];
      return typeof r === 'string' || typeof r === 'number' ? r : a;
    }
  );
};

string = "How now ${color} cow? {${greeting}}, ${greeting}, moo says the ${color} cow.";

string.supplant({color: "brown", greeting: "moo"});
=> "How now brown cow? {moo}, moo, moo says the brown cow."

0

পুরানো ব্রাউজারগুলিতে টেমপ্লেট সিনট্যাক্স ব্যবহার ব্যর্থ হয়, গুরুত্বপূর্ণ যদি আপনি জনসাধারণের ব্যবহারের জন্য এইচটিএমএল তৈরি করেন। সংক্ষিপ্তকরণটি ব্যবহার করা ক্লান্তিকর এবং কঠোর, বিশেষত আপনার অনেক বা দীর্ঘ এক্সপ্রেশন থাকলে বা সংখ্যা এবং স্ট্রিং আইটেমগুলির মিশ্রণগুলি হ্যান্ডেল করার জন্য আপনাকে প্রথম বন্ধনী ব্যবহার করতে হবে (উভয়ই + অপারেটর ব্যবহার করে)।

পিএইচপি খুব কমপ্যাক্ট স্বরলিপি ব্যবহার করে ভেরিয়েবল এবং এমনকী কিছু এক্সপ্রেশনযুক্ত কোটযুক্ত স্ট্রিংগুলি প্রসারিত করে: $a="the color is $color";

জাভাস্ক্রিপ্টে, এটি সমর্থন করার জন্য একটি দক্ষ ফাংশন লেখা যেতে পারে: var a=S('the color is ',color); একটি চলক সংখ্যক আর্গুমেন্ট ব্যবহার করে। এই উদাহরণে মনগড়া নিয়ে কোনও লাভ নেই, যখন প্রকাশগুলি দীর্ঘায়িত হয় তখন এই বাক্য গঠনটি আরও পরিষ্কার হতে পারে। বা পিএইচপি হিসাবে যেমন একটি জাভাস্ক্রিপ্ট ফাংশন ব্যবহার করে কোনও এক্সপ্রেশন শুরু করার সিগন্যাল করতে ডলার চিহ্ন ব্যবহার করতে পারেন।

অন্যদিকে, পুরানো ব্রাউজারগুলির জন্য টেমপ্লেটের মতো স্ট্রিংয়ের প্রসারণ সরবরাহ করার জন্য একটি কার্যকরী কর্মফল রচনা লিখতে অসুবিধা হবে না। কেউ সম্ভবত এটি ইতিমধ্যে সম্পন্ন করেছেন।

পরিশেষে, আমি কল্পনা করি যে স্প্রিন্টফ (যেমন সি, সি ++, এবং পিএইচপি হিসাবে) জাভাস্ক্রিপ্টে লেখা যেতে পারে, যদিও এই অন্যান্য সমাধানগুলির তুলনায় এটি কিছুটা কম দক্ষ হবে।


0

কাস্টম নমনীয় দমন:

var sourceElm = document.querySelector('input')

// interpolation callback
const onInterpolate = s => `<mark>${s}</mark>`

// listen to "input" event
sourceElm.addEventListener('input', parseInput) 

// parse on window load
parseInput() 

// input element parser
function parseInput(){
  var html = interpolate(sourceElm.value, undefined, onInterpolate)
  sourceElm.nextElementSibling.innerHTML = html;
}

// the actual interpolation 
function interpolate(str, interpolator = ["{{", "}}"], cb){
  // split by "start" pattern
  return str.split(interpolator[0]).map((s1, i) => {
    // first item can be safely ignored
	  if( i == 0 ) return s1;
    // for each splited part, split again by "end" pattern 
    const s2 = s1.split(interpolator[1]);

    // is there's no "closing" match to this part, rebuild it
    if( s1 == s2[0]) return interpolator[0] + s2[0]
    // if this split's result as multiple items' array, it means the first item is between the patterns
    if( s2.length > 1 ){
        s2[0] = s2[0] 
          ? cb(s2[0]) // replace the array item with whatever
          : interpolator.join('') // nothing was between the interpolation pattern
    }

    return s2.join('') // merge splited array (part2)
  }).join('') // merge everything 
}
input{ 
  padding:5px; 
  width: 100%; 
  box-sizing: border-box;
  margin-bottom: 20px;
}

*{
  font: 14px Arial;
  padding:5px;
}
<input value="Everything between {{}} is {{processed}}" />
<div></div>


0

আপনার বর্ণনার ক্ষেত্রে টেমপ্লেটগুলি সম্ভবত সেরা, আপনি যদি নিজের ডেটা এবং / বা আর্গুমেন্ট / অ্যারে আকারে যুক্তি চান বা ব্যবহার করতে পারেন তবে আপনি ব্যবহার করতে পারেন String.raw

String.raw({
  raw: ["I'm ", " years old!"]
}, 3);

অ্যারে হিসাবে ডেটা সহ, কেউ স্প্রেড অপারেটরটি ব্যবহার করতে পারে:

const args = [3, 'yesterday'];
String.raw({
  raw: ["I'm ", " years old as of ", ""]
}, ...args);

0

আমি যা খুঁজছিলাম তা খুঁজে পেলাম না, তবে এটি পেয়ে গেল -

আপনি যদি নোড.জেএস ব্যবহার করে থাকেন তবে এমন utilএকটি ফর্ম্যাট ফাংশন সহ একটি অন্তর্নির্মিত প্যাকেজ রয়েছে যা এটির মতো কাজ করে:

util.format("Hello my name is %s", "Brent");
> Hello my name is Brent

কাকতালীয়ভাবে এটি এখন console.logনোড.জেএস-তেও স্বাদে নির্মিত -

console.log("This really bad error happened: %s", "ReferenceError");
> This really bad error happened: ReferenceError
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.