42384718的博客

原创 ES6中对于Set和Map的理解

Set和Map 1.Set的基本用法  ES6 提供了新的数据结构 Set。它类似于数组，但是成员的值都是唯一的，没有重复的值。  Set本身是一个构造函数，用来生成 Set 数据结构。 const s = new Set(); [2, 3, 5, 4, 5, 2, 2].forEach(x => s.add(x)); for (let i of s) { console.log(i); } // 2 3 5 4 上面代码通过**add()**方法向 Set 结构加入成员，结果表

原创 ES6中Symbol的理解和使用

什么是Symbol  Symbol是由ES6规范引入的一项新特性，它是一种新的基础数据类型，它的功能类似于一种标识唯一性的ID。通常情况下，我们可以通过调用Symbol()函数来创建一个Symbol实例： let s1 = Symbol() 或者，你也可以在调用Symbol()函数时传入一个可选的字符串参数，相当于给你创建的Symbol实例一个描述信息： let s2 = Symbol('another symbol') 由于Symbol是一种基础数据类型，所以当我们使用typeof去检查它

原创 ES6中async关键字、迭代器及生成器的用法

1.async和await什么是async？什么是await? async用于修饰函数，放置在函数的开始位置，被修饰的函数一定返回一个promise对象,简单来说就是用来简化promise创建的。 await相当于then，await关键字必须写在async函数中。async语法 async function name([param[, param[, ... param]]]) { statements }参数： name 函数名称。 param 要传递给函数的参数。 stat

原创 ES6中Promise的用法小结

promise是什么？ 回调函数真正的问题在于他剥夺了我们使用 return 和 throw 这些关键字的能力。而 Promise 很好地解决了这一切。 1. 主要用于异步计算 2. 可以将异步操作队列化，按照期望的顺序执行，返回符合预期的结果 3. 可以在对象之间传递和操作promise，帮助我们处理队列语法： new Promise( function(resolve, reject) {...} /* executor */ );  executor是带有 resolve

原创 js中部分循环的方法

对于前端的循环遍历我们知道有针对js数组的forEach()、map()、filter()、reduce()方法针对js对象的for/in语句(for/in也能遍历数组，但不推荐)针对jq数组/对象的$.each()方法在语法和参数上他们有什么不同呢？ 1.forEach: array.forEach(function(currentValue,index,arr), thisValue) 2.map: array.map(function(currentValue,index,ar

原创 Bootstrap框架基础入门

Bootstrap 介绍  Bootstrap 是非常流行的前端框架。特点是：灵活简洁、代码优雅、美观大方。它是由Twitter的两名工程师 Mark Otto 和 Jacob Thornton 在2011年开发的。  简单来说，Bootstrap 让 Web 开发更简单、更快捷。使用 Bootstrap 框架并不代表我们再开发时不用自己写 CSS 样式，而是不用谢绝大多数常见的样式。官网网站官方网站：https://getbootstrap.com/中文网站：http://www.bootcs

原创 javascript实现简单的贪吃蛇游戏

js代码：<script> var map; //地图 var snake; //蛇 var food; //食物 var timer; //定时器 var initSpeed = 200; //初始定时器时间间隔（毫秒）,间接代表蛇移动速度 var nowSpeed = initSpeed; //游戏进行时蛇移动速度 var grade = 0; //积分 v

原创 使用原生JS+Canvas实现五子棋游戏

布局+样式部分代码 ：<style type='text/css'> canvas { display: block; margin: 50px auto; box-shadow: -2px -2px 2px #efefef, 5px 5px 5px #b9b9b9; cursor: pointer; } .btn-wrap { display: flex; flex-di

原创 JS中常见的几种高阶函数

1、什么是高阶函数？  高阶函数英文叫Higher-order function。JavaScript的函数其实都指向某个变量。既然变量可以指向函数，函数的参数能接收变量，那么一个函数就可以接收另一个函数作为参数，这种函数就称之为高阶函数。 举个最简单的高阶函数 function add(x, y, f) { return f(x) + f(y); } //当调用add(-5, 6, Math.abs)时，参数x，y和f分别接收-5，6和函数Math.abs，根据函数定义，可以推导计算过程为：

原创 jQuery的基础入门

一 认识jQuery  Query是JavaScript Query的缩写形式。jQuery是一款非常优秀的JavaScript库.jQuery的设计理念是“Write Less, Do More“，即写的更少，做的更多！使用jQuery可以大大简化我们的JS代码，从而提高开发效率。  你可以从jQuery官方网站下载需要的版本，然后从本地引入到自己的项目，也可以使用CDN引入。  引用方法如下：<script src="jquery-1.12.4.js"></script>

原创 Js实现车辆管理系统

一、循环添加车辆相关的属性1. 添加车名2. 添加编号3. 添加年份4. 添加车龄5. 添加产地要求：以上所有添加的信息，不能为空；如果为空，程序提示相对应的信息，程序停止，并且恢复原始状态。（意思就是重新开始，也就是从添加车名开始）二、需求： 1. 根据刚才添加的车辆编号，进行查询，那么就存在两种业务逻辑；第一种，编号不存在，表示查询不到，提示未查询到该车辆信息。 2. 当点击查询按钮，弹窗后，直接点了取消，提示，该车辆信息不存在。 3. 当点击查询按钮，弹窗后，随便输入一个

原创 Js实现飞机大战

CSS部分的代码：<style> canvas{ border: 1px solid #000; display: block; margin: 50px auto }</style>JavaScript代码：<canvas id="canvas" width="480" height="640"></canvas> <script> // 构造函数 var canvas = document.getElemen

原创 Js数组去重常用的几种方法

1、利用ES6 Set去重（ES6中常用）function unique (arr) { return Array.from(new Set(arr))}var arr = [1,1,'true','true',true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,'NaN', 0, 0, 'a', 'a',{},{}];console.log(unique(arr)); //在这里插入代码片 //输出结果.

原创 关于的HTML思维导图

原创 关于Js异步加载的理解

首先了解一下Js加载的三种方式：1.阻塞加载：  平常默认使用的都是阻塞加载。例如：  阻塞加载会阻止浏览器的后续处理，停止了后续的文件的解析，执行，如图像的渲染。为了这样可以让页面先显示出来，我们通常会把要加载的js放到body结束标签之前，使得js可在页面最后加载，尽量减少阻塞页面的渲染。2.延迟加载：  延迟加载是脚本延迟到文档被完全解析和显示之后再执行。有些 js 代码并不是页面初始化的时候就立刻需要的，而稍后的某些情况才需要的，这个时候我们就可以通过延迟加载来执行这些不是立刻就需要的模块

原创 对于JS预编译的理解

对于JavaScript预编译的理解JS代码执行过程我们都知道，JS语言是一种单线程解释性语言。它是一门语言，它有它自己的执行机制。来看下吧。1. 首先，进行语法分析，语法分析就是浏览器先通栏浏览一下整体的代码有没有少写分号、单词拼错等语法的错误。2. JS预编译。本质是创建AO对象或GO对象，对其属性的操作。3. 最后解释性执行。就是一行一行的读取代码执行代码。JS预编译（AO对象及GO对象）  预编译简单理解就是，在代码执行前一刻发生的事情，我们要做到的就是弄清楚具体发生了哪些事情，是