javascript - Google Books API 的“无法从未定义中读取属性“0””
问题描述
在我script.js
的 Google Book API 搜索网络应用程序中,在少数情况下我会遇到以下错误:
未捕获的类型错误:无法读取未定义的属性“0”
这是指以下代码行:
isbn = data.items[i].volumeInfo.industryIdentifiers[0].identifier;
那么,有没有办法避免这个错误,并industryIdentifiers
在分配变量之前检查查询返回的数据中是否存在?
我尝试先检查是否industryIdentifiers
存在,然后将值分配给变量,industryIdentifiers
在分配之前检查是否为空或“未定义”,但我无法解决这个问题。
这是我目前正在使用的代码:
/*global document, $, console, event, results */
function bookSearch() { //function triggered by button
/* eslint-disable no-console */
event.preventDefault(); //preventing auto refresh of the page
//console.log("This function is working."); //console.log to see if the function was running properly
var search = document.getElementById('book').value; //storing the value of search
document.getElementById('results').innerHTML = '';
//console.log(search); //console.log to see "search" in console
$.ajax({
url: "https://www.googleapis.com/books/v1/volumes?q=" + search + "&startIndex=0&maxResults=40&key=AIzaSyCOBbymaad4eBVNFVF5JC-Pc0TQzE6AHOw", //linking API + our search
//-------------^this increments the number of results returned. default 10
dataType: "json",
success: function(data) {
console.log(data)
//var results = document.getElementById('results'); //creating variable results
//var title,authors, publisher,link,thumbNail,isbn = ''; //variables to use in results.innerHTML
for (i = 0 ; i < data.items.length ; i++ ) {
//-------------^loop runs as much as the lenght of items
title = data.items[i].volumeInfo.title; //storing informations to display
authors = data.items[i].volumeInfo.authors;
link = data.items[i].volumeInfo.infoLink;
thumbNail = data.items[i].volumeInfo.imageLinks.smallThumbnail;
if( typeof data.items[i].volumeInfo.publisher != "undefined"){
publisher = data.items[i].volumeInfo.publisher;
}
isbn = data.items[i].volumeInfo.industryIdentifiers[0].identifier;
results.innerHTML += "<h2>" + title + "</h2>" + //writing the results returned
"<h3>By: " + authors + "</h3>"
if(publisher != null){ //this solves the problem of showing
results.innerHTML += "<h3>Published by: " + publisher + "</h3>"
}
results.innerHTML += "<a href=" + link +'"><img src="'+ thumbNail + '"></a>' +
"<h4>ISBN " + isbn + "</h4>" +
"<hr><br>"
}
},
type: "GET"
})
}
解决方案
如果不查看出现错误时收到的实际数据与没有错误时收到的实际数据,以下是防止异常的方法:
if (data.items[i].volumeInfo.industryIdentifiers
&& data.items[i].volumeInfo.industryIdentifiers[0]) {
isbn = data.items[i].volumeInfo.industryIdentifiers[0].identifier;
}
如果您不确定volumeInfo
属性,您甚至可以添加要检查的内容:
if (data.items[i].volumeInfo
&& data.items[i].volumeInfo.industryIdentifiers
&& data.items[i].volumeInfo.industryIdentifiers[0]) {
isbn = data.items[i].volumeInfo.industryIdentifiers[0].identifier;
}
这基本上检查“industryIdentifiers”不为空,并且其中包含第零个元素。当您尝试时,您可能错过了检查第二部分。
如果即使此解决方案不起作用,请添加您在出错时以及成功时得到的实际响应。
推荐阅读
- java - 奇怪的事情正在发生。每次我在笔记本电脑上启动 Jenkins 时,笔记本电脑中的 Java 8 JDK 文件夹都会消失。那只是我吗?
- python - For 循环返回奇数值
- laravel - Laravel 5.7 : storage/app/private 上的 404 或 403 而它在 storage/app/public 上工作
- vue.js - 没有传递给动态组件的道具
- sql - 如何在同一个查询/脚本中获取服务器角色和数据库角色?
- visual-studio - Windows 生物识别框架失败
- c# - Response.Redirect 没有将值传递给另一个网络表单
- java - JHipster - import-jdl - 字段已将 jhi_ 添加到名称
- html - 具有部分不透明灰色背景的对话窗口
- tla+ - TLC 无法处理规范的这种结合