如何访问另一个功能中的箭头功能?

时间:2019-05-21 14:48:39

标签: javascript const arrow-functions

我正在制作一个函数来转换数组并返回一个字符串,但是当我尝试使用箭头函数并运行代码时,如果我制作了传统函数,则该函数只能工作:

初始化前无法访问'convertStringToForm'

我的代码:

const convertStringToForm = (array) => {

    var stringOfArray = ""

    for(let i=0; i<array.length; i++){
        stringOfArray += "{&quot;id&quot;:" + array[i]['id'] + ",&quot;descricao&quot;:&quot;" + array[i]['descricao'] + "&quot;}";
        if(i < (array.length - 1))
            stringOfArray += ",";
    }

    return stringOfArray;

}

function addPergunta(ev, categoria, tipo){
    let tipoConvertido = convertStringToForm(tipo);
    console.log(tipoConvertido);
}

让我解释一下我在做什么,我有一个来自PHP的数组,并通过一个函数将其发送到Javascript,然后在我的javascript函数内部,我使用了“ for”将该信息传递给我的视图。

我在下面收到这个数组:

[          
  {"id":1,"descricao":"Influente","created_at":null,"updated_at":null},
  {"id":1,"descricao":"Influente","created_at":null,"updated_at":null},
]

如果我将其返回到我的视图中,则它不会呈现,该页面将向我显示[对象对象] [对象对象]如果有人知道解决此问题的更好方法,我将非常感激。为了解决该问题,我创建了函数“ convertStringToForm”,该函数返回一个字符串,如下所示:

{&quot;id&quot;:" + 2 + ",&quot;descricao&quot;:&quot;" + someText + "&quot;},
{&quot;id&quot;:" + 2 + ",&quot;descricao&quot;:&quot;" + someText + "&quot;}

我想知道如何使用箭头功能代替传统功能,下面的代码可以正常工作。

function convertStringToForm(array) {

    var stringOfArray = ""

    for(let i=0; i<array.length; i++){
        stringOfArray += "{&quot;id&quot;:" + array[i]['id'] + ",&quot;descricao&quot;:&quot;" + array[i]['descricao'] + "&quot;}";
        if(i < (array.length - 1))
            stringOfArray += ",";
    }

    return stringOfArray;

}

function addPergunta(ev, categoria, tipo){
    let tipoConvertido = convertStringToForm(tipo);
    console.log(tipoConvertido);
}
  

我在下面更好地解释了这个问题。

因此,我尝试使用JSON.parse(),但没有用。正如@SomeshMukherjee所说的,我的意思不是语法,我只是想问为什么当我尝试在另一个函数中调用箭头函数时在屏幕上弹出该错误。

我的页面上有此按钮:

 <button onclick="addResposta(this, {{App\Tipo::all()}} )" id="btnaddResposta" type="button" class="btn btn-primary"> Text </button>
  

{{App \ Tipo :: all()}}这就是我从PHP / Laravel接收数组的方式。

当我单击此按钮时,函数会创建此按钮:

<button type="button" onClick="return addPergunta(this, {{App\Categoria::all()}}, {{App\Tipo::all()}} )" class="btn btn-primary"><i class="fas fa-plus-circle"></i> Adicionar Pergunta</button>

问题是,如果在我的函数中我做类似

html +="<button onclick='addResposta(this," + tipo + ")' id='btnaddResposta' type='button' class='btn btn-primary'>";

我检查代码时收到此消息:

<button onclick="addResposta(this, [Object Object] [Object Object])" id="btnaddResposta" type="button" class="btn btn-primary"> Text </button>

为解决这个问题,我创建了一个函数,将对象转换为所需的字符串,然后我的按钮接收到正确的数组,如下所示:

<button onclick="addResposta(this, [{&quot;id&quot;:1,&quot;descricao&quot;:&quot;Influente&quot;,&quot;created_at&quot;:null,&quot;updated_at&quot;:null},{&quot;id&quot;:2,&quot;descricao&quot;:&quot;Conforme&quot;,&quot;created_at&quot;:null,&quot;updated_at&quot;:null},{&quot;id&quot;:3,&quot;descricao&quot;:&quot;Dominante&quot;,&quot;created_at&quot;:null,&quot;updated_at&quot;:null},{&quot;id&quot;:4,&quot;descricao&quot;:&quot;Est\u00e1vel&quot;,&quot;created_at&quot;:null,&quot;updated_at&quot;:null}] )" id="btnaddResposta" type="button" class="btn btn-primary">

之所以提出这个问题,是因为如果我违反社区的任何规则,我想更好地理解箭头功能,请为此感到抱歉。

感谢所有答案。 #和平

2 个答案:

答案 0 :(得分:0)

  

如果我将其返回到我的视图,则未呈现该页面,该页面显示[Object Object] [Object Object]

[Object Object]只是对象的默认字符串表示形式。如果要读取其属性,则只需这样做,或将其格式化为适当的字符串即可。

var data = [          
  {"id":1,"descricao":"Influente","created_at":null,"updated_at":null},
  {"id":1,"descricao":"Influente","created_at":null,"updated_at":null},
];

var eg1 = document.querySelector("#example1");
for(var i = 0;i<data.length;i++){
 var elem = document.createElement("div");
 elem.innerText = data[i];
 eg1.appendChild(elem);
}

var eg2 = document.querySelector("#example2");
for(var i = 0;i<data.length;i++){
 var elem = document.createElement("div");
 elem.innerText = data[i].id + ":" + data[i].descricao;
 eg1.appendChild(elem);
}
var eg3 = document.querySelector("#example3");
for(var i = 0;i<data.length;i++){
 var elem = document.createElement("div");
 elem.innerText = JSON.stringify(data[i]);
 eg1.appendChild(elem);
}
<div id="example1"></div>
<div id="example2"></div>
<div id="example3"></div>

上面您可以看到3个示例。

  • 第一个只是直接附加数组项,因此浏览器只是将其解释为[object Object]
  • 第二个实际上读取感兴趣的属性并构建所需的字符串。
  • 第三个使用JSON.stringify来生成javascript对象的字符串表示形式。

答案 1 :(得分:-4)

尝试更换:

const convertStringToForm = (array) => {

具有:

var convertStringToForm = (array) => {