Phân tích sâu hơn về trạng thái bảo trì của @legraphista/unique-names-generator dựa trên nhịp phiên bản npm đã phát hành, hoạt động của kho lưu trữ và các điểm dữ liệu khác đã xác định rằng việc bảo trì của nó là Không hoạt động
Một tín hiệu bảo trì dự án quan trọng cần xem xét đối với @legraphista/unique-names-generator là nó không thấy bất kỳ phiên bản mới nào được phát hành cho npm trong 12 tháng qua và có thể được coi là một dự án đã ngừng hoặc ít được chú ý
Trong tháng trước, chúng tôi không tìm thấy bất kỳ hoạt động yêu cầu kéo nào hoặc thay đổi trạng thái vấn đề đã được phát hiện đối với kho lưu trữ GitHub
Không dành riêng cho nút, nhưng tôi đã tìm thấy trình tạo haiku sau tại đây. Bạn có thể điều chỉnh nó theo cách sau
function haiku[]{
var adjs = ["autumn", "hidden", "bitter", "misty", "silent", "empty", "dry",
"dark", "summer", "icy", "delicate", "quiet", "white", "cool", "spring",
"winter", "patient", "twilight", "dawn", "crimson", "wispy", "weathered",
"blue", "billowing", "broken", "cold", "damp", "falling", "frosty", "green",
"long", "late", "lingering", "bold", "little", "morning", "muddy", "old",
"red", "rough", "still", "small", "sparkling", "throbbing", "shy",
"wandering", "withered", "wild", "black", "young", "holy", "solitary",
"fragrant", "aged", "snowy", "proud", "floral", "restless", "divine",
"polished", "ancient", "purple", "lively", "nameless"]
, nouns = ["waterfall", "river", "breeze", "moon", "rain", "wind", "sea",
"morning", "snow", "lake", "sunset", "pine", "shadow", "leaf", "dawn",
"glitter", "forest", "hill", "cloud", "meadow", "sun", "glade", "bird",
"brook", "butterfly", "bush", "dew", "dust", "field", "fire", "flower",
"firefly", "feather", "grass", "haze", "mountain", "night", "pond",
"darkness", "snowflake", "silence", "sound", "sky", "shape", "surf",
"thunder", "violet", "water", "wildflower", "wave", "water", "resonance",
"sun", "wood", "dream", "cherry", "tree", "fog", "frost", "voice", "paper",
"frog", "smoke", "star"];
return adjs[Math.floor[Math.random[]*[adjs.length-1]]]+"_"+nouns[Math.floor[Math.random[]*[nouns.length-1]]];
}
Trong hướng dẫn này, chúng ta sẽ tạo một trình tạo tên ngẫu nhiên. Nó sẽ tạo họ và tên, đồng thời chúng tôi cũng sẽ có tùy chọn chỉ định giới tính
Tìm nạp dữ liệu
Đầu tiên, chúng ta sẽ cần một số dữ liệu để làm việc với. Hướng dẫn này sẽ sử dụng dữ liệu từ danh sách ngẫu nhiên. com, nhưng bạn có thể điều chỉnh mã này để sử dụng bất kỳ nguồn dữ liệu nào—bạn chỉ cần từng loại tên [tên, họ, v.v. ] dưới dạng một mảng các chuỗi
Đây là dữ liệu chúng tôi sẽ sử dụng [bạn có thể nhấp vào liên kết để xem JSON thô trong trình duyệt của mình]
- Tên nữ. https. //www. danh sách ngẫu nhiên. com/data/tên-nữ. json
- Tên nam. https. //www. danh sách ngẫu nhiên. com/data/tên-nam. json
- họ. https. //www. danh sách ngẫu nhiên. com/data/tên-họ. json
Sử dụng Fetch API, hãy bắt đầu bằng cách viết một hàm async để tìm nạp dữ liệu
async function fetchData[url] {
const response = await fetch[url];
return response.json[];
}
Vì đây là chức năng không đồng bộ, hãy thêm một số xử lý lỗi để ghi lỗi vào bảng điều khiển trong trường hợp yêu cầu mạng không thành công
async function fetchData[url] {
try {
const response = await fetch[url];
if [!response.ok] {
throw new Error['Network response was not ok'];
}
return response.json[];
} catch [error] {
console.error['Unable to fetch data:', error];
}
}
Đây là chức năng có mục đích chung để tìm nạp JSON, nhưng chúng tôi thực sự muốn tìm nạp từ ba điểm cuối API khác nhau [đối với tên nam, tên nữ và họ]
Hãy viết một hàm mới sử dụng hàm
async function fetchData[url] {
try {
const response = await fetch[url];
if [!response.ok] {
throw new Error['Network response was not ok'];
}
return response.json[];
} catch [error] {
console.error['Unable to fetch data:', error];
}
}
1 của chúng ta và các điểm cuối được đề cập ở trên để thực hiện việc nàyLưu ý cách các URL giống nhau ngoài một từ?
function fetchNames[nameType] {
return fetchData[`//www.randomlists.com/data/names-${nameType}.json`];
}
Điều này cho phép chúng tôi cung cấp phần còn thiếu của URL dưới dạng một biến khi chúng tôi gọi hàm này, e. g.
async function fetchData[url] {
try {
const response = await fetch[url];
if [!response.ok] {
throw new Error['Network response was not ok'];
}
return response.json[];
} catch [error] {
console.error['Unable to fetch data:', error];
}
}
2Chọn một tên ngẫu nhiên từ danh sách
Bây giờ chúng tôi có một cách để tìm nạp từng danh sách, chúng tôi cần một cách để chọn một mục ngẫu nhiên. Chúng ta có thể làm điều này với một chức năng trợ giúp đơn giản
function pickRandom[list] {
return list[Math.floor[Math.random[] * list.length]];
}
Tạo tên ngẫu nhiên
Chúng tôi có tất cả các phần riêng lẻ của trình tạo tên của mình đã sẵn sàng hoạt động. Hãy viết hàm
async function fetchData[url] {
try {
const response = await fetch[url];
if [!response.ok] {
throw new Error['Network response was not ok'];
}
return response.json[];
} catch [error] {
console.error['Unable to fetch data:', error];
}
}
3 cuối cùng của chúng ta. Nó sẽ nhận một tham số async function fetchData[url] {
try {
const response = await fetch[url];
if [!response.ok] {
throw new Error['Network response was not ok'];
}
return response.json[];
} catch [error] {
console.error['Unable to fetch data:', error];
}
}
4, mà chúng tôi sẽ sử dụng để xác định xem trả về tên nam hay nữasync function generateName[gender] {
try {
// Fetch both name lists in parallel
const response = await Promise.all[[
fetchNames[gender],
fetchNames['surnames']
]];
// Promise.all returns an array of responses
// to our two requests, so select them
const [firstNames, lastNames] = response;
// Pick a random name from each list
const firstName = pickRandom[firstNames.data];
const lastName = pickRandom[lastNames.data];
// Use a template literal to format the full name
return `${firstName} ${lastName}`;
} catch[error] {
console.error['Unable to generate name:', error];
}
}
Vì đây là một chức năng không đồng bộ khác, nó sẽ trả về một lời hứa. Để
async function fetchData[url] {
try {
const response = await fetch[url];
if [!response.ok] {
throw new Error['Network response was not ok'];
}
return response.json[];
} catch [error] {
console.error['Unable to fetch data:', error];
}
}
5 kết quả, chúng ta có thể gọi nó như thế nàyasync function fetchData[url] {
const response = await fetch[url];
return response.json[];
}
1Làm cho giới tính tùy chọn
Nếu chúng ta quên truyền tham số
async function fetchData[url] {
try {
const response = await fetch[url];
if [!response.ok] {
throw new Error['Network response was not ok'];
}
return response.json[];
} catch [error] {
console.error['Unable to fetch data:', error];
}
}
4 thì sao?Hiện tại, chúng tôi gặp lỗi vì chương trình của chúng tôi sẽ cố tìm nạp dữ liệu từ một URL không tồn tại. Ôi không. Làm thế nào chúng ta nên xử lý này?
Chúng tôi có một vài lựa chọn
- Chúng tôi có thể đưa ra lỗi nếu tham số
4 không được chuyểnasync function fetchData[url] {
try {
const response = await fetch[url];
if [!response.ok] {
throw new Error['Network response was not ok'];
}
return response.json[];
} catch [error] {
console.error['Unable to fetch data:', error];
}
} - Chúng ta có thể chọn một giới tính ngẫu nhiên
Hãy triển khai tùy chọn hai—chúng ta có thể thực hiện việc này dễ dàng với hàm trợ giúp
async function fetchData[url] {
try {
const response = await fetch[url];
if [!response.ok] {
throw new Error['Network response was not ok'];
}
return response.json[];
} catch [error] {
console.error['Unable to fetch data:', error];
}
}
8 của mình. Cuộc gọi đầu tiên đến async function fetchData[url] {
try {
const response = await fetch[url];
if [!response.ok] {
throw new Error['Network response was not ok'];
}
return response.json[];
} catch [error] {
console.error['Unable to fetch data:', error];
}
}
9 có thể được thay đổi thành cuộc gọi nàyasync function fetchData[url] {
const response = await fetch[url];
return response.json[];
}
6Bây giờ, việc chỉ định giới tính là tùy chọn và trình tạo tên của chúng tôi sẽ luôn trả về tên theo bất kỳ cách nào
Để tất cả chúng cùng nhau
Toàn bộ chương trình trông như thế này
async function fetchData[url] {
const response = await fetch[url];
return response.json[];
}
7Đây là một phiên bản làm việc bạn có thể chạy
Sử dụng dữ liệu của riêng bạn
Bạn muốn sử dụng một API khác?
Giả sử bạn muốn mã hóa mảng tên hobbit. Bạn có thể cập nhật nó để trông như thế này
async function fetchData[url] {
const response = await fetch[url];
return response.json[];
}
9Nếu chúng ta đang làm việc với dữ liệu cục bộ [thay vì lấy dữ liệu từ các điểm cuối API], thì chúng ta cũng cần đơn giản hóa hàm
async function fetchData[url] {
try {
const response = await fetch[url];
if [!response.ok] {
throw new Error['Network response was not ok'];
}
return response.json[];
} catch [error] {
console.error['Unable to fetch data:', error];
}
}
3 vì nó không còn thực hiện bất kỳ lệnh gọi không đồng bộ nào nữa