স্থানধারক এবং বিকল্পের কোনও অবজেক্ট ব্যবহার করে একটি জাভাস্ক্রিপ্ট স্ট্রিং ফর্ম্যাট করবেন?

Question 1

আমার বলার সাথে একটি স্ট্রিং রয়েছে: My Name is %NAME% and my age is %AGE%.

%XXX%স্থানধারক হয়। আমাদের সেখানে একটি বস্তু থেকে মানগুলি পরিবর্তন করতে হবে।

অবজেক্টটি দেখে মনে হচ্ছে: {"%NAME%":"Mike","%AGE%":"26","%EVENT%":"20"}

আমাকে অবজেক্টটি বিশ্লেষণ করতে হবে এবং স্ট্রিংটিকে সংশ্লিষ্ট মানগুলির সাথে প্রতিস্থাপন করতে হবে। সুতরাং যে চূড়ান্ত আউটপুট হবে:

আমার নাম মাইক এবং আমার বয়স 26 বছর।

পুরো জিনিসটি খাঁটি জাভাস্ক্রিপ্ট বা jquery ব্যবহার করে করতে হবে।

Question 2

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

তবে , যদি আপনাকে কেবল স্ট্রিং ইন্টারপোলেশন করতে হয় তবে আপনি ব্যবহার করতে পারেন:

const str = `My name is ${replacements.name} and my age is ${replacements.age}.`

স্ট্রিংটি সীমিত করে ব্যাকটিকগুলি নোট করুন, সেগুলি প্রয়োজনীয়।

নির্দিষ্ট ওপির প্রয়োজন অনুসারে একটি উত্তরের জন্য, আপনি String.prototype.replace()প্রতিস্থাপনগুলির জন্য ব্যবহার করতে পারেন ।

নিম্নলিখিত কোডটি সমস্ত ম্যাচ পরিচালনা করবে এবং কোনও প্রতিস্থাপন ছাড়াই এগুলি স্পর্শ করবে না (যতক্ষণ না আপনার প্রতিস্থাপনের মানগুলি সমস্ত স্ট্রিং হয়, যদি না হয় তবে নীচে দেখুন)।

var replacements = {"%NAME%":"Mike","%AGE%":"26","%EVENT%":"20"},
    str = 'My Name is %NAME% and my age is %AGE%.';

str = str.replace(/%\w+%/g, function(all) {
   return replacements[all] || all;
});

jsFizz ।

যদি আপনার কিছু প্রতিস্থাপন স্ট্রিং না হয় তবে নিশ্চিত হয়ে নিন যে তারা প্রথমে অবজেক্টে রয়েছে। আপনার যদি উদাহরণের মতো ফর্ম্যাট থাকে, যেমন শতাংশের চিহ্নগুলিতে আবৃত থাকে তবে আপনি এটি inঅর্জন করতে অপারেটরটি ব্যবহার করতে পারেন ।

jsFizz ।

তবে, যদি আপনার ফর্ম্যাটের একটি বিশেষ বিন্যাস না থাকে, যেমন কোনও স্ট্রিং না থাকে এবং আপনার প্রতিস্থাপনের অবজেক্টে nullপ্রোটোটাইপ না থাকে , ব্যবহার করুন Object.prototype.hasOwnProperty(), আপনি যদি গ্যারান্টি দিতে না পারেন তবে আপনার সম্ভাব্য প্রতিস্থাপন সাবস্ট্রিংগুলির কোনওটিই প্রোটোটাইপের সংখ্যার নামের সাথে সংঘর্ষ করবে না।

jsFizz ।

অন্যথায়, যদি আপনার প্রতিস্থাপনের স্ট্রিংটি থাকে 'hasOwnProperty', আপনি একটি ফলাফল বিশৃঙ্খলাযুক্ত স্ট্রিং পাবেন।

jsFizz ।

একটি সাইড নোট হিসাবে, আপনি বলা উচিত replacementsএকটি Object, একটি না Array।

Question 3

ES6 টেম্পলেট আক্ষরিক ব্যবহার সম্পর্কে?

var a = "cat";
var b = "fat";
console.log(`my ${a} is ${b}`); //notice back-ticked string

টেম্পলেট আক্ষরিক সম্পর্কে আরও ...

Question 4

এটিকে সহজে কাজ করতে আপনি JQuery (jquery.uthorate.js) ব্যবহার করতে পারেন।

$.validator.format("My name is {0}, I'm {1} years old",["Bob","23"]);

অথবা আপনি যদি কেবল সেই বৈশিষ্ট্যটি ব্যবহার করতে চান তবে আপনি সেই ফাংশনটি সংজ্ঞায়িত করতে পারেন এবং কেবল এটির মতো ব্যবহার করতে পারেন

function format(source, params) {
    $.each(params,function (i, n) {
        source = source.replace(new RegExp("\\{" + i + "\\}", "g"), n);
    })
    return source;
}
alert(format("{0} is a {1}", ["Michael", "Guy"]));

jquery.uthorate.js টিমকে ক্রেডিট

Question 5

আধুনিক ব্রাউজারের মতো, প্লেসোল্ডার সি স্টাইল ফাংশনের মতো ক্রোম / ফায়ারফক্সের নতুন সংস্করণ দ্বারা সমর্থিত printf()।

স্থানধারক:

%s স্ট্রিং।
%d, %iপূর্ণসংখ্যা নম্বর।
%f ফ্লোটিং পয়েন্ট সংখ্যা.
%o হাইপারলিঙ্ক অবজেক্ট।

যেমন

console.log("generation 0:\t%f, %f, %f", a1a1, a1a2, a2a2);

বিটিডব্লিউ, আউটপুটটি দেখতে:

ক্রোমে শর্টকাট Ctrl + Shift + Jবা F12বিকাশকারী সরঞ্জাম খুলতে ব্যবহার করুন ।
ফায়ারফক্সে, শর্টকাট Ctrl + Shift + Kবা F12বিকাশকারী সরঞ্জাম খুলতে ব্যবহার করুন ।

@ আপডেট - নোডেজ সমর্থন

মনে হচ্ছে নোডেজগুলি সমর্থন করে না %f, পরিবর্তে %dনোডেজগুলিতে ব্যবহার করতে পারে । %dসংখ্যা সহ কেবল পূর্ণসংখ্যার হিসাবে নয়, ভাসমান সংখ্যা হিসাবে মুদ্রিত হবে।

Question 6

শুধু ব্যবহার replace()

var values = {"%NAME%":"Mike","%AGE%":"26","%EVENT%":"20"};
var substitutedString = "My Name is %NAME% and my age is %AGE%.".replace("%NAME%", $values["%NAME%"]).replace("%AGE%", $values["%AGE%"]);

Question 7

আপনি এটির মতো একটি কাস্টম প্রতিস্থাপন ফাংশন ব্যবহার করতে পারেন:

var str = "My Name is %NAME% and my age is %AGE%.";
var replaceData = {"%NAME%":"Mike","%AGE%":"26","%EVENT%":"20"};

function substitute(str, data) {
    var output = str.replace(/%[^%]+%/g, function(match) {
        if (match in data) {
            return(data[match]);
        } else {
            return("");
        }
    });
    return(output);
}

var output = substitute(str, replaceData);

আপনি এটি এখানে কাজ করতে দেখতে পারেন: http://jsfiddle.net/jfriend00/DyCwk/ ।

Question 8

আপনি যদি কনসোল.লগের কাছাকাছি কিছু করতে চান তবে% s স্থানধারীদের প্রতিস্থাপনের মতো

>console.log("Hello %s how are you %s is everything %s?", "Loreto", "today", "allright")
>Hello Loreto how are you today is everything allright?

আমি এটি লিখেছি

function log() {
  var args = Array.prototype.slice.call(arguments);
  var rep= args.slice(1, args.length);
  var i=0;
  var output = args[0].replace(/%s/g, function(match,idx) {
    var subst=rep.slice(i, ++i);
    return( subst );
  });
   return(output);
}
res=log("Hello %s how are you %s is everything %s?", "Loreto", "today", "allright");
document.getElementById("console").innerHTML=res;

<span id="console"/>

স্নিপেট প্রসারিত করুন

তুমি পাবে

>log("Hello %s how are you %s is everything %s?", "Loreto", "today", "allright")
>"Hello Loreto how are you today is everything allright?"

হালনাগাদ

String.prototypeস্ট্রিং ট্রান্সফর্মেশনগুলির সাথে কাজ করার সময় আমি দরকারী হিসাবে একটি সহজ বৈকল্পিক যুক্ত করেছি , এটি এখানে:

String.prototype.log = function() {
    var args = Array.prototype.slice.call(arguments);
    var rep= args.slice(0, args.length);
    var i=0;
    var output = this.replace(/%s|%d|%f|%@/g, function(match,idx) {
      var subst=rep.slice(i, ++i);
      return( subst );
    });
    return output;
   }

সেক্ষেত্রে আপনি করবেন

"Hello %s how are you %s is everything %s?".log("Loreto", "today", "allright")
"Hello Loreto how are you today is everything allright?"

এই সংস্করণটি এখানে চেষ্টা করে দেখুন

Question 9

বর্তমানে জাভাস্ক্রিপ্টে এই আচরণের কোনও দেশীয় সমাধান নেই। ট্যাগযুক্ত টেম্পলেটগুলি সম্পর্কিত কিছু তবে এটি সমাধান করবেন না।

প্রতিস্থাপনের জন্য এখানে একটি অ্যালেক্সের দ্রবণের রিফ্যাক্টর রয়েছে ।

সমাধানটি তীর ফাংশনগুলিতে ( পরিবর্তে ) নেটিভ জাভাস্ক্রিপ্ট ইন্টারপোলেশন হিসাবে স্থানধারীদের জন্য তীর ফাংশন এবং অনুরূপ সিনট্যাক্স ব্যবহার করে । এছাড়াও আছে বিভেদক অন্তর্ভুক্ত করা কোন প্রয়োজন ({}%%% প্রতিস্থাপনের নামে ) ।

দুটি স্বাদ রয়েছে: বর্ণনামূলক এবং হ্রাস।

বর্ণনামূলক সমাধান:

const stringWithPlaceholders = 'My Name is {name} and my age is {age}.';

const replacements = {
  name: 'Mike',
  age: '26',
};

const string = stringWithPlaceholders.replace(
  /{\w+}/g,
  placeholderWithDelimiters => {
    const placeholderWithoutDelimiters = placeholderWithDelimiters.substring(
      1,
      placeholderWithDelimiters.length - 1,
    );
    const stringReplacement = replacements[placeholderWithoutDelimiters] || placeholderWithDelimiters;
    return stringReplacement;
  },
);

console.log(string);

স্নিপেট প্রসারিত করুন

হ্রাস সমাধান:

const stringWithPlaceholders = 'My Name is {name} and my age is {age}.';

const replacements = {
  name: 'Mike',
  age: '26',
};

const string = stringWithPlaceholders.replace(/{\w+}/g, placeholder =>
  replacements[placeholder.substring(1, placeholder.length - 1)] || placeholder,
);

console.log(string);

স্নিপেট প্রসারিত করুন

Question 10

এটি আপনাকে ঠিক তা করতে দেয়

এনপিএম: https://www.npmjs.com/package/stringinject

গিটহাব: https://github.com/tjcafferkey/stringinject

নিম্নলিখিতগুলি করে:

var str = stringInject("My username is {username} on {platform}", { username: "tjcafferkey", platform: "GitHub" });

// My username is tjcafferkey on Git

Question 11

রানটাইম সময়ে গতিশীলভাবে এস 6 টেম্পলেট লিটারাল ব্যবহার করে এটি করার আরেকটি উপায়।

const str = 'My name is ${name} and my age is ${age}.'
const obj = {name:'Simon', age:'33'}


const result = new Function('const {' + Object.keys(obj).join(',') + '} = this.obj;return `' + str + '`').call({obj})

document.body.innerHTML = result

স্নিপেট প্রসারিত করুন

Question 12

দ্রুত উদাহরণ হিসাবে:

var name = 'jack';
var age = 40;
console.log('%s is %d yrs old',name,age);

আউটপুটটি হ'ল:

জ্যাক 40 বছরের পুরানো

Question 13

const stringInject = (str = '', obj = {}) => {
  let newStr = str;
  Object.keys(obj).forEach((key) => {
    let placeHolder = `#${key}#`;
    if(newStr.includes(placeHolder)) {
      newStr = newStr.replace(placeHolder, obj[key] || " ");
    }
  });
  return newStr;
}

Input: stringInject("Hi #name#, How are you?", {name: "Ram"});
Output: "Hi Ram, How are you?"

Question 14

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

এই ফাংশনটি ব্যবহার করুন।

function format() {
    if (arguments.length === 0) {
        throw "No arguments";
    }
    const string = arguments[0];
    const lst = string.split("{}");
    if (lst.length !== arguments.length) {
        throw "Placeholder format mismatched";
    }
    let string2 = "";
    let off = 1;
    for (let i = 0; i < lst.length; i++) {
        if (off < arguments.length) {
            string2 += lst[i] + arguments[off++]
        } else {
            string2 += lst[i]
        }
    }
    return string2;
}

উদাহরণ

format('My Name is {} and my age is {}', 'Mike', 26);

আউটপুট

আমার নাম মাইক এবং আমার বয়স 26 বছর