在javascript中访问对象属性的问题显示未定义？

Question

我只是调用api返回josn编码数据并试图打印对象属性，但显示未定义，但是当我打印该对象时，该对象具有该属性和值。 “sameerdighe14 @ gmail的：

我的代码基于

function sendData(postData, url){ 
     var response = apiCall(postData,url); 
     console.log(response.email) 
     console.log(response.count); 
    } 


    function apiCall(postData, postUrl){ 
     var response = {}; 
     $http({ 
      method : 'POST', 
      url  : postUrl, 
      data : postData, 
      headers : {'Content-Type': 'application/json'} 
     }).success(function(data) { 
       console.log(data) 
       for (var attr in data) { 
        if (data.hasOwnProperty(attr)) response[attr] = data[attr]; 
       } 
      }); 

     return response; 
    } 

PHP API

<?php 
    $_POST = json_decode(file_get_contents('php://input'), true); 
    $response = array(); 

    $response['email'] = $_POST['oauth']['email']; 
    $response['type'] = $_POST['oauth']['type']; 
    echo json_encode($response); 
?> 

控制台

对象{电子邮件响应数据。 com“，输入：”google“}

Answer 1

您需要使用promise来使其工作。一旦HTTP请求成功完成，你的success函数就被称为异步。这样return response;在请求完成之前执行 - >因此它仍然是一个空对象{}。使用AngularJS promises使其工作。这是一个简单的工作fiddle example。

function sendData(postData, url){ 

    var filteredData = {}; 

    apiCall(postData,url).then(function (response) { 

     for (var attr in response.data) { 
      if (response.data.hasOwnProperty(attr)) { 
       filteredData[attr] = response.data[attr]; 
      } 
     } 

     console.log(filteredData.email); 
     console.log(filteredData.count); 
    }); 
} 


function apiCall(postData, postUrl){ 
    return $http({ 
     method : 'POST', 
     url  : postUrl, 
     data : postData, 
     headers : {'Content-Type': 'application/json'} 
    }); 
} 

Answer 2

该代码没有以您期望的顺序运行。 $http需要时间才能运行，因此apiCall在修改前会返回响应。

要解决此问题，您需要使用承诺来确保代码只在您拥有所需的所有数据时才能运行。

此外，从$http返回的数据有一个属性data，其中包含调用的结果。

function sendData(postData, url) { 
    // subscribe to promise, and add your code in the then block 
    apiCall(postData,url) 
    .then(function(response) { 
     console.log(response.email); 
     console.log(response.count); 
    }); 
} 

function apiCall(postData, postUrl) { 
    // return the promise 
    return $http({ 
    method : 'POST', 
    url  : postUrl, 
    data : postData, 
    headers : {'Content-Type': 'application/json'} 
    }).success(function(response) { 
    var result = {}; 
    for (var attr in response.data) { 
     if (response.data.hasOwnProperty(attr)) { 
     result[attr] = response.data[attr]; 
     } 
    } 
    return result; 
    }); 
} 

---

注意，从$ HTTP请求data属性是保证不会对其原型额外的属性普通对象，所以你并不真正需要的hasOwnProperty检查。可以简化apiCall：

function apiCall(postData, postUrl) { 
    // return the promise 
    return $http({ 
    method : 'POST', 
    url  : postUrl, 
    data : postData, 
    headers : {'Content-Type': 'application/json'} 
    }).success(function(response) { 
    return response.data; 
    }); 
}