JSON ajax returns undefined

Question

So, I looked at SO and interwebs for some guiding light, but I can’t find anything that hits the nail on my head.

I am trying to return a value from a function. The following data will be presented in the message, so I know that the correct value is returned from the JSON call:

function getTitle(){
      var q= 'https://www.googleapis.com/youtube/v3/videos?id=[VIDEOID]&key=[APIKEY]&fields=items(snippet(title))&part=snippet'

$.ajax({
      url: q, 
      dataType: "text",
      success: function(data){
          data = JSON.parse(data);
          alert(data.items[0].snippet.title);
      }
  });
}
getTitle();

But when I try to return data from such a function:

function getTitle(){
     var q= 'https://www.googleapis.com/youtube/v3/videos?id=[VIDEOID]&key=[APIKEY]&fields=items(snippet(title))&part=snippet'

$.ajax({
      url: q, 
      dataType: "text",
      success: function(data){
          data = JSON.parse(data);
          return data.items[0].snippet.title;
      }
  });
}
alert(getTitle());

I get undefined.

If anyone could tell me where I will be bony, I would appreciate it.

Answer 1

$.ajax . getTitle undefined. - , success:

function getTitle(){
     var q= 'https://www.googleapis.com/youtube/v3/videos?id=[VIDEOID]&key=[APIKEY]&fields=items(snippet(title))&part=snippet'

    $.ajax({
        url: q, 
        dataType: "text",
        success: function(data){
            data = JSON.parse(data);
            setTitle(data.items[0].snippet.title);
        }
    });
}
function setTitle(title){
    //do something
}

Answer 2

$.ajax , .

function getTitle() {
  var q = 'https://www.googleapis.com/youtube/v3/videos?id=[VIDEOID]&key=[APIKEY]&fields=items(snippet(title))&part=snippet'

  $.ajax({
    url: q,
    dataType: "text",
    success: function(data) {
      data = JSON.parse(data);
      success(data);
    }
  });
}

function success(data) {
  alert(data.items[0].snippet.title);
}

Hide result