weixin_49070186的博客

原创 jasmine学习（二）--API

jasmine的初步学习，了解jasmine的api含义和使用

原创 JavaScript单元测试jasmine学习（一）

jasmine是用于测试JavaScript的一种测试框架,BDD(Behavior Driven Development)行为驱动开发。不依赖于任何其他JavaScript框架，也不需要DOM。

原创 react的jsx的基本语法和创建脚手架

初始reactreact是一个构建用户界面的javascript库创建一个简单react第一步：引入核心库<!-- react开发的核心库，创建虚拟dom对象 --><script src="./../js/react.development.js"></script><!-- 将虚拟dom转化为html，渲染视图所用 --><script src="./../js/react-dom.development.js">&lt

原创 使用vue中遇到的一些问题以及解决方案

1.路由的重定向重复路由- 报promise uncaught异常解决方案：// 该段代码不需要记，理解即可//在vue - router在3.1.0版本之后，push和replace方法会返回一个promise对象，如果跳转到相同的路由，// 就报promise uncaught异常const originalPush = VueRouter.prototype.push;VueRouter.prototype.push = function push(location) { r

原创 初识vuex

vuex是什么？vuex是一个转为vue.js应用程序开发的状态管理模式+库。采用集中式存储管理应用的所有组件的状态，并以响应的规则保证状态以一种可预测的方式发生变化。状态管理模式是什么？这个状态自管理应用已包含三个部分：状态：驱动应用的数据源 视图：以声明方式将状态映射到视图 操作：响应在视图上的用户输入导致的状态变化但是，当我们的应用遇到多个组件共享状态时，单向数据流的简洁性很容易被破坏：多个使用依赖同一状态 来自不同视图的行为需要变更同一状态 ...

原创 vue路由的导航守卫

概念在实现路由跳转之前往往需要有一定的判断和操作在跳转，这时就可以用到导航守卫注意：参数或查询的改变并不会触发进入/离开的导航守卫，可以通过观察$route对象应对这些变化，或使用beforeRouteUpdate的组件来守卫分类一、全局前置守卫router.beforeEach// 在路由配置文件中注册一个全局前置守卫(router.beforeEach)函数router.beforeEach(( to , from , next )=>{ // to : 将要

原创 vue路由以及使用vue-router步骤

vue-router使用步骤：1.下载对应路由vue-router的3版本 (默认下载是4版本，4针对vue3，这里要下载3版本针对vue2)npm i vue-router@32.在main.js文件中导入对应的vue-routerimport VueRouter from 'vur-router'3.在main.js中使用vue-routerVue.use(VueRouter)4.引入对应的页面组件，并配置对应的路由规则// 引入对应页面组件import 组件名

原创 vue网络请求

一、fetch全局请求 不需要引入直接使用即可，浏览器内置的支持 get 和 post 请求 ，默认get语法：fetch(url).then(res=>{return res.json()}).then(res=>{res是数据})注：第一个then的res需要使用json方式处理成promise对象举例：<div id="root"> <p>{{msg}}</p></div><

原创 vue组件间通信

一、父传子1.利用props传值步骤：在子组件设置自定义属性，将要传的数据作为属性值 在子组件中设置props:['属性名','属性名',....]，接收父组件传过来的数据，props可以接受多个 在子组件中就可以直接用数据了注：props可以是数组也可以对象，数组更常用对象形式：props:{属性名:{ default: 默认值, ...

原创 mongoDB简述以及相关命令

目前数据库分：关系型数据库： mysql，sqlserver，Oracle 注：数据存储到数据表，数据表存在电脑磁盘中非关系型数据库： mongoDB，redis 注：数据存在电脑内存中，所以读取数据和写入更加快速安装mongoDB步骤1. 安装，路径选择其他盘，不要装C盘2. 配置环境变量path，添加当前安装的mongoDB的bin文件的路径3. 如果服务没打开，开启对应...

原创 nodejs中间件

内置中间件express中内置的中间件 - 中间件本质是一个函数jsonjson是处理json请求的，获取参数 req.bodyapp.use(express.json())测试json是否成功的步骤1. 在postman发起请求2. post请求，需要设置请求头，参数如果是json对象就选择body -json属性是双引号3. 设置请求头 application/json4. 在body请求体中设置传递的参数 raw 格式urlencodedurlencod

原创 express基于nodejs的web开发框架 - 简单使用

Express 是基于 Node.js 平台，快速、开放、极简的 Web 开发框架。搭建web服务器Express 的本质：就是一个 npm 上的第三方包，提供了快速创建 Web 服务器的便捷方法。使用Express开发框架可以非常方便、快速的创建Web网站的服务器或API接口的服务器官网：Express - 基于 Node.js 平台的 web 应用开发框架 - Express 中文文档 | Express 中文网使用步骤： 导入包 创建服务器 处理请求 ..

原创 nodejs第三方库

第三方模块定义：就是网上别人已经开发好的模块，我们可以直接拿来借鉴使用，但是需要下载，下载工具使用npmnpm工具npm 包管理工具 是node.js 自带的，只要下载好node，就会自带npm 包下载：npm install/i 包名npm i 包名 包名 ...npm i 包名@版本号 // 最新版本可以使用 @latest//使用npm 也可以安装npmnpm install npm -g // 默认下载最新版本下载命令执行之后，会生成no..

原创 nodejs常用内置模块

fs模块 - 文件操作// 引入fs模块const fs = require('fs')//异步写入数据fs.writeFile('文件路径' , '写入的内容' , (err)=>{ 成功时err值为null })//同步写入数据 - 同步无回调函数 - 同下fs.writeFileSync('文件路径' , '写入的内容')//异步读取数据 - 不写编码格式，默认是buffer二进制流形式fs.writeFile('文件路径' , 'utf-8' , (err)=>

原创 本地存储-cookie和localStorage

cookie （会话）cookie是浏览器提供的一项功能是一个本地的存储文件用于存储数据前端和后端程序都可以调用操作cookie中存储的数据cookie的基本属性：name ：键名 value ：键值 domain ：域名 path ：路径 符合路径的文件才能访问cookie expires的操作语法 ：有效期 / 失效 超过有效期的cookie浏览器就自动删除页面打开检查（F12），点击application，就会出现cookieJavaScript设定cookie的

原创 js中的数组去重的多种方法

数组去重有很多方法，下面列举几种方式1. indexOf()方法const arr = [1,2,3,4,5,1,2,3,4,6,1,1,6,6,7,5,8]const newArr = []arr.forEach(item => { if(newArr.indexOf( item ) === -1){ newArr.push( item )}})2. set类型 - ES6最常用，代码最少const arr...

原创 ES6新增数据类型 - SET数据类型，MAP数据类型-附有详细例子

SET数据类型类似于数组类型，但是不会存储重复的数据创建set类型const 变量 = new Set( [ 数据1 , 数据2 , ...... ] )set类型的函数方法set对象.add( ) -------- 新增set对象.delete( ) -------- 删除set对象.clear( ) -------- 清除set对象.has(...

原创 组件插槽 -匿名插槽，具名插槽，作用域插槽

组件插槽插槽也是组件之间传值的一种方式含义：子组件上位，父组件给位置上放上具体的数据也就是说，插槽其实就是父组件给子组件传递数据的一种方式，这里所说的插槽指的是匿名插槽和具名插槽匿名插槽 - 没有名字的插槽1. 子组件中使用slot标签占位2. 父组件给子组件的自定义标签中放入数据子组件在自己的模板中，使用slot标签进行占位，父组件给子组件那个自定义标签中加入内容，自动会解析在slot标签内部具名插槽 - 有名字的插槽在子组件中只有一个站占好的位置，那父组件存放数据时，

原创 模块化开发 -nodejs - IIFE ,CMD,AMD,ES6模块化

模块化开发目前使用的 都是框架中的模块化开发将固定的功能需求代码定义成对应的外部文件通过导出/导入语句导出数据和加载外部文件优点：1.保护数据的安全性 - 放置全局变量污染2.实际项目中 依赖不清晰 （就是导入的文件无法分辨相互依赖关系）3.只会加载导出的数据，而不是加载所有的程序文件后端模块化nodejs的模块化开发 commonjs导出：module.exports = { } ---- 以对象的形式导出数据和函数方法导入：const 变量 = req

原创 使用git命令首次上传或第n次上传代码到gitee和gitee下载文件到本地 -clone的步骤

本文章是供自己学习的，内容参考文章链接使用git命令上传代码到gitee_furenqiang的博客-CSDN博客_git上传到gitee，大家可以在这里去看第一次上传：1. 在需要上传的文件夹里面，右键点击 git bash here -如果有.get文件就删除2. 进入命令窗口输入命令（1） git init （给上传的文件夹添加 .get文件，初始化）（2） git remote add origin https://.... git （后面的链接是gitee仓库克隆的地址，是..

原创 git简单使用图解（上传下载克隆 - 历史版本 - 远程仓库）

原创 gitHub简单介绍使用图解

原创 gitee简单使用（删除和新建）详细图解

删除gitee仓库图解新建gitee仓库图解

原创 gulp中配置gulpfile.js内容

1. 创建 gulp 项目文件夹 - 导入 下载 相关的依赖包2. 创建 gulp 外部js文件 - 这个文件名 必须是 gulpfile.js - 所有的gulp打包压缩程序都定义在这个文件中3. 设定 gulp 打包压缩相关的程序(1) 导入相关依赖包(2) 定义 gulp 打包压缩规范的执行每一个gulp打包压缩规范都有固定的程序执行方式 设定的都是固定的程序模式 只是程序的相关参数设定不同注意问题1. 导入的 gulp 依赖包 是 对象形式的数据结构 有属性 和...

原创 gulp基本介绍以及安装相关依赖包命令详解

gulp是一种自动打包压缩工具 - 上线的所有的项目文件都必须是压缩文件需要先下载gulp相关依赖包，再设定gulp程序注意：和gulp相关的依赖包都是开发依赖包gulp依赖包安装1. 创建项目文件夹 在项目文件夹中，新建src文件夹，存储所有源文件，新建dist文件，使用来存储压缩后的文件2. 项目文件初始化在项目文件夹目录下cmd打开命令窗口执行 ` npm init -y `3. 安装全局依赖包` npm i -g gulp `4. 安装项目文件夹中的开发依赖包1）gulp

原创 npm常用下载命令详解（下载第三方模块依赖包）

npm 常用命令1. 创建项目命令 src文件夹 存储 项目 源文件 dist文件夹 存储 项目 压缩文件2. 项目文件夹初始化 npm init -y 自动初始化命令执行成功 自动生成 package.json 文件 { "name": "shop", //项目名称 默认是 文件夹名称 文件夹必...

原创 nodejs的三个模块 - 附有淘宝镜像地址命令和cnpm下载地址命令

nodejs内置模块1. 直接导入nodejs的内置模块 - 直接加载就行了（我们这里选择导入fs模块吧，是一个文件读取和写入的模块）`const fs = require('fs')`2.调用它的方法- 读取外部文件信息fs.readFile('文件路径', '编码方式', function(error, data) {// 参数1 执行的提示信息 成功 null 失败 undefined// 参数2 返回的数据 - 是文件中的内容 原封不...

原创 观察者模式以及它的方法

观察者模式 / 发布订阅模式 需要3阶段 框架语法中的双向数据绑定配合执行 主体状态改变 相关个体执行对应的函数程序二阶段的主要程序内容通过构造函数创建实例化对象 1. 属性 - 对象存储 要执行函数程序的 类型 和 具体的函数程序 事件类型 和 事件处理函数2. 函数方法add() 添加方法 向对象中 添加 事件类型 和 事件处理函数 判断 事件类型是否存在 如果事...

原创 闭包和闭包下的单利模式

闭包的基本语法1. 有一个函数A 其中定义的需要保护的数据2. 函数A return 的返回值 是一个匿名函数3. 匿名函数程序 是操作执行 函数A 中被保护的数据4. 在函数A 外 有变量存储函数A 的执行结果 返回值5. 变量中存储的本质就是 return 的匿名函数function 函数A(){ //之前是全局变量 现在是被保护的局部变量 return function(){ //匿名函程序就是 操作 被保护的局部变...

原创 ES5和ES6的继承语法

ES5的面向对象的继承语法1. 继承属性通过改变this指向在子类构造函数中 直接调用父类构造函数（不通过new 关键字）通过 call / apply 调用父类构造函数通过 改变父类构造函数 this指向 到子类实例化对象语法：funtion F(){}...function S(){ F.call(this,参数....)}子类构造函数也可以定义 自己的属性属性值2.继承函数方法通过原型链 prototype函数方法定义 不是直接定义 -

原创 jQuery的钩子函数针对ajax异步代码

注意：钩子函数只使用在jQuery中的ajax请求，不能在原生DOM中操作$(window).ajaxStart() 在ajax请求之前触发，多个ajax请求也只触发一次，就是最开始ajax请求那次之前$(window).ajaxSend() 在ajax发送请求之前触发，有一次send()就触发几次$(window).ajaxSuccess() 在每次ajax请求发送成功之后触发，几次请求成功，就会触发几次$(window).ajaxEr...

原创 jQuery的动画

显示隐藏显示 $.show()隐藏 $.hide()切换 $.toggle()上卷下拉上卷 $.slideUp()下拉 $.slideDown()切换 $.slideToggle()渐隐减现隐 $.faseIn( 时间，liner，结束函数)现 $.faseOut( 时间，liner，结束函数)自定义 $.faseTo( {变化样式对象}，时间，liner，结束函数)结束运动$.finish() 从动画对象的结束位置开始执行别的操作$.stop(...

原创 深浅拷贝 和jQuery中深浅拷贝 的相关内容

浅拷贝浅拷贝就是复制 内存地址，相当于多个数组占用一个共同的内存地址举个例子：const arr1=['上海','北京','天津']const arr2=arr1//arr2 arr1共用一个内存地址console.log(arr1,arr2) //两个一样//修改arr2[0]arr2[0]='未知'console.log(arr1,arr2) //arr1[0] ,arr2[0] 的数据都会改变为未知1. 浅拷贝复制 内存地址2. 一个数组 改变数据.

原创 jQuery的事件，ajax请求、proxy、jsonp跨域以及举例

jQuery事件绑定语法形式1. $( ).事件类型(事件处理函数) ------ 是jQuery伪数组支持的事件类型//例子$('div').click(function(){ consloe.log('我是div标签对象')})2. $( ).on(事件类型 ， 事件处理函数) ------- 所有时间类型 都支持//例子$('[name=pwd]').on('input' , function(){ console.log('...

原创 jQuery的选择器，筛选器，class属性、标签占位，节点操作

jQuery的选择器jQuery获取标签对象的语法形式选择器的语法形式 $( '条件' ) / jQuery( '条件') 获取 所有符合条件的标签对象 可以直接执行jQuery的函数方法，获取的是伪数组注意: JavaScript DOM操作获取的是 独立的标签对象 / JavaScript标签对象伪数组 jQuery 获取的 是 jQuery标签对象伪数组...

原创 jQuery的语法和使用

jQuery的基本介绍 jQuery 是 前端的一种 类库 也就是 前端函数方法中的一个 函数库 - 本质就是一个外部的js文件，里面封装了很多js函数方法 加载导入这个js外部文件就可以调用其中的函数方法 返回的是伪数组jQuery的网站 jQuery的官网 https://jquery.com/jQuery的中文 https://jquery.cuishifeng.cn/jQ...

原创 vue的页面指令和过滤器 详解

页面指令v-text / v-html ：指定标签体 v-text ：当做纯文本 v-htm ：将value作为HTML标签来解析v-if v-else v-show： v-if ：如果value为true，当前标签就会输出在页面 v-else ：与 v-if 搭配使用，如果value为false，将当前标签输出到页面 v-show ：在标签中添加display样式，如果当前标签value为true，displ...

原创 vue的生命周期钩子 - 钩子函数：10个

介绍生命周期： 1. 又名：生命周期回调函数，生命周期函数，生命周期钩子 2. 是什么：vue在关键时刻帮我们调用的一些特殊名称的函数 3. 生命周期函数的名字不可更改，但函数的具体内容是程序员根据需求编号的 4. 生命周期中的this指向是vm 或组件实例对象vm的生命周期：将要创建 ===> 调用beforeCreate函数 - 创建的是数据监测和数据创建完毕 ===...

原创 初始vue概念，vue的使用

1. Vue是什么? 1). 由一位华裔前Google工程师开发的前端 MVVM js库 2). Vue（读音 /vjuː/, 类似于 view）是一个构建数据驱动的web界面的库。 3). Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。 4). 与angular.js类似的是声明式开发，但性能高于angular，体积又小很多 5). 它本身不是全能框架, 只关注UI, 如果需要router/ajax, 可以使用对应插件或使用别的库来实现 6)....

原创 js的同源策略和跨域访问 -cors、proxy、jsonp

同源策略？同源策略，它是由Netscape提出的一个著名的安全策略，是浏览器最核心最基本的安全功能，web就是构建在同源策略的基础之上的。源：域名，协议，端口三者都必须相同，浏览器才会同意访问服务器，有一个不同，浏览器就会报异常，提示拒绝访问不同源的数据怎么访问呢？ -- 跨域访问跨域跨域就是不受同源策略影响，访问不同源数据。跨域的方式？实现跨域有三种方式：一、cors跨域这种跨域方式是在后端完成的，在后端程序中写入相应代码声明允许这个页面的访问，就可以实现跨域..