此问题已在此处有答案：

try..catch not catching async/await errors（1个答案）
Fetch API error handling（3个答案）
How to handle HTTP code 4xx responses in fetch api（4个答案）
昨天关门了。
我正在学习JavaScript API项目，fetch，then，catch。我用YouTube JavaScript API项目编写了代码。每次我尝试它，'捕捉'是不工作。

let searchBtn=document.getElementById("search-btn");
let countryInp=document.getElementById("country-inp");
searchBtn.addEventListener("click", ()=>{
    let countryName=countryInp.value;
    let finalURL=`https://restcountries.com/v3.1/name/${countryName}?fullText=true`;
    console.log(finalURL);
    fetch(finalURL)
    .then((response)=>response.json())
    .then(data=>{
        console.log(data[0]);
        console.log(data[0].capital[0]);
        console.log(data[0].flags.svg);
        console.log(data[0].name.common);
        console.log(data[0].continents[0]);
        console.log(Object.keys(data[0].currencies)[0]);
    })
    .catch(()=>{
        if(countryName.lengh==0){
            result.innerHTML=`<h3>The input field cannot be empty</h3>`;
        }
        else{
            result.innerHTML=`<h3>Please enter a valid country name.</h3>`;
        }
    });
});

<button id="search-btn">Search</button>
<input id="country-inp" value="United Kingdom"></input>

consol box是这么说的script.js：7 GET https://restcountries.com/v3.1/name/?fullText=true 404（Not Found）（匿名）@ script.js：7
我尽力了
.catch(error => console.log(error))
但效果并不好