20190512 前端开发日报

装逼的最高境界—一行js代码完成一个简易版的贪吃蛇游戏；vue.js应用开发笔记；【CuteJavaScript】GraphQL真香入门教程；纯原生Ajax2.0（不用FormData）实现表单及文件上传；前端面试题及答案 – 浏览器篇；开发函数计算的正确姿势——支持 ES6 语法和 webpack 压缩；前端数据Mock；Javascript & Angular 踩坑合辑

1. 装逼的最高境界—一行js代码完成一个简易版的贪吃蛇游戏有些奇淫技巧玩好的话，就能提升自己的逼格，这不，一行js代码实现一个贪吃蛇小游戏就成了装逼到了最高境界嘛！代码如下:
2. vue.js应用开发笔记 编辑推荐: 本文来自博客园，本文主要涉及到的东西有vue、vue-router、vuex、axios以及nodejs一些后台应用开发，希望对您的学习有所帮助。 一、vue.js 1、项目搭建使用vue-cli脚手架，首先必须安装vue、vue-cli：cnpm i vue vue-cli -g，全局安装完成之后我们便可以使用vue-cli脚手架进…
3. 【CuteJavaScript】GraphQL真香入门教程欢迎关注我的 个人主页 && 个人博客 && 个人知识库 && 微信公众号“前端自习课”
4. 纯原生Ajax2.0（不用FormData）实现表单及文件上传 通常我们用Ajax上传文件的时候都会用到 FormData ,这种方式比较简单。今天介绍一种用纯Ajax上传文件的方式 表单数据可以用一下四种方式进行发送: 1.method:POST,enctype:application/x-www-form-urlencoded (默认编码方式); 2.method:POST,enctype:text/plain; 3.method:POST,enctype:multipar…
5. 前端面试题及答案 – 浏览器篇这篇文章并不是最全的前端面试题（没有最全，只有更全），只是针对自己面试过程中遇到的一些难题、容易忽略的题做一个简单的笔记，方便后面有面试需要的小伙伴们借鉴，后续内容会不定时更新，有错误之处希望大家…
6. 开发函数计算的正确姿势——支持 ES6 语法和 webpack 压缩
7. 前端数据Mock 文章目录 前言 对于前后端分离的开发，两边的开发进度不同是常有的事情，对于已经开发的功能，如何快速有效地模拟接口的请求是提高开发效率的关键，下面来讲讲几种数据 mock 的方法。 http-server 如果我们只是测试一段 JS 代码在对应数据下是否能够跑通，那么我们可以直接使用 no…
8. Javascript & Angular 踩坑合辑 业务场景：页面中包含多个独立的下拉框，需要同时加载下拉列表。 import {Observable} from ‘rxjs/Observable’; import ‘rxjs/add/observable/forkJoin’; import ‘rxjs/add/observable/merge’; import ‘rxjs/add/observable/zip’; let http1 = this.http.get(‘url’); let http2 = this.http.get(‘url’); let http3 = …
9. 从布局看css基础css布局 学习css的主要目的是为了记住各种属性么？NO，最重要的是理解css的定位机制与盒子模型。 接下来，从布局的角度来学习css的定位机制和盒子模型，学习之前还是先来提几个问题 1.进行css布局前为什么要学习…
10. 系统的讲解 – PHP WEB 安全防御SQL注入攻击是通过WEB表单提交，在URL参数提交或Cookie参数提交，将怀有恶意的“字符串”，提交给后台数据库，欺骗服务器执行恶意的SQL语句。
11. 使用 Node.js 写一个代码生成器
12. 【前端刷题笔记02】字节跳动2019面试题客户端请求 -> 服务器响应该请求 -> 服务器确认数据传送完毕， 发送关闭连接的响应 -> 客户端发送响应，在2MSL内未收到回复则视为服务器端已收到该响应并关闭连接接口，客户端关闭连接。
13. Vue项目打包后动态获取自定义变量 一般使用 Vue 项目连接后端请求，使用的 axios import axios from ‘axios’ export const CMSAPI = axios.create({ baseURL: "http://localhost:8080", timeout: 30000, }); 复制代码 axios 中的 baseURL 一般是访问地址 Vue 项目打包后，如果我们需要修改这个 baseURL 就需要修改代码重新 buil…
14. 使用CSS实现逼真的水波纹点击效果虽然webkit具有遮罩的能力（webkit mask），不过webkit虽然强大，但在跨浏览器上总是它的罩门，况且在性能上也是往往会造成困扰（这也是为什么chrome要这么吃资源了），因此撇开webkit不谈，我们该用什么方法，才…
15. webpack4-05-配置vue相关 webpack解析vue会用到的两个包分别为： vue-loader 、 vue-template-compiler 安装： npm i vue-loader vue-template-compiler -D 复制代码 vue-loader 用于加载 .vue 后缀文件 vue-template-compiler 用于编译模板 还有我们的主角 vue ： npm i vue -S 复制代码 注意： …
16. 前端面试题及答案 – CSS篇这篇文章并不是最全的前端面试题（没有最全，只有更全），只是针对自己面试过程中遇到的一些难题、容易忽略的题做一个简单的笔记，方便后面有面试需要的小伙伴们借鉴，后续内容会不定时更新，有错误之处希望大家…
17. [leetcode-JavaScript]—19.删除链表的倒数第N个节点 给定一个链表，删除链表的倒数第 n 个节点，并且返回链表的头结点。 示例： 给定一个链表: 1->2->3->4->5, 和 n = 2. 当删除了倒数第二个节点后，链表变为 1->2->3->5. 复制代码 说明： 给定的 n 保证是有效的。 思考 这道题要用双指针来实现。先用fast指针前进n，然后让slow从h…
18. ES6专题— class与面向对象编程在ES5中，我们经常使用方法或者对象去模拟类的使用，并基于原型实现继承，虽然可以实现功能，但是代码并不优雅，很多人还是倾向于用 class 来组织代码，很多类库、框架创造了自己的 API 来实现 class 的功能。
19. 为管理复杂组件状态困扰？试试 vue 简单状态管理 Store 模式 在 vue 中，通信有几种形式： 父子组件 emit/on vuex 中共享 state 跨组件 EventBus 文档中的提到的 Store 模式却鲜有人去使用讨论。笔者在研究 ElementUI的Table组件的代码组织方式，以及在 自己 ElementUI 表单编辑项目 中实践之后觉得其在复杂组件组织上非常有用，是一个被忽视的组件通信方法。 …
20. css3中的变形（transform）、过渡（transition）、动画（animation）属性讲解css3中制作动画的几个属性：css3中的变形（transform）、过渡（transition）、动画（animation）。
21. 深入学习js之——创建对象的各种方式以及优缺点 #12 深入学习js系列是自己阶段性成长的见证，希望通过文章的形式更加严谨、客观地梳理js的相关知识，也希望能够帮助更多的前端开发的朋友解决问题，期待我们的共同进步。 如果觉得本系列不错，欢迎点赞、评论、转发，您的支持就是我坚持的最大动力。 写在前面 这篇文章将的是创建对象的优缺点以及各种方式。 但是注…
22. 一步步教你用 WebVR 实现虚拟现实游戏在本教程中，我们将创建三维对象并为它们添加简单的交互。此外，你还可以学到如何在客户端和服务器之间建立简单的消息传递系统。
23. 理解JavaScript的作用域 作用域 作用域嵌套与作用域链 查询异常 词法作用域（静态作用域） 函数作用域 全局作用域 块级作用域 变量提升机制 函数优先 作用域 是什么？ 作用域是指程序源代码中定义变量的区域。 有什么用？ 作用域规定了如何查找变量，也就是确定当前执行代码…

关注github前端日报 订阅精彩文章

前端日报栏目数据来自码农头条，每日分享互联网上热门的前端开发、移动开发、设计、资源和资讯等，为开发者提供动力，如果觉得内容对你有用，记得分享给你的小伙伴。进入码农头条查看更多