2021年03月_夏葵sai

原创 Ajax

初识 AjaxAjax 是什么Ajax 是 Asynchronous JavaScript and XML（异步 JavaScript 和 XML）的简写Ajax 中的异步：可以异步地向服务器发送请求，在等待响应的过程中，不会阻塞当前页面，浏览器可以做自己的事情。直到成功获取响应后，浏览器才开始处理响应数据XML（可扩展标记语言）是前后端数据通信时传输数据的一种格式XML 现在已经不怎么用了，现在比较常用的是 JSONAjax 其实就是浏览器与服务器之间的一种异步通信方式使用 Ajax 可

2021-03-30 21:53:40 190

原创模版引擎--art-template

模版引擎–art-template引入 art-template<script src="https://unpkg.com/art-template@4.13.2/lib/template-web.js"></script>准备好模板<script id="tpl-students" type="text/html">{{each students}}<li>{{$value.name}}{{$value.age}}{{$value.s

2021-03-30 21:53:27 228

原创 Cookie 和 localStorage

初识 CookieCookie 是什么Cookie 全称 HTTP Cookie，简称 Cookie是浏览器存储数据的一种方式因为存储在用户本地，而不是存储在服务器上，是本地存储一般会自动随着浏览器每次请求发送到服务器在浏览器中操作 Cookie不要在 Cookie 中保存密码等敏感信息浏览器 F12 打开控制台，Application => Storage => Cookie 可查看添加 Cookie，控制台中键入命令 document.cookie 可查看 Coo

2021-03-24 21:08:50 183

原创 HTTP协议

初识 HTTPHTTP 是什么HyperText Transfer Protocol超文本传输协议HTML：超文本标记语言超文本：原先一个个单一的文本，通过超级链接将其联系起来。由原先的单一的文本变成了可无限延伸、扩展的超级文本、立体文本HTML、JS、CSS、图片、字体、音频、视频等等文件，都是通过 HTTP （超文本传输协议）在服务器和浏览器之间传输每一次前后端通信，前端需要主动向后端发出请求，后端接收到前端的请求后，可以给出响应HTTP 是一个请求-响应协议2.HTTP 请求响应

2021-03-23 16:01:36 79

原创前后端数据交互

初识前后端通信前后端通信是什么前端和后端数据交互的过程浏览器和服务器之间数据交互的过程后端向前端发送数据访问页面前端向后端发送数据用户注册前后端通信的过程与概念解释前后端通信的过程前后端的通信是在‘请求-响应’中完成的概念解释前端：浏览器端客户端：只要能和服务器通信的就叫客户端命令行工具： curl http://www.imooc.com后端：服务器端前后端通信方式使用浏览器访问网页在浏览器地址栏输入网址，按下回车HTML 的标签

2021-03-23 12:34:14 138

原创 Webpack

Webpack 是什么认识 Webpackwebpack 是静态模块打包器，当 webpack 处理应用程序时，会将所有这些模块打包成一个或多个文件什么是 Webpack模块webpack 可以处理 js/css/图片、图标字体等单位静态开发过程中存在于本地的 js/css/图片/图标字体等文件，就是静态的动态的内容，webpack 没办法处理，只能处理静态的Webpack 初体验初始化项目npm init安装 webpack 需要的包npm install --sa

2021-03-21 15:13:00 137

原创 Babel

Babel 是什么认识 Babel官网：https://babeljs.io/在线编译：https://babeljs.io/replBabel 是 JavaScript 的编译器，用来将 ES6 的代码，转换成 ES6 之前的代码使用 BabelBabel 本身可以编译 ES6 的大部分语法，比如 let、const、箭头函数、类但是对于 ES6 新增的 API，比如 Set、Map、Promise 等全局对象，以及一些定义在全局对象上的方法（比如 Object.assign/Arr

2021-03-20 13:17:07 93

原创 Module 模块

Module 是什么什么是模块模块：一个一个的局部作用域的代码块什么是模块系统模块系统需要解决的主要问题(1) 模块化的问题(2) 消除全局变量(3) 管理加载顺序export default 和对应的 import认识导出和导入导出的东西可以被导入(import)，并访问到一个模块没有导出，也可以将其倒入被倒入的代码都会执行一遍，也仅会执行一遍，即使多次倒入基本用法// 导出文件const age = 18;export default age;// 导入文件

2021-03-19 15:58:01 221

原创 Class 类

Class 是什么认识 Class类可以看做是对象的模板，用一个类可以创建出许多不同的对象Class 的基本用法类名一般首字母大写class Person { // 实例化时执行构造方法，所以必须有构造方法，但可以不写出来 constructor(name, age) { this.name = name; this.age = age; } // 一般在构造方法中定义属性，方法不在构造方法中定义 // 各实例共享的方法 speak() { console.log('s

2021-03-19 12:19:27 2554

原创 Promise

Promise 是什么认识 PromisePromise 是异步操作的一种解决方案什么时候使用 PromisePromise 一般用来解决层层嵌套的回调函数（回调地狱 callback hell）的问题Promise 的基本用法实例化构造函数生成实例对象const p = new Promise(() => {});Promise 的三种状态Promise有3种状态，一开始是 pending（未完成），执行 resolve，变成 fulfilled（resolve），已

2021-03-18 13:20:49 110

原创 ES6 的新增方法

字符串的新增方法includes()判断字符串中是否含有某些字符基本用法console.log('abc'.includes('a')); // trueconsole.log('abc'.includes('ab')); // trueconsole.log('abc'.includes('ac')); // false第二个参数表示开始搜索的位置，默认是 0console.log('abc'.includes('a')); // trueconsole.log('a

2021-03-17 13:01:53 120

原创遍历器与 for...of 循环

Iterator 是什么Iterator 的作用Iterator：遍历器（迭代器）for()[1, 2].forEachnew Set().forEach()Iterator 也是用来遍历的寻找 Iteratorconst it = [1,2][Symbol.iterator]();使用 Iteratorconst it = [1, 2][Symbol.iterator]();console.log(it.next()); // {value: 1, done: false

2021-03-16 13:31:53 120

原创剩余参数与展开运算符

剩余参数是什么认识剩余参数const add = (x, y, z, ...args) {};剩余参数的本质剩余参数永远是个数组，即使没有值，也是空数组剩余参数的注意事项箭头函数的剩余参数箭头函数的参数部分即使只有一个剩余参数，也不能省略圆括号使用剩余参数替代 arguments 获取实际参数剩余参数的位置剩余参数只能是最后一个参数，之后不能再有其他参数，否则会报错剩余参数的应用与解构赋值结合使用剩余参数不一定非要作为函数参数使用const [num, ...a

2021-03-15 16:31:40 482

原创 Set 与 Map

Set 是什么什么是 Set数组：数组是一系列有序的数据集合Set 是一系列无序、没有重复值的数据集合理解 SetSet 中不能有重复的成员Set 没有下标去标示每一个值，所以 Set 是无序的，也不能像数组那样通过下标去访问 Set 的成员const s = new Set();s.add(1);s.add(2);console.log(s);Set 实例的方法和属性方法(1) addconst s = new Set();s.add(1).add(2);cons

2021-03-15 16:30:59 72

原创 ES6 基础

constconst 就是为了那些一旦初始化就不希望重新赋值的情况设计的const 的注意事项使用 const 声明常量，一旦声明，就必须立即初始化，不能留到以后再赋值const 声明的变量，允许在不重新赋值的情况下修改它的值（引用类型）const person = { username: 'Tom' }person.username = 'Jack'; // 这种情况下的修改是可以的const 和 let 使用哪个在确实不知道用哪个时，用 const 初始化变量，这样在以后可

2021-03-13 21:00:56 91

原创正则表达式

正则表达式的创建使用 /内容/ 的语法形式，可以快速创建正则表达式也可以使用 new Regexp(‘内容’) 的形式，创建正则表达式使用 typeof 运算符检查正则表达式的类型，结果是 object元字符“元字符”是指一位指定类型的字符元字符功能\d匹配一个数字\D匹配一个非数字字符\w匹配一个单字字符（字母、数字或者下划线）\W匹配一个非单字字符\s匹配一个空白字符，包括空格、制表符和换行符.任意字符开头和结尾

2021-03-11 16:48:36 91

原创内置对象

Math四舍五入 Math.round()Math.round() 可以将一个数字四舍五入为整数Math.min() 和 Math.max()Math.min() 可以得到参数列表的最小值Math.max() 可以得到参数列表的最大值console.log(Math.max(6, 2, 9, 4)); // 9console.log(Math.min(6, 2, 9, 4)); // 2如何利用 Math.max() 求数组最大值Math.max() 要求参数必须是“罗列出

2021-03-09 12:16:38 63

原创面向对象

属性是否加引号如果对象的属性键名不符合JS标识符命名规范，则这个键名必须用引号包裹属性的访问如果属性名不符合JS标识符命名规范，则必须用方括号的写法来访问

2021-03-08 12:49:35 97

原创 BOM

BOM 是什么BOM(Browser Object Model，浏览器对象模型) 是 JS 与浏览器窗口交互的接口一些与浏览器改变尺寸、滚动条滚动相关的特效，都要借助 BOM 技术window 对象window 对象是当前JS脚本运行所处的窗口，而这个窗口中包含 DOM 结构， window.document 属性就是 document 对象在有标签页功能的浏览器中，每个标签都拥有自己的 window 对象；也就是说，同一个窗口的标签页之间不会共享一个 window 对象全局变量是 w

2021-03-05 22:07:00 93

原创 DOM 事件

什么是“事件监听”DOM 允许我们书写 JavaScript 代码以让 HTML 元素对事件做出反应什么是“事件”：用户与网页的交互动作“监听”，就是让计算机随时能够发现这个事件发生了，从而执行程序员预先编写的一些程序设置事件监听的方法主要有 onxxx 和 addEventListener() 两种常见的鼠标事件监听事件名事件描述onclick当鼠标单击某个对象ondblclick当鼠标双击某个对象onmousedown当某个鼠标按键在某个对象上被按下

2021-03-03 22:29:15 161 1

原创 DOM简介和节点操作

DOM简介DOM(Document Object Model，文档对象模型) 是JavaScript 操作 HTML 文档的接口，使文档操作变得非常优雅、简便。DOM最大的特点就是将文档表示为节点树。nodeType 常用属性值节点的 nodeType 属性可以显示这个节点具体的类型nodeType值节点类型1元素节点，例如<p> 和 <div>3文字节点8注释节点9document 节点10DTD 节点

2021-03-03 18:10:06 366

原创函数相关

函数声明的提升和变量声明提升类似，函数声明也可以被提升如果函数是用函数表达式的写法定义的，则没有提升特性函数优先提升（面试常考题）fun(); // 弹出Bvar fun = function () { alert('A');}function fun () { alert('B');}fun(); // 弹出A arguments函数内 arguments 表示它接收到的实参列表，它是一个类数组对象类数组对象：所有属性均为从 0 开始的自然数序列，并且有 leng

2021-03-02 21:30:34 110

原创 JavaScript 数组

定义数组的3种方法用方括号var arr = ['A', 'B', 'C', 'D'];var arr = new Array('A', 'B', 'C', 'D');这样也可以定义数组，但是每项都是 undefined。var arr = new Array(4);JavaScript 不限定数组中每项的类型必须一致，可以存放不同类型的数值。下标越界访问数组中不存在的项会返回 undefined，不会报错更改数组项如果更改的数组项超过了 length-1，

2021-03-02 13:25:37 208

twenj1616的博客