笔记
关注
分享
扫一扫
不忘初心1995
欢迎访问我的个人博客http://139.9.210.43/#/home，有更加详细的资料
展开
-
vue中使用mock
文章目录更多返回数据参考1.安装依赖yarn add mockjs --save -D2.在根目录下新建mock目录，mock目录下新建index.js文件index.jsconst Mock = require("mockjs")Mock.setup({ timeout: 1000});// 配置返回数据 第一个参数是要匹配的url(可以使用正则匹配)，第二个参数是要返回的数据Mock.mock('/api/user/login', { id: '@incremen原创 2021-08-23 08:46:40 · 284 阅读 · 0 评论 -
js设计模式--策略模式
文章目录定义案例定义将算法的定义和实现分离开案例let strategres={ "S":function(value){ return value*4 }, "A":function(value){ return value*3 }, "B":function(value){ return value*2 }}let getBouns=(level,value)=>{ return原创 2021-07-30 07:25:38 · 124 阅读 · 0 评论 -
day37---手写一个array map
案例function myMap(cb){ let result=[] // 先判断类型是否为array // 再进行相关方法的书写 for(let i=0;i<this.length;i++){ result.push(cb(this[i])) } return result}Array.prototype.myMap=myMaplet arr=[1,2,3]console.log(arr.myMap((item)=&g原创 2021-07-29 11:46:54 · 112 阅读 · 0 评论 -
day32---获取宽高距离相关
offsetWidth/offsetHeight，clientWidth/clientHeight 与 scrollWidth/scrollHeight 的区别offsetWidth/offsetHeight 返回值包含 content + padding + border，效果与 e.getBoundingClientRect() 相同；clientWidth/clientHeight 返回值只包含 content + padding，如果有滚动条，也不包含滚动条；scrollWidth/scrol原创 2021-07-28 07:51:46 · 83 阅读 · 0 评论 -
day19---js的原型链，prototype和_proto_的区别
文章目录大纲prototype:原型（对象）__proto__:对象原型什么是原型链？原型指针prototype:__proto__:大纲实例对象.proto === 原型对象原型对象.constructor === 构造函数构造函数.prototype === 原型对象prototype:原型（对象）1.每一个构造函数都有的对象prototype2.用于方法的共享构造函数 实例对象 原型对象proto:对象原型1.对象都有一个属性_proto_,指向构造函数的原型对象，所以对象才原创 2021-07-26 09:53:37 · 199 阅读 · 0 评论 -
day28---深拷贝和浅拷贝
文章目录浅拷贝Object.assign深拷贝JSON第三方库lodash手写一个深拷贝浅拷贝Object.assignlet Person = { name: '123', arr:[1,2,3]}var person = {}// 对于引用类型只是浅拷贝Object.assign(person, Person) //浅拷贝person.name = "111"person.arr.push(456)console.log(person === Person) /原创 2021-07-25 11:52:15 · 228 阅读 · 0 评论 -
day30---数组数据排序
sort排序arr1=[1,21,25,24,34,31,4]arr1.sort(function(a,b){ //a表示当前项，b表示下一项 a-b>0 就交换位置 return a-b //b-a就是降序, 若 a 等于 b，则返回 0})console.log(arr1) //[ 1, 4,21, 24, 25,31, 34 ]冒泡排序arr=[1,21,25,24,34,31,4]var temp=nullfor(var i=0;i<arr.lengt原创 2021-07-25 10:07:50 · 84 阅读 · 0 评论 -
day13--call apply bind
文章目录callapplybind()call1.立即执行函数2.改变this指向3.传参 .call(thisObj, arg1, arg2, arg3, arg4); //后面的参数都是实参4.适用于继承apply1.立即执行函数2.改变this指向3.传参 .apply(thisObj, [args]); //后面的参数都是实参4.有关数组的操作 <script> var arr = [1, 2, 3] var m原创 2021-07-24 22:25:32 · 157 阅读 · 0 评论 -
day12--检查数据类型
文章目录instanceof (有瑕疵)isArray()constructor利用原型方法instanceof (有瑕疵)能在实例的 原型对象链 中找到该构造函数的prototype属性所指向的 原型对象，就返回true。即:// proto: 代表原型对象链instance.[proto…] === instance.constructor.prototype// return true <script> var arr = [] var ob原创 2021-07-24 22:22:54 · 84 阅读 · 0 评论 -
promise简易版版本2(解决异步的问题)
案例const PENDING = "PENDING"FULLFILLED = "FULLFILLED"REJECTED = "REJECTED"class myPromise { constructor(executor) { this.state = PENDING this.value = undefined this.reason = undefined this.onFulfilledCbs = [] //收集P原创 2021-07-24 14:50:04 · 97 阅读 · 0 评论 -
promise简易版版本1
案例const PENDING = "PENDING"FULLFILLED = "FULLFILLED"REJECTED = "REJECTED"class myPromise { constructor(executor) { this.state = PENDING this.value = undefined this.reason = undefined const resolve = (value) => {原创 2021-07-24 14:19:31 · 119 阅读 · 0 评论 -
jq 自定义轮播图
文章目录核心代码htmlcssjs核心代码html<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=原创 2021-07-23 18:04:53 · 122 阅读 · 0 评论 -
js设计模式--发布订阅模式
文章目录示例示例class Observer { constructor() { this.message = {}; } // 订阅 on(type, fn) { if (!this.message[type]) { this.message[type] = [] } if (!this.message[type].includes(fn)) { retu原创 2021-07-22 09:25:24 · 104 阅读 · 0 评论 -
js设计模式--观察者模式
文章目录具体实现具体实现// 观察者class Observer { constructor(name, fn = () => { }) { this.name = name; this.fn = fn }}const person1 = new Observer("班主任", (res) => { console.log(res+'----'+"班主任bb"); })const person2 = new Observer("校长"原创 2021-07-21 19:13:26 · 94 阅读 · 0 评论 -
js单例模式
文章目录概念核心代码案例案例一 弹出框概念一个构造函数只能有一个实例核心代码 const Person = (function () { class Person { construct(name) { this.name = name; } } let instance = null return function () {原创 2021-07-21 16:47:01 · 185 阅读 · 0 评论 -
js中的数
文章目录js的安全数范围能表示的数的范围js的安全数范围-253~253能表示的数的范围(-21024+1)~(21024-1)原创 2021-07-21 08:58:23 · 88 阅读 · 0 评论 -
VUE中解决长列表方法
虚拟dom在，只渲染了可视部分安装依赖yarn add vue-virtual-scroll-list --save使用在需要的页面import virtualList from 'vue-virtual-scroll-list'页面<template> <div class="about"> <h1>This is an about page</h1> <div> <virtual-li原创 2021-07-01 21:11:49 · 955 阅读 · 0 评论 -
vue 结合路由meta 实现通用面包屑效果
配置路由的meta信息 path: '/home', name: 'home', meta:{ arr:["首页"] }, component: () => import('../components/home.vue'), children:[ { path: 'map', name: 'map', meta:{ arr:["首页","用户信息"]原创 2021-07-01 17:53:22 · 470 阅读 · 0 评论 -
betterscroll的使用
文章目录vue3中使用betterscroll安装依赖页面配置具体调用vue3中使用betterscroll安装依赖yarn add --save better-scroll页面配置在需要的页面导入import BScroll from “better-scroll”;页面基本结构 <div class="wrapper" id="wrapper"> <ul class="content" id="content"> <li class=原创 2021-06-30 23:57:44 · 427 阅读 · 2 评论 -
布局部分(三)
清除浮动的方式浮动元素可以左右移动，直到遇到另一个浮动元素或者遇到它外边缘的包含框。浮动框不属 于文档流中的普通流，当元素浮动之后， 不会影响块级元素的布局，只会影响内联元素布局。此时文档流中的普通流就会表现得该浮 动框不存在一样的布局模式。当包含框 的高度小于浮动框的时候，此时就会出现“高度塌陷”。 清除浮动是为了清除使用浮动元素产生的影响。浮动的元素，高度会塌陷，而高度的塌陷使 我们页面后面的布局不能正常显示。.clear::after{ content:''; display:table;//也可原创 2021-06-29 10:16:05 · 840 阅读 · 0 评论 -
布局部分(二)
实现不使用 border 画出 1 px 高的线，在不同浏览器的标准模式与怪异 模式下都能保持一致的效果。 <div style="height:1px;overflow:hidden;background:red"></div> title 与 h1 的区别？title 属性没有明确意义只表示是个标题，h1 则表示层次明确的标题，对页面信息的抓取也 有很大的影响。 的 title 和 alt 有什么区别？title 通常当鼠标滑动到元素上的时候显示 alt 是 的特有原创 2021-06-29 10:01:15 · 503 阅读 · 0 评论 -
图片懒加载 和 预加载
图片懒加载1. 给需要懒加载的都加上类名 lazy_load <img class="lazy_load" src="img/default.png" data-src="img/sinaweibo.png" alt="">2. js文件$(function () { let length = $(".lazy_load").length srcrllLazy() setTimeout(() => { window.scrollTo(0,0)原创 2021-06-02 20:26:51 · 350 阅读 · 0 评论