হাইফেনকে উটের ক্ষেত্রে রূপান্তর করুন (উট কেস)


146

রেজেক্স (আমি ধরে নিই) বা অন্য কোনও পদ্ধতির সাহায্যে আমি কীভাবে জিনিসগুলিতে রূপান্তর করতে পারি:

marker-imageবা my-example-settingকরতে markerImageবা myExampleSetting

আমি তখনই বিভক্ত হওয়ার কথা ভাবছিলাম -hyp হাইপেন +1 এর সূচকটিকে বড় হাতের মধ্যে রূপান্তর করুন। তবে এটি বেশ নোংরা বলে মনে হচ্ছে এবং রেগেক্সের সাথে এমন কিছু সহায়তার প্রত্যাশা করেছিল যা কোড ক্লিনার করে তুলবে।

কোন jQuery নেই ...



7
এটি আসলে, তবে আমি অনুসন্ধান করেছি এবং এটি সম্ভবত অস্পষ্ট নামের কারণে খুঁজে পাইনি। আইডি এটিকে উন্মুক্ত রাখার পরামর্শ দেয় যাতে লোকেরা আসলে উত্তরটি খুঁজে পেতে পারে। "বড় হাতের জন্য $ 1 রেজিপ্যাক্স করুন" ... তারা ইতিমধ্যে রেগেক্স আইএমও না জানলে কেউ এটি খুঁজে পাবে না
অস্কার গডসন

এটি সহজেই স্থিরযোগ্য ছিল। আমি সবেমাত্র শিরোনামটি সম্পাদনা করেছি
এমপি্লুঞ্জন

সুতরাং সমাধানগুলির একটি কাটা এবং পেস্ট আমাকে একটি গ্রহণযোগ্য উত্তর অর্জন করতে পারত: |
এমপ্লুঞ্জন

ঠিক বিপরীত করার কোন উপায় আছে?
পাভান

উত্তর:


258

এটা চেষ্টা কর:

var camelCased = myString.replace(/-([a-z])/g, function (g) { return g[1].toUpperCase(); });

রেগুলার এক্সপ্রেশন ম্যাচ হবে -iমধ্যে marker-imageএবং ক্যাপচার শুধুমাত্র i। এরপরে এটি কলব্যাক ফাংশনে বড় আকারের এবং প্রতিস্থাপন করা হয়।


53
এফওয়াইআই, এখানে বিপরীত:myString.replace(/([a-z][A-Z])/g, function (g) { return g[0] + '-' + g[1].toLowerCase() });
সিরিল এন।

আমি মনে করি যে প্যারামিটারটির নাম "মি", "ম্যাচ" এর মতো করা উচিত। আমরা আশা করি আপনি দ্রুত লেখার কিছু: myString.replace(/-([a-z])/i, function (i) { return i[1].toUpperCase() });
programaths

8
iপতাকা যুক্ত করে আপনার রেজেক্সকে আরও শক্তিশালী করা ভাল ধারণা হবে । এটি ছাড়া আপনার প্যাটার্নটি "মূলধনযুক্ত অংশগুলি" মিস করে ("মূলধনযুক্ত অংশগুলিতে পরিবর্তিত হবে না)"। এছাড়াও, আমি ব্যক্তিগতভাবে একাধিক পরামিতিগুলির উন্নত পাঠযোগ্যতা পছন্দ করি তবে এটি অবশ্যই শৈলীর বিষয়। সব মিলিয়ে আমি সাথে যাব .replace( /-([a-z])/gi, function ( $0, $1 ) { return $1.toUpperCase(); } );
হ্যাশচেঞ্জ

এটি যুক্ত করার জন্য, আপনি যদি উটের ক্ষেত্রেও পৃথক শব্দের সাথে শব্দগুলি ব্যবহার করতে চান তবে var camelCased = myString.replace(/(-+|\s+)\w/g, function (g) { return g[1].toUpperCase(); });
নীচেরগুলি

@ ওল্ফ্রাম 77,, আপনি একাধিক ড্যাশ / স্পেস অক্ষরগুলিকে রেজিপেক্সে অন্তর্ভুক্ত করবেন, তারপরে ম্যাচের দ্বিতীয় অক্ষরকে বড় হাতের অক্ষরে রাখবেন, অর্থাত্ যদি দ্বিতীয় অক্ষরটি একটি স্থান বা ড্যাশ হয় তবে এটি হ'ল বড় হ'ল। এই সম্পর্কে var camelCased = myString.replace(/(-+|\s+)\w/g, function (g) { return g[g.length - 1].toUpperCase(); });:?
ট্রাইসিস

44

আপনি যদি আলোকিত হন এবং আপনার প্রকল্পে এটি অন্তর্ভুক্ত করেন তবে লোডাশ যে একটি দুর্দান্ত উপযোগ দেয় সেগুলির মধ্যে একটি এটি।

var str = 'my-hyphen-string';
str = _.camelCase(str);
// results in 'myHyphenString'

14

আপনি হাইপেন এবং পরবর্তী অক্ষর পেতে পারেন এবং অক্ষরের বড় অক্ষর দিয়ে প্রতিস্থাপন করতে পারেন:

var str="marker-image-test";
str.replace(/-([a-z])/g, function (m, w) {
    return w.toUpperCase();
});

3
ভাল - আমি এই পদ্ধতিটি দিয়ে গিয়েছিলাম তবে ES6 এ এটি >> স্ট্রিংরেপ্লেস (/ - ([এজেড]) / জি, (এক্স, আপ) => আপ.টোয়ার কেস ())
কনরলুডি

13

এখানে আমার উট কেস ফাংশনের সংস্করণ রয়েছে:

var camelCase = (function () {
    var DEFAULT_REGEX = /[-_]+(.)?/g;

    function toUpper(match, group1) {
        return group1 ? group1.toUpperCase() : '';
    }
    return function (str, delimiters) {
        return str.replace(delimiters ? new RegExp('[' + delimiters + ']+(.)?', 'g') : DEFAULT_REGEX, toUpper);
    };
})();

এটি নিম্নলিখিত সমস্ত প্রান্তের কেস পরিচালনা করে:

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

লাইভ টেস্টগুলির লিঙ্কটি এখানে: http://jsfiddle.net/avKzf/2/

পরীক্ষার ফলাফল এখানে:

  • ইনপুট: "ab-cd-ef", ফলাফল: "abCdEf"
  • ইনপুট: "ab-cd-ef-", ফলাফল: "abCdEf"
  • ইনপুট: "ab-cd-ef--", ফলাফল: "abCdEf"
  • ইনপুট: "ab-cd - ef--", ফলাফল: "abCdEf"
  • ইনপুট: "--ab-cd - ef--", ফলাফল: "AbCdEf"
  • ইনপুট: "--ab-cd -__- ef--", ফলাফল: "AbCdEf"

লক্ষ্য করুন যে ডিলিমিটারগুলির সাথে শুরু হওয়া স্ট্রিংগুলির শুরুতে একটি বড় হাতের অক্ষরের ফলাফল হবে। যদি আপনি এটি প্রত্যাশা না করেন তবে আপনি সর্বদা lcfirst ব্যবহার করতে পারেন। আপনার যদি প্রয়োজন হয় তবে এখানে আমার এলসিফার্স্ট:

function lcfirst(str) {
    return str && str.charAt(0).toLowerCase() + str.substring(1);
}

4

এটি RegExpআমার কাছে চিৎকার করে না । ব্যক্তিগত স্ট্রিং এবং অ্যারে পদ্ধতিগুলি পর্যাপ্ত হয়ে গেলে ব্যক্তিগতভাবে আমি নিয়মিত প্রকাশগুলি এড়াতে চেষ্টা করি:

let upFirst = word => 
  word[0].toUpperCase() + word.toLowerCase().slice(1)

let camelize = text => {
  let words = text.split(/[-_]/g) // ok one simple regexp.
  return words[0].toLowerCase() + words.slice(1).map(upFirst)
}

camelize('marker-image') // markerImage

1

এখানে আরও একটি বিকল্প যা এখানে কয়েকটি দম্পতির উত্তরগুলির সংমিশ্রণ করে এবং একটি স্ট্রিংয়ে এটি পদ্ধতি করে:

if (typeof String.prototype.toCamel !== 'function') {
  String.prototype.toCamel = function(){
    return this.replace(/[-_]([a-z])/g, function (g) { return g[1].toUpperCase(); })
  };
}

এর মতো ব্যবহৃত:

'quick_brown'.toCamel(); // quickBrown
'quick-brown'.toCamel(); // quickBrown

1
// Turn the dash separated variable name into camelCase.
str = str.replace(/\b-([a-z])/g, (_, char) => char.toUpperCase());


0

আরেকজন নিন।

ব্যবহৃত যখন ...

var string = "hyphen-delimited-to-camel-case"
or
var string = "snake_case_to_camel_case"


function toCamelCase( string ){
  return string.toLowerCase().replace(/(_|-)([a-z])/g, toUpperCase );
}

function toUpperCase( string ){
  return string[1].toUpperCase();
}

Output: hyphenDelimitedToCamelCase

0

সেই কাজের জন্য পুনরাবৃত্তি সহ সূচিপত্রও ব্যবহার করা সম্ভব।

input some-foo_sd_dsd-weqe
output someFooSdDsdWeqe

তুলনা ::: দুটি পৃথক স্ক্রিপ্টের জন্য কার্যকরকরণের সময় পরিমাপ করুন:

$ node camelCased.js
someFooSdDsdWeqe
test1: 2.986ms
someFooSdDsdWeqe
test2: 0.231ms

কোড:

console.time('test1');
function camelCased (str) {

        function check(symb){

            let idxOf = str.indexOf(symb);
            if (idxOf === -1) {
                return str;
            }

            let letter = str[idxOf+1].toUpperCase();
            str = str.replace(str.substring(idxOf+1,idxOf+2), '');
            str = str.split(symb).join(idxOf !== -1 ? letter : '');

            return camelCased(str);
        }       

        return check('_') && check('-');

    }

console.log(camelCased ('some-foo_sd_dsd-weqe'));
console.timeEnd('test1');



console.time('test2');

    function camelCased (myString){
     return myString.replace(/(-|\_)([a-z])/g, function (g) { return  g[1].toUpperCase(); });
   }


console.log(camelCased ('some-foo_sd_dsd-weqe'));
console.timeEnd('test2');

0

লুপের জন্য এবং রেজেক্স ছাড়াই পতাকা সহ একটি সংস্করণ:

function camelCase(dash) { 

  var camel = false;
  var str = dash;
  var camelString = '';

  for(var i = 0; i < str.length; i++){
    if(str.charAt(i) === '-'){
      camel = true;

    } else if(camel) {
      camelString += str.charAt(i).toUpperCase();
      camel = false;
    } else {
      camelString += str.charAt(i);
    }
  } 
  return camelString;
}

0

এখানে আমার বাস্তবায়ন (কেবলমাত্র হাত নোংরা করার জন্য)

/**
 * kebab-case to UpperCamelCase
 * @param {String} string
 * @return {String}
 */
function toUpperCamelCase(string) {
  return string
    .toLowerCase()
    .split('-')
    .map(it => it.charAt(0).toUpperCase() + it.substr(1))
    .join('');
}

0

আপনি যদি আপনার স্ট্রিংয়ে সংখ্যার অনুমতি দেন তবে এটি ব্যবহার করুন ।

স্পষ্টতই সংখ্যার সাথে শুরু হওয়া অংশগুলি মূলধনী করা হবে না, তবে এটি কিছু পরিস্থিতিতে কার্যকর হতে পারে।

function fromHyphenToCamelCase(str) {
  return str.replace(/-([a-z0-9])/g, (g) => g[1].toUpperCase())
}

function fromHyphenToCamelCase(str) {
  return str.replace(/-([a-z0-9])/g, (g) => g[1].toUpperCase())
}

const str1 = "category-123";
const str2 = "111-222";
const str3 = "a1a-b2b";
const str4 = "aaa-2bb";

console.log(`${str1} => ${fromHyphenToCamelCase(str1)}`);
console.log(`${str2} => ${fromHyphenToCamelCase(str2)}`);
console.log(`${str3} => ${fromHyphenToCamelCase(str3)}`);
console.log(`${str4} => ${fromHyphenToCamelCase(str4)}`);

আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.