如何从textarea值获取对象

Question

这是一个文本区域的值：

STORY 01---abc
STORY 02---def
STORY 03---ghi

从上面我需要一个对象：

{"STORY 01":"abc","STORY 02":"def","STORY 03":"ghi"}

我的尝试-没有成功：

let obj = {};
let arr = $('#txa').val().split('\n');
for(el of arr){
  let a = el.split('---')[0];
  let b = el.split('---')[1];
  obj.a = b;
}

结果：a: "ghi"

有帮助吗？

Answer 1

您需要使用字符串访问器

obj[a] = b

obj.a指代属性'a'，obj[a]指代其键等于a值的属性

Answer 2

您已经接近了，但是您必须使用方括号（obj.a）表示法来设置新的对象键，而不是点（obj[a]）表示法。否则，您总是在更新对象的键a。

此外，请注意，无需重复split()调用，您只需执行一次即可从结果数组中获取两个值。

let obj = {};
let arr = $('#myTArea').val().split('\n');

for (el of arr)
{
    let [a, b] = el.split('---');
    obj[a] = b;
}

console.log(obj);
console.log(obj["STORY 01"]);
console.log(obj["STORY 02"]);
console.log(obj["STORY 03"]);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<textarea id="myTArea">STORY 01---abc
STORY 02---def
STORY 03---ghi</textarea>

Answer 3

说明

使用destructuring，String#match和Array#reduce

.match(/(?!\n).+/g)获取每行的数组。

对于每行，用---分割并更新累加器（a）并返回。

.reduce((a,c)=>{
   const [key, value] = c.split("---");
   a[key]=value;
   return a;
 }, {});

解决方案

const data = `
STORY 01---abc
STORY 02---def
STORY 03---ghi
`;

const res = data.trim()
 .match(/(?!\n).+/g)
 .reduce((a,c)=>{
   const [key, value] = c.split("---");
   a[key]=value;
   return a;
 }, {});

console.log(res);

建议

由于您的密钥有空格，因此我将以不同的方式重新组织最终输出。另外，直接从文本区域获取输入并将其用作键也容易导致用户输入错误。

const data = `
STORY 01---abc
STORY 02---def
STORY 03---ghi
`;

const res = data.trim()
 .match(/(?!\n).+/g)
 .map(c=>{
   const [key, value] = c.split("---");
   return {key, value};
 });

console.log(res);

Answer 4

关键在于使用bracket notation

向obj添加属性

我使用了String.prototype.substring和Array.prototype.forEach

的另一种方法

//vanilla solution - no jQuery

const obj = {}; //use constant since the variable itself won't change
const arr = document.querySelector("#myTArea").value.split('\n'); //same here
//since arr is the array containing the splitted values
//we can use array's forEach
arr.forEach(function(element){
  const delimiter = element.indexOf("-");
  const keyValue = element.substring(0, delimiter); 
  const value = element.substring(delimiter+3); //delimiter is 3 long, so index+3

  obj[keyValue] = value;
});
console.log(obj);

<textarea id="myTArea">STORY 01---abc
STORY 02---def
STORY 03---ghi</textarea>