Блог

Главная - Вопросы по программированию - как добавить «/*! */ » в ключ объекта при разделении строки?

как добавить «/*! */ » в ключ объекта при разделении строки?

#javascript

Вопрос:

Я разделяю свою строку и преобразую ее в объект javascript . но мой ключ пропускает это character /*! */ .

вот моя функция строки и разделителя

 const a = "/*! ###################################################### # Test.cs #  RELEASE: 1.1.1 # BUILD DATE: Fri Oct 30 2020 15:25:57 GMT-0700 (PDT) # COPYRIGHT ###################################################### *//*! MISC   SASS */a:focus,button:focus,div[tabindex]:focus,li[tabindex]:focus,span[tabindex]:focus{outline-offset:2px;outline-width:2px!important;outline-style:dotted!important;outline-color:currentColor}/*! GENERIC - BGIMG */.bgimg{background-size:cover;background-position:50% 50%;background-repeat:no-repeat}/*! CG2111 - test */span{color:red}/*! CG2112 - test */span{color:red}/*! INFO */#id{content:'1.1.1'}";

const result = {},
  temp = a.split(//*!s*(.*?)s**//).slice(1);
while (temp.length) result[temp.shift()] = temp.shift();

console.log(result);

Мой вывод

 {"###################################################### # Test.cs #  RELEASE: 1.1.1 # BUILD DATE: Fri Oct 30 2020 15:25:57 GMT-0700 (PDT) # COPYRIGHT ######################################################":"","MISC   SASS":"a:focus,button:focus,div[tabindex]:focus,li[tabindex]:focus,span[tabindex]:focus{outline-offset:2px;outline-width:2px!important;outline-style:dotted!important;outline-color:currentColor}","GENERIC - BGIMG":".bgimg{background-size:cover;background-position:50% 50%;background-repeat:no-repeat}","CG2111 - test":"span{color:red}","CG2112 - test":"span{color:red}","INFO":"#id{content:'1.1.1'}"}

Ожидаемый выход

  {
  "/*! ###################################################### # Test.cs #  RELEASE: 1.1.1 # BUILD DATE: Fri Oct 30 2020 15:25:57 GMT-0700 (PDT) # COPYRIGHT ###################################################### */": "",
  "/*! MISC   SASS */": "a:focus,button:focus,div[tabindex]:focus,li[tabindex]:focus,span[tabindex]:focus{outline-offset:2px;outline-width:2px!important;outline-style:dotted!important;outline-color:currentColor}",
  "/*! GENERIC - BGIMG */": ".bgimg{background-size:cover;background-position:50% 50%;background-repeat:no-repeat}",
  "/*! CG2111 - test */": "span{color:red}",
  "/*! CG2112 - test */": "span{color:red}",
  "/*! INFO */": "#id{content:'1.1.1'}"
}

Комментарии:

1. Ваше регулярное выражение можно упростить до //*!(.*?)*// . Кажется, что это правильно, чтобы правильно соответствовать требуемым значениям ключей.

Ответ №1:

Все ваши совпадения начинаются с /*! пробела, за которым следует пробел, поэтому сопоставляйте эти символы до тех пор, пока lookahead не совпадет с тем же /*! или концом строки.

 const a = "/*! ###################################################### # Test.cs #  RELEASE: 1.1.1 # BUILD DATE: Fri Oct 30 2020 15:25:57 GMT-0700 (PDT) # COPYRIGHT ###################################################### *//*! MISC   SASS */a:focus,button:focus,div[tabindex]:focus,li[tabindex]:focus,span[tabindex]:focus{outline-offset:2px;outline-width:2px!important;outline-style:dotted!important;outline-color:currentColor}/*! GENERIC - BGIMG */.bgimg{background-size:cover;background-position:50% 50%;background-repeat:no-repeat}/*! CG2111 - test */span{color:red}/*! CG2112 - test */span{color:red}/*! INFO */#id{content:'1.1.1'}";

const result = Object.fromEntries(
  [...a.matchAll(/(/*! .*?*/)(.*?)(?=/*! |$)/g)]
    .map(([, key, value]) => [key, value])
);
console.log(result);
  • /*! — сопоставьте буквальное / значение , за которым следует буквальное * значение , за которым следует *
  • — сопоставьте буквальный пробел
  • .*? — сопоставьте как можно меньше символов до тех пор, пока
  • (?=/*! |$) совпадения по внешнему виду
    • /*! — те же начальные символы, или
    • $ — конец веревки

Комментарии:

1. но это не ожидаемый результат .. Мне нужен объект . не массив

2. О, я скучала по двоеточиям. Струны очень, очень длинные. Используйте matchAll вместо этого и захватите ключ и значение отдельно, чтобы вы могли объединить их в объект с Object.fromEntries

Ответ №2:

ES6 ответ:

 const a = "/*! ###################################################### # Test.cs #  RELEASE: 1.1.1 # BUILD DATE: Fri Oct 30 2020 15:25:57 GMT-0700 (PDT) # COPYRIGHT ###################################################### *//*! MISC   SASS */a:focus,button:focus,div[tabindex]:focus,li[tabindex]:focus,span[tabindex]:focus{outline-offset:2px;outline-width:2px!important;outline-style:dotted!important;outline-color:currentColor}/*! GENERIC - BGIMG */.bgimg{background-size:cover;background-position:50% 50%;background-repeat:no-repeat}/*! CG2111 - test */span{color:red}/*! CG2112 - test */span{color:red}/*! INFO */#id{content:'1.1.1'}";

const map = a.split('/*!').slice(1) // break into each item per key-value pair
  .map(str => str.split('*/')) // separate key and value
  .map(([key, value]) => [`/*!${key}*/`, value]) // add back delimiters
  .reduce((map, [key, value]) => ({...map, [key]: value}), {}); // merge into a map

console.log(map);

Выход:

 {
  "/*! ###################################################### # Test.cs #  RELEASE: 1.1.1 # BUILD DATE: Fri Oct 30 2020 15:25:57 GMT-0700 (PDT) # COPYRIGHT ###################################################### */": "",
  "/*! MISC   SASS */": "a:focus,button:focus,div[tabindex]:focus,li[tabindex]:focus,span[tabindex]:focus{outline-offset:2px;outline-width:2px!important;outline-style:dotted!important;outline-color:currentColor}",
  "/*! GENERIC - BGIMG */": ".bgimg{background-size:cover;background-position:50% 50%;background-repeat:no-repeat}",
  "/*! CG2111 - test */": "span{color:red}",
  "/*! CG2112 - test */": "span{color:red}",
  "/*! INFO */": "#id{content:'1.1.1'}"
}
Метки: