При вызове значения объектов из JSON, почему оно должно быть заключено в кавычки и символы плюс? - PullRequest
Новая
       12

При вызове значения объектов из JSON, почему оно должно быть заключено в кавычки и символы плюс?

0 голосов
/ 09 июня 2018

При первой попытке сделать этот вызов PunkAPI я пытался добавить изображения (URL-адреса - это объект, возвращаемый в JSON) с помощью 

append("<img src='beer[i].image_url'/>");

, что не сработало, поскольку (из консоли) aзапрос был сделан на http://projectURL.com/beer[i].image_url вместо http://apiURL/beer[i].image_url.

Я видел из онлайн-примера, что он будет работать правильно, если я заключу объектный запрос в кавычки и плюсы: 

append("<img src='"+beer[i].image_url+"'/>");

То, что я хотел бы знать, это , почему плюсы и кавычки обязательны.Заранее спасибо!


Полный код ниже 


 var request = new XMLHttpRequest();
  
request.open("GET", "https://api.punkapi.com/v2/beers?abv_gt=5"); 
  request.responseType = 'json';
  request.send();
  
  request.onload = function() {    
    var beer = request.response; 

    var i; 
    for(i=0; i<beer.length; i++){ 
      $("#demo").append("<img src='"+beer[i].image_url+"' />");
    }    
  };
  
  
  
  
    <body>
  
  <div id="demo">
    
  </div>
  
</body>

  
 <script
  src="https://code.jquery.com/jquery-3.3.1.min.js"
  integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
  crossorigin="anonymous"></script>

Ответы [ 2 ]

0 голосов
/ 09 июня 2018

В JavaScript нет такой вещи, как привязка переменных внутри строк в двойных кавычках.Даже там обычно можно было использовать простую переменную, но не выражение, которое вы хотите связать beer[i].image_url

0 голосов
/ 09 июня 2018

Проблема в том, что если вы не используете кавычки и плюсы для конкатенации строки, то JavaScript не будет знать, что вы пытаетесь конкатенировать значение переменной, чтобы использовать его как часть окончательной строки, и будет интерпретировать его как простуюstring.

Таким образом, вам нужно объединить переменную следующим образом: 

append("<img src='"+beer[i].image_url+"'/>");

Или в es6 вы можете использовать замену переменной, используя строки в кавычках в кавычках: 

let source = beer[i].image_url;
append(`<img src="${source}" />`);
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Похожие темы

...