REST YOUTUBE DATA API 3から外部コールバック関数にデータを割り当てる関数Jquery

Question

問題：REST API呼び出しからデータを取得し、変数に割り当てて別の関数または目的の入力として使用したいとします。

機能：

function getSongName(id, callback) { 
     var apikey = {My_TOKEN}; 
     var fetchInformation = "https://www.googleapis.com/youtube/v3/videos?key=" +apikey +"&fields=items(snippet(title" +"))&part=snippet&id=" +id; 
     $.getJSON(fetchInformation, function (jsonData) { 
      fullname = jsonData.items[0].snippet.title; 
      callback(fullname); 
     }); 
    } 

私は必要に応じて、私はにconsole.logの値を取得

var title = getSongName(youtubeID, function(name) { 
            console.log("song name is :"+name); 
           }); 

で別の場所にこの関数を呼び出しています。私は「getSongName」コール内で使用することはできませんので、ここで 今、私は

z.innerHTML = '<b>' + title + 'num: ' + j + '</b>'; 

でこのタイトルを使いたいjは別の場所から来ています。

内部にはconsole.logを実行するだけでなく、実際には別の変数に「名前」を割り当てて、上記のように使用しますか？

これを実行する別の方法があるかどうかわかりませんが、私は出くわしていませんが、助けていただければ幸いです。

は-----------私は私の値を取得するために、上記の関数を呼び出したループ内で実行される別の関数内で次に

function getSongName(youtubeID, idForPlayer,i, z, callback) { 
    var apikey = {My_TOKEN}; 
    var fetchInformation = "https://www.googleapis.com/youtube/v3/videos?key=" +apikey +"&fields=items(snippet(title" +"))&part=snippet&id=" +id; 

//$.ajaxSetup({'async':false}); WILL return the value for each loop and not do it asynchronously which had me pulling my hair out. P.S. this was the reason only one value was being returned 
$.ajaxSetup({'async':false}); 
     $.getJSON(fetchInformation, function (jsonData) { 
      debugger; 
      var fullname = jsonData.items[0].snippet.title; 
      boolean = false; 
      if (fullname) { 
       boolean = true; 
       if (boolean){ 
        console.log("song name inside the gerSongName loop is: " + i +" ", fullname); 
        callback(fullname); 
       } 
       debugger; 
      } 
      else { 
       debugger; 
       console.log("No song name"); 
      } 

     }); 
    } 

下記STEPSを解決しました。

getSongName(youtubeID, idForPlayer,i, z, function(name) { 
            z.innerHTML = '<b>' + name + '</b>'; 
            debugger; 
            document.getElementById('elementTagID').appendChild(z); 

           }); 

これは他の人に役立つことを望みます。 ありがとうございます。

Answer 1

あなたは関数の外で、このようなのvar宣言入れることができます：

var fullname = ""; 

function getSongName(id, callback) { 
     var apikey = {My_TOKEN}; 
     var fetchInformation = "https://www.googleapis.com/youtube/v3/videos?key=" +apikey +"&fields=items(snippet(title" +"))&part=snippet&id=" +id; 
     $.getJSON(fetchInformation, function (jsonData) { 
      fullname = jsonData.items[0].snippet.title; 
      callback(); 
     }); 
    } 

をしかし、呼び出しが非同期であるので、varは唯一の私はそれがより多くのだと思う..私は質問を理解callback.If後の値を取得しますあなたがロギングのようにコールバックを直接使う権利

Answer 2

私はおそらく別のアプローチを取り、これに構造を変更したい：あなたのコールバックで

z.innerHTML = '<b><span class="title"></span>num: ' + j + '</b>'; 

そして：

document.querySelector('.title').textContent = name; 

かのTextContentをサポートしていないブラウザのために：

document.querySelector('.title').innerHTML = name; 

次のplunkを参照してください。https://plnkr.co/edit/k5Evt98M5fiOazU7tpKU