- 博客(33)
- 收藏
- 关注
RSS订阅原创 NODE.JS KOA2封装mongoDB数据库
封装MongoDB库首先要知道 async await 的作用await后面接一个会return new promise的函数并执行它(意思就是promise 不可以在.then()了) ---等待执行await只能放在async函数里配置 config.jslet app = { //定义数据库连接的地址 以及配置数据库 url :'mongodb://localhost:27017/', dbName : 'LXW' // tjt数据库的名称 //n
2020-09-25 21:56:24
1012
原创 理解---axios------从此走上人生巅峰
axios安装axiosnpm install axios --save引用直接script标签引用<script src="https://unpkg.com/axios/dist/axios.min.js"></script>也可以去GitHub上去观看原工程文件https://github.com/axios/axios使用发送一个最简单的请求这里我们发送一个带参数的get请求，params参数放在get方法的第二个参数中，如果没有参数get方法里可
2020-09-13 22:11:46
955
原创 JQuery中的Ajax
jQuery load() 方法jQuery load() 方法是简单但强大的 AJAX 方法。load() 方法从服务器加载数据，并把返回的数据放入被选元素中。语法：$(selector).load(URL,data,callback);必需的 URL 参数规定您希望加载的 URL。可选的 data 参数规定与请求一同发送的查询字符串键/值对集合。可选的 callback 参数是 load() 方法完成后所执行的函数名称。示例代码：<h2>jQuery and AJAX&l
2020-09-08 22:47:01
721
原创 Ajax---基本玩法
Ajax什么是Ajax“Ajax 即“Asynchronous Javascript And XML”（异步 JavaScript 和 XML），是指一种创建交互式网页应用的网页开发技术。Ajax = 异步 JavaScript 和 XML（标准通用标记语言的子集）。Ajax 是一种用于创建快速动态网页的技术。Ajax 是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术。通过在后台与服务器进行少量数据交换，Ajax 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部
2020-09-06 20:57:40
705
原创 HTTP---Redirect的应用
Redirect 的概念通过 url 访问某个路径请求资源时，发现资源不在 url 所指定的位置，这时服务器要告诉浏览器，新的资源地址，浏览器再重新请求新的 url，从而拿到资源。若服务器指定了某个资源的地址，现在需要更换地址，不应该立刻废弃掉 url，如果废弃掉可能直接返回 404，这时应该告诉客户端新的资源地址。Redirect 的使用启动服务器 node server.js，localhost:8888 访问访问时，发现 url 变成了 localhost:8888/new 了，并显示了 /
2020-08-19 20:59:06
786
原创 HTTP-内容安全策略（CSP）详细
内容安全策略（CSP），其核心思想十分简单：网站通过发送一个 CSP 头部，来告诉浏览器什么是被授权执行的与什么是需要被禁止的。其被誉为专门为解决XSS攻击而生的神器。1.前言内容安全策略 (CSP) 是一个额外的安全层，用于检测并削弱某些特定类型的攻击，包括跨站脚本 (XSS) 和数据注入攻击等。无论是数据盗取、网站内容污染还是散发恶意软件，这些攻击都是主要的手段。CSP 被设计成完全向后兼容（除CSP2 在向后兼容有明确提及的不一致; 更多细节查看这里 章节1.1）。不支持CSP的浏览器也能
2020-08-19 20:40:14
1925
原创 缓存验证Last-Modified和Etag的使用
缓存验证Last-Modified和Etag的使用介绍缓存工作示意图：浏览器创建一个请求，然后请求到达本地缓存，如果找到了则直接返回给浏览器，如果没有，可能会经过代理服务，然后去代理缓存中去找，如果命中，则直接返回，如果没有，才会到源服务器进行请求。两个验证头在http协议里面，数据的验证方式，主要有两个验证头：Last-Modified 和 Etag。Last-Modified 配合Last-Modified-Since或者If-Unmodified-Since使用，对比上次修改的时间验证资
2020-08-19 20:03:23
1333
1
原创 Cache-Control 的含义
Cache-Control 的含义可缓存性public，http 请求返回的过程当中，在 cache-control 中设置这个值，代表 http 请求返回的内容所经过的任何路径当中（包括中间一些http代理服务器以及发出请求的客户端浏览器），都可以对返回内容进行缓存操作。private，代表只有发起请求的浏览器才可以进行缓存no-cache，可以在本地进行缓存，但每次发请求时，都要向服务器进行验证，如果服务器允许，才能使用本地缓存。到期max-age=，缓存多少秒后过期，过期之后浏览器才
2020-08-19 19:59:42
1734
原创 CORS跨域限制与解除
概念CORS(跨域资源共享)是一种机制，它使用额外的 HTTP 头来告诉浏览器 让运行在一个 origin (domain) 上的Web应用被准许访问来自不同源服务器上的指定的资源。 发起请求的域与请求指向的域所在的资源不一样，就形成了跨域。 域资源常常包括 协议、域名（IP）、端口号，若均相同，就是同域，若一个不相同，则是跨域。跨域请求的安全问题标签 CORS跨域请求的限制和解决模拟跨域我们模拟一个跨域的请求，一个是8888，一个是8887//server.jsconst ht
2020-08-19 19:57:40
2736
原创 HTTP跨域与其共享机制
HTTP跨域与其共享机制什么是跨域与其共享？CORS全称为Cross-Origin Resource Sharing，被译为跨域资源共享，新增了一组HTTP首部字段，允许服务器声明哪些源站有权限访问哪些资源。跨域资源共享(CORS)是一种机制，它使用额外的 HTTP 头来告诉浏览器 让运行在一个 origin (domain) 上的Web应用被准许访问来自不同源服务器上的指定的资源。当一个资源从与该资源本身所在的服务器不同的域、协议或端口请求一个资源时，此请求就是一个跨域 HTTP 请求出于安全原因
2020-08-14 21:57:26
1072
原创 HTTP-cookie的小妙用
HTTP中的cookie什么是cookie？HTTP Cookie（也叫 Web Cookie 或浏览器 Cookie）是服务器发送到用户浏览器并保存在本地的一小块数据，它会在浏览器下次向同一服务器再发起请求时被携带并发送到服务器上。通常，它用于告知服务端两个请求是否来自同一浏览器，如保持用户的登录状态。Cookie 使基于无状态的HTTP协议记录稳定的状态信息成为了可能。Cookie 主要用于以下三个方面：会话状态管理（如用户登录状态、购物车、游戏分数或其它需要记录的信息）个性化设置（如用户自
2020-08-14 14:42:55
1013
原创 HTTP---缓存机制
彻底理解浏览器的缓存机制Web 缓存大致可以分为：数据库缓存、服务器端缓存（代理服务器缓存、CDN 缓存）、浏览器缓存。浏览器缓存也包含很多内容： HTTP 缓存、indexDB、cookie、localstorage 等等。这里我们只讨论 HTTP 缓存相关内容。在具体了解 HTTP 缓存之前先来明确几个术语：缓存命中率：从缓存中得到数据的请求数与所有请求数的比率。理想状态是越高越好。过期内容：超过设置的有效时间，被标记为“陈旧”的内容。通常过期内容不能用于回复客户端的请求，必须重新向源服务器
2020-08-13 20:40:19
815
原创 http-简单认识
B/S 结构定义浏览器-服务器（Browser/Server）结构，简称B/S结构，与C/S结构不同，其客户端不需要安装专门的软件，只需要浏览器即可，浏览器通过Web服务器与数据库进行交互，可以方便的在不同平台下工作；服务器端可采用高性能计算机，并安装Oracle、Sybase、Informix等大型数据库。B/S结构简化了客户端的工作，它是随着Internet技术兴起而产生的，对C/S技术的改进，但该结构下服务器端的工作较重，对服务器的性能要求更高。—— 维基百科URI (统一资源标志符)在电
2020-08-12 22:43:30
858
原创 javascript ES6介绍 之 新增小语法--let
简介ES6， 全称 ECMAScript 6.0 ，是 JavaScript 的下一个版本标准，2015.06 发版。ES6 主要是为了解决 ES5 的先天不足，比如 JavaScript 里并没有类的概念，但是目前浏览器的 JavaScript 是 ES5 版本，大多数高版本的浏览器也支持 ES6，不过只实现了 ES6 的部分特性和功能。ECMAScript 的背景JavaScript 是大家所了解的语言名称，但是这个语言名称是商标（ Oracle 公司注册的商标）。因此，JavaScript 的
2020-07-08 01:15:13
1379
1
原创 javascript 实现Promise.resolve/reject
实现Promise.resolve/reject这两个方法直接挂载在Promise对象身上，用于快速指定一个带有预定状态的Promise实例，由于它们的实现简单且极其相似，我将它们直接放在这里一起带过。不过，在实现之前，有一点需要注意的细节，请观察下方的代码，并思考执行结果：Promise.resolve(Promise.reject(1)).then( (v) => { console.log(0); }, (e) => { console.log(e);
2020-07-08 01:05:06
1241
原创 javascript 实现Promise.prototype.catch
实现Promise.prototype.catchcatch方法的实现非常简单，它的作用用于捕获一段Promise程序的异常，通常我们会将它放到Promise调用链的最下方。之所以说它非常简单因为这个作用已经被then方法实现了，所以我们只需要对then方法进行下包装即可：MyPromise.prototype.catch = function (onRejected) { return this.then(undefined, onRejected);};如果您没有理解上面的实现，可以返回到
2020-07-08 01:04:01
1026
原创 javascript 实现Promise.prototype.then
实现Promise.prototype.thenthen方法是Promise中最重要同时也是较为复杂的一部分逻辑，理解了then方法的执行逻辑，后面的Promise方法就显得通俗易懂了。那么首先我们还是先通过规范，将then方法的行为准则列举出来：promise 的 then 方法接受两个参数：promise.then(onFulfilled, onRejected);如果 onFulfilled、onRejected 不是函数，其必须被忽略如果 onFulfilled 是函数：
2020-07-08 01:03:15
979
原创 javascript 模拟实现 Promise
Promise解决了什么问题？这篇文章假定您已经有了些许的Promise使用经验。关于Promise解决的问题，大多数文章值提出了“回调地狱”这一观点这确实是Promise解决的一大问题，但是，关于Promise的亮点，还包括但不限于以下几方面：解决回调函数的控制反转导致的信任问题：Promise提供了针对于第三方在调用回调函数时关于错误的调用时机，错误的调用次数等方面的解决方案，具体实现可以参考《你不知道的Javascript》中卷 第二部分–第三章–3.3部分–Promise信任问题 相关内
2020-07-08 01:00:55
1266
原创 JavaScript--数组降维之五种方法
数组降维第一种// 第一种let arr = [[222, 333, 444], [55, 66, 77], {a: 1} ]arr += ''; // 222,333,444,55,66,77,[object Object]// 进行分割并返回新的数组arr = arr.split(',');// console.log(arr); // ["222", "333", "444", "55", "66", "77", "[object Object]"]第二种let arr =
2020-07-08 00:50:17
832
原创 JavaScript --- 之FormData
概述FormData类型其实是在XMLHttpRequest 2级定义的，它是为序列化表以及创建与表单格式相同的数据（当然是用于XHR传输）提供便利。2. 构造函数创建一个formData对象实例有几种方式1、创建一个空对象实例var formData = new FormData();此时可以调用append()方法来添加数据2、使用已有的表单来初始化一个对象实例假如现在页面已经有一个表单<form id="myForm" action="" method="post">.
2020-07-08 00:31:40
768
原创 nodejs 模块笔记
1、全局变量设置D:\atools\nodejs目录下新建2个文件夹，node_global 、node_modules同时记得添加环境变 D:\atools\nodejs\node_global命令行输入npm config set cache “D:\Program Files\Nodejs\node_global”npm config set prefix “D:\Program Files\Nodejs\node_cache”或者直接更改.npmrc文件（目录：C:\Users\用户名）
2020-07-08 00:23:29
816
原创 Node.js ----- 操作数据库
Nodejs 操作数据库nodejs操作数据库-增// 导包const express = require("express");var mysql = require("mysql");// 创建一个和数据库的连接var connection = mysql.createConnection({ host: "localhost", // 数据库服务器的地址 user: "root", // 账号 password: "lijiazhao123", // 密码 databas
2020-07-08 00:20:38
845
原创 JavaScript-apply与call 原生封装
//原生JavaScript封装apply方法Function.prototype.Apply = function(context) { var context = context || window var args = arguments[1] //获取传入的数组参数 context.fn = this //假想context对象预先存在名为fn的属性，如果这个对象已经有了fn这个属性我也不管了 if (args == void 0) { //没有传入参数直接执行
2020-07-08 00:10:21
836
原创 JavaScript面向对象详解（四）
JavaScript面向对象详解（四）一. 原型式继承1.1. 原型式继承的思想原型式继承的核心函数:// 封装object()函数function object(o) { function F() {} F.prototype = o return new F()}代码解析:在object()函数内部, 先创建一个临时的构造函数.然后将传递的对象作为这个构造函数的原型最后返回了这个临时类型的一个新的实例.事实上, object()对传入的对象执行了一次浅复
2020-06-21 17:10:17
863
原创 JavaScript面向对象详解（三）
JavaScript面向对象详解（三）继承是面向对象中非常重要的特性.ES5中和类的实现一样, 不能直接实现继承. 实现继承主要是依靠原型链来实现的。一. 原型链原型链是ES5中实现继承的主要手段, 因此相对比较重要, 我们需要深入理解原型链.1.1. 深入理解原型链先来回顾一下构造函数、原型和实例的关系：每个构造函数都有一个原型对象, 通过prototype指针指向该原型对象.原型对象都包含一个指向构造函数的指针, 通过constructor指针, 指向构造函数而实例都包含一
2020-06-21 17:06:14
813
原创 JavaScript面向对象(二)
JavaScript面向对象(二)一. 理解原型模式1.1. 什么是原型呢?你需要先知道一个事实:我们创建的每个函数都有一个prototype（原型）属性这个属性是一个指针，指向一个对象而这个对象的作用是存放这个类型创建的所有实例共享的属性和方法。指向的这个对象, 就是我们的所谓的原型对象.原型对象的作用:使用原型对象的好处是可以让所有对象实例共享它所包含的属性和方法。换句话说，不必在构造函数中定义对象实例的信息，而是可以将这些信息直接添加到原型对象中。我们来看看原型对象的使用
2020-06-21 17:03:20
812
原创 JavaScript面向对象(一)
JavaScript面向对象详解(一)一. JavaScript的对象1.1. 传统对象 vs JavaScript对象传统的面向对象面向对象语言的一个标志就是类类是所有对象的统称, 是更高意义上的一种抽象. 对象是类的实例.通过类我们可以创建任意多个具体的对象.在学习C++/OC/Java/Python等编程语言的时候, 都可以按照这种方式去创建类和对象.JavaScript的面向对象JavaScript中没有类的概念（ES6之前），因此我们通常称为基于对象，而不是面向对象.虽然
2020-06-21 16:59:32
692
原创 JavaScript ---深入浅出 this
一. 理解什么是----this1.1. 为什么使用this常见面向对象的编程语言中，比如Java、C++、Swift、Dart等等一系列语言中，this通常只会出现在类的方法中。也就是你需要有一个类，类中的方法（特别是实例方法）中，this代表的是当前调用对象。但是JavaScript中的this更加灵活，无论是它出现的位置还是它代表的含义。使用this有什么意义呢？下面的代码中，我们通过对象字面量创建出来一个对象，当我们调用对象的方法时，希望将对象的名称一起进行打印。如果没有this，那
2020-06-21 16:55:20
804
原创 jquery---操作DOM(节点)
jquery操作DOM(节点)创建元素 //$(htmlStr) //htmlStr：html格式的字符串 $(“<span>这是一个span元素</span>”);添加元素添加新建的元素 //方法一：将jQuery对象添加到调用者内部的最后面。 var $span = $(“<span>这是一个span元素</span>”); $(“div”).append($span); //方法二：参数
2020-06-21 16:43:54
826
原创 jquery--动画
jquery动画通过下拉菜单引入动画。jquery提供了三组动画，这些动画都是标准的、有规律的效果，jquery还提供了自定义动画的功能。显示与隐藏显示(show)与隐藏(hide)是一组动画：show方法详解： show([speed], [callback]); //speed(可选)：动画的执行时间 1.如果不传，就没有动画效果。 2.毫秒值(比如1000),动画在1000毫秒执行完成(推荐) 3.固定字符串，slow(200)、normal(400)
2020-06-21 16:43:02
791
原创 jQuery--事件机制
jQuery事件机制JavaScript中已经学习过了事件，但是jQuery对JavaScript事件进行了封装，增加并扩展了事件处理机制。jQuery不仅提供了更加优雅的事件处理语法，而且极大的增强了事件的处理能力。jQuery事件的发展历程简单事件绑定>>bind事件绑定>>delegate事件绑定>>on事件绑定(推荐)简单事件绑定click(handler) 单击事件mouseenter(handler) 鼠标进入事件mouselea
2020-06-21 16:42:21
702
原创 jQuery--操作坐标值
jQuery操作坐标值offset设置或者获取元素相对于文档document的位置。 //设置位置 $(selector).offset({left:100, top: 150}); //获取位置 $(selector).offset();注意：使用offset操作，如果元素没有设置定位(默认position:static)，则会把position修改为relative.会修改left、topposition获取相对于其最近的有定位的父元素的位置。
2020-06-21 16:41:27
974
1
原创 初识--jQuery
jQueryjQuery基础初识jQueryjQuery是什么?jQuery是一款优秀的JavaScript库,最主要的用途是用来做查询,还能让我们对HTML文档遍历和操作、事件处理、动画以及Ajax变得更加简单为什么要使用jQuery?js库：把一些常用到的方法写到一个单独的js文件，使用的时候直接去引用这js文件就可以了。（animate.js、common.js）我们知道了，jQuery其实就是一个js文件，里面封装了一大堆的方法方便我们的开发，其实就是一个加强版的comm
2020-06-16 22:55:17
1091
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人