当前位置:   article > 正文

让 AI 为你写代码 - 体验 Github Copilot

ai 程序员在线体验

前几天在群里看到有大神分享 Copoilot AI 写代码,看了几个截图有点不敢相信自己的眼睛。今天赶紧自己也来体验一下 Copoilot AI 写代码到底有多神奇。

申请

现在 Copoilot 还处在预览阶段,想要体验需要先申请。等待大概一晚会收到邮件提示申请试用成功,然后就可以安装 copilot 的插件进行体验了。
申请的地址为 https://copilot.github.com/ 。

安装插件

打开 VSCode 的扩展面板,搜 copilot 找到插件点击安装。
6084b8336603ef9036f2242eed8faaaa.png安装完成后会提示你需要登录 github 进行授权。这一步在国内可能会校验失败,多尝试几次就会成功。
a34eaaab05e4450909bcadc23f6ac71c.png

开始体验

安装完插件后就可以开始体验了。使用其实来也非常简单,你只需要写下注释比如 // 比较两个数的大小 ,然后回车,稍等一会就 copilot 就会把建议代码给列出来。或者直接写下方法名,比如 function compareDate () { 写下第一个 { 的时候按下回车,稍等一会 copilot 就会给出建议代码,按一次 tab 就会生成代码。
copilot 可能会给出多种建议的代码,使用 alt + [ 或者 alt + ] 可以进行切换。
下面让我们来测试一下 copilot 生成的代码到底怎么样。

测试JavaScript

新建一个名为 copilottest.js 的文件。
先来一个简单的,实现一个快速排序,这种标准的算法生成起来应该没啥难度。直接 // 快排 回车就生成出来了,看了下代码,还不错哈。

  1. //快排
  2. function quickSort(arr, left, right) {
  3.     if (left < right) {
  4.         var pivotIndex = partition(arr, left, right);
  5.         quickSort(arr, left, pivotIndex - 1);
  6.         quickSort(arr, pivotIndex + 1, right);
  7.     }
  8. }

再来一个比较常用的字符串转时间,并且顺便生成一个测试方法。

  1. //把格式为"yyyy-MM-dd"的字符串转换为Date类型
  2. function stringToDate(str) {
  3.     var date = eval('new Date(' + str.replace(/\d+(?=-[^-]+$)/,
  4.         function (a) { return parseInt(a, 10) - 1; }).match(/\d+/g) + ')');
  5.     return date;
  6. }
  7. //测试 stringToDate 方法是否正确
  8. function testStringToDate() {
  9.     var str = "2017-01-01";
  10.     var date = stringToDate(str);
  11.     alert(date);
  12. }

再来带判断逻辑的:比较两个数字,如果第一个数字大于第二个数字,则返回“微信”否则返回"qq"。
这个考验一下 copilot 对中文的理解。

  1. //比较两个数字,如果第一个数字大于第二个数字,则返回“微信”否则返回“qq
  2. function compare(num1, num2) {
  3.     if (num1 > num2) {
  4.         return "微信";
  5.     } else {
  6.         return "qq";
  7.     }
  8. }

再来一个判断时间是星期几的函数

  1. //根据时间判断星期几
  2. function getWeek(date) {
  3.     var week;
  4.     switch (date.getDay()) {
  5.         case 0:
  6.             week = "星期日";
  7.             break;
  8.         case 1:
  9.             week = "星期一";
  10.             break;
  11.         case 2:
  12.             week = "星期二";
  13.             break;
  14.         case 3:
  15.             week = "星期三";
  16.             break;
  17.         case 4:
  18.             week = "星期四";
  19.             break;
  20.         case 5:
  21.             week = "星期五";
  22.             break;
  23.         case 6:
  24.             week = "星期六";
  25.             break;
  26.     }
  27.     return week;
  28. }

再来试试 http 请求写的怎么样,访问一下百度把html返回。

  1. //返回baidu.com的html
  2. function getBaiduHtml() {
  3.     var url = "http://www.baidu.com";
  4.     var xhr = new XMLHttpRequest();
  5.     xhr.open("GET", url, false);
  6.     xhr.send();
  7.     var html = xhr.responseText;
  8.     return html;
  9. }

JavaScript 操作 html 也很常见,那么试试查找元素怎么样

  1. //查找页面上所有的div
  2. function findAllDiv() {
  3.     var divs = document.getElementsByTagName("div");
  4.     return divs;
  5. }
  6. //查找所有页面上class=user的input元素
  7. function findAllUserInput() {
  8.     var inputs = document.getElementsByClassName("user");
  9.     return inputs;
  10. }

再来试试 http 提交对象怎么样

  1. //请求一个url,post一个json对象
  2. function postJson(url, json) {
  3.     var xhr = new XMLHttpRequest();
  4.     xhr.open("POST", url, false);
  5.     xhr.setRequestHeader("Content-Type""application/json");
  6.     xhr.send(JSON.stringify(json));
  7.     var response = xhr.responseText;
  8.     return response;
  9. }

来个有点难度的,爬取博客园首页的文章的标题

  1. //爬取cnblogs.com所有文章的标题
  2. function getAllArticleTitle() {
  3.     var url = "http://www.cnblogs.com/";
  4.     var xhr = new XMLHttpRequest();
  5.     xhr.open("GET", url, false);
  6.     xhr.send();
  7.     var html = xhr.responseText;
  8.     var reg = /<a href="(.*?)" target="_blank">(.*?)<\/a>/g;
  9.     var result = html.match(reg);
  10.     return result;
  11. }

测试一下使用某个类库来完成一些操作

  1. // 使用hls.js播放视频
  2. function playVideo(video) {
  3.     var hls = new Hls();
  4.     hls.loadSource("http://www.w3school.com.cn/i/movie.mp4");
  5.     hls.attachMedia(video);
  6.     hls.on(Hls.Events.MANIFEST_PARSED, function () {
  7.         video.play();
  8.     });
  9. }

看到这里有没有被震惊到?以上代码全部是 copilot 自动生成的,我仅仅是写下了几行注释。可以看到注释其实写的也很简单,copilot 生成的代码基本上都符合注释的内容,可以说 copilot 对中文注释的理解非常到位。如果你的注释写的更加详细,那么代码就会更加符合你的要求。

测试.NET C#

让我们在来试试 C# 代码的提示功能怎么样。新建一个文件名为 copilottest.cs 的文件。
先来一个简单的,比较两个时间的大小。

  1. //比较两个时间的大小
  2.     public static bool CompareTime(string time1, string time2) {
  3.         DateTime dt1 = DateTime.Parse(time1);
  4.         DateTime dt2 = DateTime.Parse(time2);
  5.         if (dt1 > dt2) {
  6.             return true;
  7.         } else {
  8.             return false;
  9.         }
  10.     }

做为 CRUD boy 自然要测试下数据库操作。
先来试试使用EF来查找用户

  1. //使用EF查询用户
  2.     public static List<User> GetUserList() {
  3.         using (var db = new CopiloteContext()) {
  4.             return db.User.ToList();
  5.         }
  6.     }

再来试试使用 dapper 的写法

  1. //使用dapper查询用户    
  2.     public static List<User> GetUserListDapper() {
  3.         using (IDbConnection db = new SqlConnection("server=.;database=copilote;uid=sa;pwd=123456")) {
  4.             return db.Query<User>("select * from user").ToList();
  5.         }
  6.     }

让我们加大难度,来个连接跟分组统计人数

  1. //查询2020年每个班级学生的人数
  2.     public static void GetClassStudentCount() {
  3.         using (IDbConnection db = new SqlConnection("server=.;database=copilote;uid=sa;pwd=123456")) {
  4.             db.Query<ClassStudentCount>("select class.name as classname,count(student.id) as studentcount from student left join class on student.classid=class.id where class.year=2020 group by class.name").ToList();
  5.         }
  6.     }

让它自动生成改删查操作

  1. class student {
  2.         public int id { get; set; }
  3.         public string name { get; set; }
  4.         public int classid { get; set; }
  5.     }
  6.     //student的新增操作
  7.     public static void AddStudent(student s) {
  8.         using (IDbConnection db = new SqlConnection("server=.;database=copilote;uid=sa;pwd=123456")) {
  9.             db.Execute("insert into student(name,classid) values(@name,@classid)", s);
  10.         }
  11.     }
  12.     //student的更新操作
  13.     public static void UpdateStudent(student s) {
  14.         using (IDbConnection db = new SqlConnection("server=.;database=copilote;uid=sa;pwd=123456")) {
  15.             db.Execute("update student set name=@name,classid=@classid where id=@id", s);
  16.         }
  17.     }
  18.     //student的删除操作
  19.     public static void DeleteStudent(int id) {
  20.         using (IDbConnection db = new SqlConnection("server=.;database=copilote;uid=sa;pwd=123456")) {
  21.             db.Execute("delete from student where id=@id"new { id = id });
  22.         }
  23.     }

再来试试生成 ASP.NET MVC 的 action 方法。

  1. class UserController : Controller {
  2.         //从 request 获取 name 参数查询用户,如果查到就返回否则返回状态404
  3.         public ActionResult GetUser(string name) {
  4.             User user = UserService.GetUser(name);
  5.             if (user != null) {
  6.                 return Json(user);
  7.             } else {
  8.                 return HttpNotFound();
  9.             }
  10.         }
  11.         //使用[FromBody]映射成user对象,并保存到数据库
  12.         public ActionResult AddUser([FromBody]User user) {
  13.             UserService.AddUser(user);
  14.             return Json(user);
  15.         }
  16. }

其实我还试验了一下 JAVA 的代码,也是毫无压力,这里就不贴出来了。

总结

到这里我已经有点无话可说了。copilot 深深的震撼了我,感觉 copilot 对注释的理解根据人类无差别,生成的代码基本是符合要求的,即使有一点问题那也是因为没有上下文的原因, copilot 只能生成最常用的语句。copilot 虽然只是生成一个个短小的函数,但是再复杂的系统不都是由无数个简单的函数组成的吗?况且 copilot 还只是预览版,如果再迭代几个版本,AI 再训练几年那么是不是可以有无限可能。到这里心里略有一点忧伤,以后一些低级代码工作很可能被 AI 代替,程序员的入门门槛进一步降低,这到底是好事还是坏事呢?

关注我的公众号一起玩转技术

87067623e11cb6fed175fcc5ff44fb8a.png
声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/小惠珠哦/article/detail/986516
推荐阅读
相关标签
  

闽ICP备14008679号