- 博客(334)
- 资源 (1)
- 收藏
- 关注
RSS订阅原创 mongoose
介绍mongoose可以通过node.js来对mongo数据库进行操作mongoose是一个对象文档模型库，对mongoDB模块进行了优化封装，提供了更多的功能用于把机构化的模式应用到一个mongoDB集合中，并且提供了验证与类型转换好处为文档创建一个模式结构(Schema)对模型中的对象或者文档进行验证数据可以通过类型转换为对象模型可以使用中间件来应用业务逻辑挂钩比Node原生的mongoDB驱动更容易在mongoose中提供了三个新的对象，分别是Schema、Model、Doc
2021-07-10 15:36:38
155
原创 文件系统fs其他方法
验证文件是否存在fs.existsSync(path): 验证文件是否存在。path为要验证的文件路径返回值为true与falseconst f = fs.existsSync("test.txt")console.log(f)获取文件状态fs.stat(path, callback)fs.statSync(path)在回调函数中存在两个参数err与stat。stat中保存了文件的状态fs.stat("test.txt", function (err, stat) { if
2021-07-10 15:35:15
428
原创 Node.js的文件读取
简单文件的读取同步简单文件读取。使用fs.readFileSync(path[, options])异步简单文件读取。使用fs.readFile(path[, options], callback)path：要读取的文件路径options：读取的选项callback：回调函数。回调函数的参数为err与dataerr：读取错误时赋值data：当成功读取之后，返回文件内容，以buffer格式返回当读取的不是文本文件，而是视频或者图片等格式时，需要使用buffer格式，当使用string格式会
2021-07-10 15:34:49
215
原创 Node.js的文件写入
文件系统文件系统是Node环境中来操作操作系统中的文件使用Node来操作文件时需要使用node环境中的js模块，js模块为核心模块，直接引入使用即可同步文件写入同步文件的打开。使用fs.openSync(path, flags[, mode])path：要打开文件的路径flags：打开文件要做的操作类型。r-只读，w-可写mode：设置文件的操作权限，一般不传该方法有一个返回值fd，该返回值为一个文件描述符，用来向写入函数传递同步文件的写入。使用fs.writeSync(fd,
2021-07-10 15:34:12
215
原创 Buffer
BufferBuffer缓冲区的结构与数组相似，但是Buffer缓冲区中存储的是二进制文件，而数组无法存储二进制文件使用Buffer不需要引入任何文件，直接使用即可buffer保存的是二进制文件，但是在显示的时候会将二进制转换为十六进制buffer会将二进制文件保存到内存中，每一个字母占用一个字节，但是对于汉字，每一个汉字会占用三个字节Buffer.from(str)：将指定的字符串保存到buffer中去Buffer.alloc(length)：创建长度为length的buffer对象，超出的
2021-07-10 15:33:37
280
原创 package.json与npm
package.jsonCommonJS的包规范允许我们将一组相关的模块组合到一起，形成一组完整的工具CommonJS的包规范由包规范和包描述文件两个部分组成包结构用于组织包中的各种文件而包描述文件，描述包的相关信息，以供外部读取分析包结构包含以下结构：package.json:描述文件bin:可执行二进制文件lib:js代码doc:文档test:单元测试NPMnpm的全称为node package manager，指的是node的包管理工具npm帮助完成第三方模块的发
2021-07-10 15:33:06
118
原创 node.js的模块化
引入在Node环境中引入js文件时，需要使用关键字require使用require来引入js文件。需要注意的是，通过require引入的js文件时，存在一个返回值，该返回值为一个对象，对象中的属性为js文件中的所有定义的属性通过访问对象的属性可以得到js文件中定义的属性需要注意的是，当导入js文件时，需要使用./或者…/的相对路径导出在Node中，每一个js文件都代表一个独立的作用域，无法直接被其他文件所引入，使用exports关键字来导出需要被引用的属性模块module.jsexp
2021-07-10 15:31:46
69
原创 Promise.all
Promise.all()接受一个promise对象的数组，当所有promise对象都变成resolve状态或者有一个变成reject状态时，才会调用then方法Promise.all()接受一个promise实例的数组或者Iterator接口的对象如果元素不是promise对象，使用promise.resolve转为Promise对象Promise.all()的返回值也是一个Promise对象实现Promise.all方法 function promiseAll(promises) { .
2021-07-10 15:30:46
187
原创 深拷贝与浅拷贝
定义在进行数据的拷贝时，首先需要注意数据的类型是基本数据类型还是引用数据类型在拷贝基本数据类型时，不需要考虑浅拷贝还是深拷贝，不论是浅拷贝还是深拷贝，修改复制后的数据不会影响原数据但是引用数据类型不是，当修改拷贝之后的数据时，会对原数据产生影响，所以需要使用深拷贝来避免原始数据的改变拷贝方法浅拷贝直接使用=赋值Object.assign()Array.prototype.slice()Array.prototype.concat()深拷贝JSON.parse(JSON.s
2021-07-04 15:11:59
73
原创 ES6扩展
数组扩展Array.from(arr): 将伪数组对象或者是可遍历对象转为数组类型Array.of(…value): 将一系列值转为一个数组find(function(value, index, arr) {return true}): 找出第一个符合条件返回true的值findIndex(function(value, index, arr) {return true}): 找出第一个符合条件返回true的下标 // Array.from(arr) let btns =
2021-07-04 15:11:25
56
原创 class
特点在ES6中，出现了新的关键字class，用来创建一个类。通过class关键字实现类的实现或者继承在类中使用constructor来定义构造方法通过new来创建对应的实例对象通过extends继承父类，使用super方法实现父类构造方法的调用可以重写父类中的一般方法 class Person { constructor(name, age) { this.name = name; this.age = age;
2021-07-04 15:10:44
70
原创 async与await
概念async与await是在ES7中提出的异步函数用来解决异步回调的问题，同步流程表达异步操作async与await为Generator函数的语法糖。async代表Generator中的*，await代表yield特点不需要像Generator函数一样，为了执行必须去调用next方法。遇到await时等待，当前异步操作完成之后会自动向下执行返回的是Promise对象，可以使用then来执行下一步操作 async function testAsync() {
2021-07-04 15:10:11
81
原创 Generator
概念ES6提供的解决异步编程的方案之一Generator函数是一个状态机，内部封装了不同状态的数据用来生成遍历器对象惰性求值。可以暂停函数，yield可以暂停函数，而next方法可以启动函数，返回值为yield之后的返回结果特点function与函数名之间有一个符号*内部使用yield来定义不同的状态generator函数返回的是指针对象，而不会执行函数内部逻辑调用next方法会从函数内部逻辑开始执行，遇到yield就停止，返回{value:yield之后的表达式结果/undefin
2021-07-04 15:09:41
61
原创 Iterator
概念iterator是一种接口机制，为各种不同的数据结构提供统一的访问机制作用为各种数据结构，提供一个统一的、简便的访问接口使得数据结构的成员能够按某种次序排列Iterator接口主要供for of消费工作原理创建一个指针对象，指向数据结构的起始位置第一次调用next方法，指针自动指向数据结构的第一个位置接下来不断调用next方法，指针自动后移，直到指向最后一个成员每调用一次next方法，都会返回一个对象。对象包含value与done两个属性，value为指针所指向成员的值，而
2021-07-04 15:09:06
75
原创 Symbol
概念Symbol是在ES6中新定义的一个原始数据类型，与Number、String、Boolean、null、undefined同为原始数据类型特点Symbol属性对应的值是唯一的，可以解决命名冲突问题Symbol不能够与其他数据进行运算，包括字符串之间的拼接for in与for of无法遍历Symbol属性 // 创建Symbol let symbol = Symbol() let stu = { username: "测试名称", ag
2021-07-04 15:05:08
61
原创 bootstrap的flex布局
基本布局添加.d-flex与.d-flex-inline开启flex弹性布局。其中.d-inline-flex代表内联样式的flex布局.flex-row为水平布局，从左到右。.flex-row-reverse代表翻转水平布局，从右向左.flex-column为垂直布局，从上到下。.flex-column-reverse翻转垂直布局，从下到上.justify-content-*实现水平排列子元素，*可以为start(顶端对齐),end(底端对齐),center(居中对齐),between(两端对齐
2021-07-04 15:03:01
1280
原创 bootstrap公共样式
浮动相关在按钮标签中添加.close类与内容×来实现关闭按钮的显示为类添加.float-left、.float-right实现元素的左浮动与右浮动，而.float-none会默认不显示浮动效果为了清除浮动，可以在浮动的父元素中添加类.clearfix来实现清除浮动的效果.float-left与.float-right也可以实现响应式布局，只要输入代表屏幕大小的关键字就可以。例如：.float-md-left添加类.text-hide可以隐藏元素内容，但是SEO仍然可以识别到该
2021-07-04 15:02:37
117
原创 Bootstrap的颜色与边框
颜色使用.text-实现特定的颜色，其中可以为success,danger,warning,primary,secondary,light,dark,muted,white,black其中white与black还可以设置为text-white-50，text-black-50,分别表示颜色的一半使用.text-*也可以实现超链接的点击与悬停，但是white与muted不支持.bg-可以实现背景颜色的设置，其中与文本颜色一致，多一个transparent，用来设置背景色为透明边框使用.bor
2021-07-04 15:00:00
2643
原创 Bootstrap表格样式
为table元素添加.table类，可以实现Bootstrap中的表格样式显示添加.table-dark后会将表格的主题变为暗黑色添加.table-striped可以实现表格的条纹状显示，也可以在暗黑色中显示在<thead>上添加.thead-light或者.thead-dark可以将表头设置为明亮或者暗黑默认下，表格的边框显示不完全，使用.table-bordered设置完全边框，包括行边框与列边框使用.table-borderless去掉表格中的所有边框.table-hover.
2021-07-03 09:15:47
501
原创 Bootstrap代码与图文
代码样式使用<code>元素，将代码放入其中，会默认将其中的文本识别文代码但是无法识别其中的特殊符号与空格、回车等字符，在<code>外层添加<pre>就可以实现识别特殊字符在代码区域添加.pre-scrollable，可以实现默认区域滚动，默认高度为350px使用<var>标签识别变量使用<kbd>识别键盘输入使用<samp>识别实例<pre class="pre-scrollable" style="widt
2021-07-03 09:15:08
450
原创 Bootstrap内容排版
标题类在Bootstrap中使用标题标签<h1>~<h6>语义不变，仍然是代表不同的标题，但是标题的样式发生了变化当不使用h1~h6的标签，而是一般的标签时，添加.h1~.h6的类名，也可以实现相同的功能添加.text-muted类名，使得当前元素变为副标题使用.display-1~4，可以添加4中不同的大标题，比一般的h1~h6更大，代表着更大标题<h1>标题名称</h1><h2>标题名称</h2><h3>
2021-07-03 09:13:30
187
原创 Bootstrap对齐与排列
对齐行对齐添加align-items-start类，实现按照行顶部对齐align-items-center，实现按照行居中对齐align-items-end，按照行底部对齐align-self-start，对每列分别进行对齐，实现按照顶部进行对齐align-self-center，按照行进行居中对齐align-self-end，实现按照行的底部进行对齐align-items一半作用于行，对整个行进行对齐；而align-self时对于每列进行行对齐<div class="c
2021-07-03 09:10:48
2282
原创 Bootstrap元素的显示与隐藏
在Bootstrap中，为了更好的适配移动设备，需要对页面中不重要的内容设置元素的显示与隐藏当在大屏幕中，可以将那些并不重要的组件进行显示，而在小屏幕中，为了节省空间，需要对一些元素进行隐藏为元素添加类d-none，将在所有设备中隐藏该元素，d-*-none，将为特定尺寸的屏幕进行隐藏元素。例如：d-sm-none，将在小屏幕中隐藏元素但是需要注意的是，Bootstrap默认移动端优先，也就是会从最小的设备开始适配，然后将所有大于的设备也进行适配当设置了小屏幕隐藏之后，默认小屏幕以及之上的所有屏幕.
2021-07-03 09:09:34
2355
原创 Bootstrap栅格布局
栅格布局基本概念在Bootstrap中引入了栅格布局，将页面分成类似于表格一样的布局每一行由12列组成，可以通过设置列所占有的列的个数来设置列的宽度支持响应式布局，分别有5种响应尺寸，分别对应不同的设备宽度使用flexbox流式布局来实现页面布局使用div来实现容器、行、列的布局栅格布局具体操作首先布置一个容器div用来存放栅格，为div添加container类实现容器为子元素添加row类实现行的布局，而列的布局使用col-*来实现当类名为container-fluid的话，默认占据
2021-07-03 09:03:40
1162
原创 实现bind方法与apply方法
bind()方法bind()方法有两个参数。第一个参数调用绑定函数时作为 this 参数传递给目标函数的值，第二个参数当目标函数被调用时，被预置入绑定函数的参数列表中的参数例如：function fn(a, b, c) { return a + b + c;}var _fn = fn.bind(null, 10);var ans = _fn(20, 30); // 60实现bind方法 Function.prototype.myBind = function (that,
2021-07-03 09:01:16
143
原创 js实现鼠标拖拽效果
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>js实现鼠标拖拽</title> <style> div { position: absolute; width: 100px; height: 100px;
2021-07-03 09:00:48
204
原创 原型链与继承
原型链JS中的每个对象都有一个属性__proto__，该属性会指向对象的原型JS中每个函数对象不仅有__proto__属性，还有一个prototype属性当函数对象作为构造函数创建实例时，prototype属性会被当做对象的__proto__属性函数对象拥有__proto__属性是因为：函数对象是Function对象的实例对象原型链就是由不同的原型所连接的一条链，不同对象在查找属性或者方法时，会先在本身查找，找不到再向原型查找，直到找到原型的起点Object对象构造函数new原理 /
2021-07-03 08:59:42
81
原创 使用Promise封装ajax方法
const ajax = function (obj) { return new Promise((resolve, reject) => { let method = obj.method || "GET"; let xhr; // 创建xhr if (window.XMLHttpRequest) { xhr = new XMLHttpRequest(); } else { xhr = new ..
2021-07-03 08:57:02
172
原创 浅拷贝与深拷贝
数据存储方式在JS中数据类型有基本数据类型（string, number, boolean, null, undefined, symbol）与引用数据类型（数组，函数，对象）基本数据类型都存放在栈内存中，栈内存中会存放变量的名与值拷贝该基本数据类型会在栈内存中开辟新的空间存放变量的名与值。修改原变量不会影响新的变量而引用数据类型会使用栈内存与堆内存来存放变量，变量的名存放在栈内存中，值存放在堆内存中，栈内存中会存放堆内存中的地址此时拷贝引用数据类型的变量，会在栈内存中开辟空间，存放变量的名，而
2021-06-28 19:42:45
50
原创 Gulp基础
概念Gulp是与Grunt类似的前端项目构建工具，也是基于Nodejs的自动任务运行器与Grunt一样，可以实现文件的压缩、合并，对js代码语法进行检查等功能Gulp可以实现异步多任务，更易于使用使用步骤全局安装gulp-clinpm install -g gulp-cli局部安装gulpnpm install gulp --save-dev配置gulpfile.js文件let gulp = require("gulp");// 创建任务// gulp.task
2021-06-28 19:42:04
53
原创 Grunt
概念Grunt是一个前端自动化构建工具，一个基于nodeJS的命令行工具Grunt是一个任务运行器，配合其丰富强大的插件可以实现合并文件、压缩文件以及语法检查、less/sass预编译处理等功能使用全局安装grunt-clinpm install -g grunt-cli安装gruntnpm install grunt --save-dev配置Gruntfile.js文件，该文件是使用Grunt所必须的文件module.exports = function(grunt
2021-06-28 19:41:32
107
原创 AMD规范与require.js
AMD规范AMD是"Asynchronous Module Definition"的缩写，意思就是"异步模块定义"它采用异步方式加载模块，模块的加载不影响它后面语句的运行。所有依赖这个模块的语句，都定义在一个回调函数中，等到加载完成之后，这个回调函数才会运行AMD也采用require()语句加载模块，但是不同于CommonJS，它要求两个参数：require([module], callback)第一个参数[module]，是一个数组，里面的成员就是要加载的模块；第二个参数callback，则是加
2021-06-28 19:40:55
273
1
原创 去除掉数组中重复的元素
遍历数组中的每一个元素，将数组中的元素存在对象的属性中，判断对象中是否存在该元素 function distinct(arr) { let obj = {}; let result = []; arr.forEach(function (value, index) { if (!obj[value]) { obj[value] = true; result.push(value.
2021-06-28 19:40:24
44
原创 实现一个sleep函数
sleep函数指的是等待一段时间之后才去执行函数使用Promise const sleep = (time) => { return new Promise((resolve) => { setTimeout(resolve, time); }); }; sleep(1000).then(() => { console.log("abc"); })使用Generator function.
2021-06-28 19:39:54
141
原创 判断数据类型
function getType(target) { // 先处理最特殊的null if (target === null) { return "null"; } // 判断是否为基本数据类型 let type = typeof target; if (type !== 'object') { return type; } // 为引用数据类型 const te...
2021-06-28 19:39:18
45
原创 函数柯里化
柯里化又称为部分求值，是把接受多个参数的函数变换成接受一个单一参数（最初函数的第一个参数）的函数，并且返回一个新的函数的技术，新函数接受余下参数并返回运算结果 function curry(func) { // 存储已存入的参数 let _args = []; function _curry(...args) { _args = _args.concat(args); if (_args.length >= .
2021-06-27 08:09:38
45
原创 观察者模式
观察者模式指的是函数自动观察数据对象，一旦对象有变化，函数就会自动执行。而 js 中最常见的观察者模式就是事件触发机制 class eventObs { // 要有一个对象，存储着它自己的触发函数。而且这个对象的触发函数可能有很多种 // 那么 handler 的属性应该是一个数组，每个数组的值都是一个函数。type1:[func1,func2...] constructor() { this.handleFunc = {}; }.
2021-06-27 08:09:01
38
原创 防抖与节流
函数防抖当一个函数被频繁触发时，为了进行优化，使用函数防抖函数防抖指的是在一段时间内，只触发一次函数当触发一次事件之后，等待一段时间之后才执行函数。当在这段时间之内，又发生了触发事件，则重新开始计时 function debounce(fn, delay) { // 定义一个定时器 let timer = null; return function () { if (timer) { // 当
2021-06-27 08:08:22
41
原创 序列化URL中的查询字符串
将URL地址中的查询字符串提取出来，并以键值对的形式保存到对象中去 function parseUrl() { let parsed = {}; // 通过location.search获取到URL地址 const url = location.search; if (url.length <= 1) { return parsed; } // 将查询字符串提取出来 .
2021-06-27 08:07:55
146
原创 前端编程题(2)
声明一个50个长度数组，再不使用循环的条件下，使得数组中的每个元素的值与它的索引想对应。即arr[0]=0,arr[1]=1 // 首先设置数组长度为51，但是使用1将每个值都连接起来之后，只会出现50个1 // 再把50个1分离放在一个数组中，则该数组的长度为50 let arr = Array(51).join("1").split("").map(function (value, index) { return index; })判断
2021-06-27 08:07:18
59
jquery-1.12.4.js
2020-06-03
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人