在前端开发中，我们经常需要使用到一些数据来进行测试或展示。其中，人名是一个常见的需求，比如在做社交网站时需要用到注册账号。假如我们想要在页面上展示一些星球大战（Star Wars）的角色名称，该怎么办呢？这时我们可以使用一个叫做 starwar-names-kishore 的 npm 包来满足这个需求。
安装
首先，我们需要在命令行界面中进入我们的项目路径，并使用 npm 来安装 starwar-names-kishore：
npm install starwar-names-kishore
安装完成后，我们就可以在代码中使用它了。
使用
在代码中，我们需要使用以下方式来引入 starwar-names-kishore：
const swNames = require('starwar-names-kishore');这样我们就可以通过 swNames 数组来访问其中的星球大战角色名称了。默认情况下，swNames 数组包含了 87 个星球大战角色名称，例如 "Luke Skywalker"、"Darth Vader" 等等。
console.log(swNames); // 输出所有角色名称 console.log(swNames[0]); // 输出第一个角色名称 console.log(swNames.length); // 输出角色名称的数量
我们还可以通过 starwarNames.random() 来随机获取其中的一个角色名称：
const randomName = swNames.random(); console.log(randomName); // 随机输出一个角色名称
需要注意的是，starwar-names-kishore 包并没有提供过滤器等功能，如果我们需要从其中筛选出符合条件的角色名称，需要自行编写代码实现。
示例代码
下面是一个使用 starwar-names-kishore 包的示例，其中使用到了 React 库来展示角色名称。
-- -------------------- ---- -------
------ ----- ---- --------
------ -------- ---- ------------
------ ------- ---- ------------------------
----- ------------ ------- --------------- -
------------------ -
-------------
---------- - - ----- ---------------- --
---------------- - ----------------------------
-
------------- -
--------------- ----- ---------------- ---
-
-------- -
------ -
-----
-------- ---- ----- ----------------------
------- -------------------------------- -- ---------------
------
--
-
-
----------------------------- --- ---------------------------------在这个示例中，我们首先在 constructor 阶段使用 swNames.random() 来初始化 state 中的 name 属性，这样在页面加载时就会展示一个随机的角色名称。同时，我们也为页面添加了一个按钮，当用户点击该按钮时，通过 handleClick 方法来更新 state 中的 name 属性，页面就会展示一个新的随机角色名称。
总结
starwar-names-kishore 是一个简单而实用的 npm 包，能够方便地为我们提供一些星球大战角色名称。当然，除了这个包之外，我们还可以通过很多其它的渠道来获取数据，比如使用 mock 数据、从后端 API 中获取等等。不管是哪种方式，我们都需要仔细阅读文档、了解数据的结构和格式，以及灵活运用代码来满足我们的需求。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/600555bd81e8991b448d2d74