- 博客(49)
- 问答 (1)
- 收藏
- 关注
原创 闭包缓存出现的问题
今天在封装运动函数的时候遇到了一个由于不报缓存形成的问题,接下来分享给大家,在写的不透彻的地方欢迎各位能够指正,谢谢啦!我想要封装的函数是一个物体先加速后减速的直线运动,就在封装完成之后遇到了一些问题。话不多说上代码: function normal(tarPos, target) { let timer = null; return function () { clearInterval(timer);
2021-04-03 14:27:30
205
原创 深入解析立即执行函数
立即执行函数除了执行完就被销毁之外,与函数没有任何区别。立即执行函数的两种写法:(function(){}())//W3C推荐(function(){})()参数传递:(function(形参) {}(实参))返回值:var num = (function() { return 123;}())console.log(num);//123立即执行函数都是匿名函数,但为什么都是匿名函数呢?要想知道为什么是匿名函数,首先要搞懂函数的定义方式函数定义有两种:1、函数表达式;
2021-03-08 22:43:43
390
3
原创 原生JavaScript封装ajax函数
平时使用ajax的时候,如果使用一次声明一次,就会造成代码量多等问题,把ajax封装成一个函数的话能够增加代码的复用性,接下来就向大家展示一个封装ajax的方法。 function ajax(options) { // 声明一个 defaults 变量,这样如果传递的参数不是完整的,那么可以用 defaults 中的弥补 let defaults = { type: 'get', url: '
2021-01-14 15:54:40
248
原创 This dependency was not found: * swiper/dist/css/swiper.css in ./src/main.js
This dependency was not found:* swiper/dist/css/swiper.css in ./src/main.jsTo install it, you can run: npm install --save swiper/dist/css/swiper.css这个错误是因为在vue 中使用轮播插件,但是轮播插件中的 swiper 版本过高npm install swiper vue-awesome-swiper --save其中这两个包,“swiper”
2020-12-21 00:04:13
3949
原创 修改 vscode 中主题注释中文的斜体格式
方法一:直接在vscode 中的 setting 文件进行更改,但是对有些主题不起作用"editor.tokenColorCustomizations": { "comments": { // 设置字体样式 加粗 下划线 斜体等 "fontStyle": "", // bold italic underline // 设置字体颜色 // "foreground": "#4caee2" "fo
2020-12-13 14:59:45
9855
3
原创 error ‘res‘ is assigned a value but never used no-unused-vars
我们在写代码的时候有时候会遇到这样的错误:明明什么都对还是会报错,错误如下:error ‘res’ is assigned a value but never used no-unused-vars ERROR Failed to compile with 1 errors 1:56:25 ├F10: PM┤ error in ./src/views/Category
2020-12-11 14:04:53
1062
1
原创 Error: Cannot find module ‘webpack-cli/bin/config-yargs‘
Error: Cannot find module 'webpack-cli/bin/config-yargs'Require stack:- C:\Users\Administrator\Desktop\学习\06Vue\02模块化开发\02webpack\node_modules\webpack-dev-server\bin\webpack-dev-server.js这种错误的原因是因为 webpack 或者 webpack-cli 版本过高我这里原来使用的webpack 版本为 5*;we
2020-12-08 21:35:11
1692
5
原创 npm init -y:pm ERR! Invalid name
npm init -ynpm ERR! Invalid name: "02webpack打包"npm ERR! A complete log of this run can be found in:npm ERR! C:\Users\Administrator\AppData\Roaming\npm-cache\_logs\2020-12-07T13_18_03_331Z-debug.log报错原因是: name 中不能使用 大写字母、空格和中文...
2020-12-07 21:24:24
1648
原创 web服务器及HTTP协议
创建 web 服务器// 引用系统模块const http = require('http');// 创建 web 服务器const app = http.createServer();// 当客户端发送请求的时候,处理数据app.on('request', (req,res){ // request 是请求事件 // req 代表请求对象,里面有所有的请求信息 // res 代表响应对象,里面有所有的响应信息 // 响应,把里面的值写到页面上 res.end('HelloWorld'
2020-11-11 09:25:25
175
原创 Did you forget to signal async completion?解决方案
相信看到这边文章的小伙伴,在学习和使用gulp时都遇到了这样的报错:[09:18:40] The following tasks did not complete: first[09:18:40] Did you forget to signal async completion?提示你开启异步操作,但是我们有时候需要同步操作该怎么办呢?// 1、引入gulpconst gulp = require('gulp');// 2、创建 gulp 任务// 使用 gulp.task 创建任务/
2020-11-08 09:31:36
3741
原创 闭包案例之循环点击
实现功能:点击每一个 li ,在控制台输出该 li 的序号<ul class="list"> <li>cat</li> <li>dog</li> <li>buff</li> </ul> <script> var lis = document.querySelectorAll('li'); // 原来的方
2020-10-11 18:13:02
139
原创 浅析 JS闭包
Closure 闭包:指有权访问另一个函数作用域中的变量的函数一个作用域可以访问另一个函数的局部变量外面作用域 可以访问 函数 内部的局部变量闭包的主要作用:延伸了变量的作用范围function cat() { var num = 0; function dog() { console.log(num); } return dog; } var pig = cat(); pig();此时的 pig() 就是 dog() 。..
2020-10-11 17:59:30
81
转载 JS中常用的函数求和方法总结【五种方法】
本文实例总结了JS数组求和的常用方法。分享给大家供大家参考,具体如下:题目描述计算给定数组 arr 中所有元素的总和输入描述:数组中的元素均为 Number 类型输入例子:sum([ 1, 2, 3, 4 ])输出例子:10方法1:不考虑算法复杂度,用递归写function sum(arr) { var len = arr.length; if(len == 0){ return 0; } else if (len == 1){ return arr[0]
2020-10-11 16:59:43
12788
原创 JavaScript的严格模式,你必须知道这些
我们为什么要用严格模式?消除Javascript语法的一些不合理、不严谨之处,减少一些怪异行为;消除代码运行的一些不安全之处,保证代码运行的安全;提高编译器效率,增加运行速度;为未来新版本的Javascript做好铺垫"严格模式"体现了Javascript更合理、更安全、更严谨的发展方向,包括IE 10在内的主流浏览器,都已经支持它,许多大项目已经开始全面拥抱它。另一方面,同样的代码,在"严格模式"中,可能会有不一样的运行结果;一些在"正常模式"下可以运行的语句,在"严格模式"下将不能运行。
2020-10-11 16:28:01
492
2
原创 vscode代码自动格式化快捷键
Visual Studio Code可以通过以下快捷键 格式化代码:On Windows Shift + Alt + FOn Mac Shift + Option + FOn Ubuntu Ctrl + Shift + I
2020-10-10 21:19:57
2080
原创 JavaScript 高阶函数的基本知识
高阶函数是对其他函数进行操作的函数,它接收函数作为参数或将函数作为返回值输出接收函数作为参数类型:function fn(callback) { callback&&callback();}fn(function() {alert('hi')}将函数作为返回值输出:function fn() { return function() {}}fn();函数也是一种数据类型,同样可以作为参数,传递给另外一个参数使用。最典型的应用是回调函数,同理函数也可以作为返回值传递回来
2020-10-08 08:53:02
145
原创 构造函数中方法的继承
构造函数的方法,我们通过原型对象(prototype)实现继承,其属性我们则是通过call、apply、bind,这三个方法实现继承首先,我们先写两个函数function Father(uname, age) { this.uname = uname; this.age = age;}Father.prototype.money = function() { console.log('努力挣钱');}function Son(uname, age, score) {
2020-10-07 17:58:15
639
1
原创 call()、apply() 和 bind() 的作用和区别
1、call()作用:①、调用函数②、改变 this 指向并赋值function Father(uname, age) { this.uname = uname; this.age = age;}Father.prototype.money = function() { console.log('努力挣钱');}function Son(uname, age, score) { // 使 Son 里面的 this 指向 Father Father.call
2020-10-07 14:44:29
282
原创 关于函数内部 this 的指向,你知道多少
1、普通函数 里面的 this 指向的是 windowvar fn = function() { console.log('对象方法的this:' + this); } fn();2、事件绑定函数 里面的 this 指向的是 被绑定者var btn = document.querySelector('button') btn.onclick = function() { console.log('对象方法
2020-10-06 15:38:13
329
原创 JavaScript 中函数的定义和调用
一、函数的定义:1、自定义函数(命名函数) function cat() { }2、函数表达式(匿名函数)var dog = function() { }3、利用 new Function(‘参数1’, ‘参数2’, ‘函数体’); Function 里面的参数都必须是字符串var pig = new Function('a', 'b', 'console.log(a + b)');pig(1, 2);前两种是我们平时比较常用到的函数定义的方法,后一个由于繁琐、效率低,平时用到的就比较
2020-10-06 15:23:16
423
原创 对象方法Object.key()和Object.defineProperty()
这两个方法都是es5 新增的1、Object.key():获取对象的函数名,并生成一个类型为 字符串 的新数组var obj = { id: 1, name: 'xing', age: 20}var ar = Object.keys(obj);console.log(ar);ar.forEach(function (value) { console.log(value);})输出结果为:2、Object.defineProperty():方法会直接在一个对象上定义一个新属
2020-10-06 14:59:07
525
1
原创 关于字符串对象 trim 你知道多少
trim() 去除字符串两侧的空格,生成新的字符串,不改变原来的字符串,不能去除字符串中间的空格,只适用于字符串类型。如下例:var str = ' x i n g ';console.log(str);console.log(str.length);console.log(str.trim());console.log(str.trim().length);可知,trim() 把字符串 str 前后所有的字符串都去掉了...
2020-10-06 14:45:11
532
原创 商品筛选(使用some、filter、forEach实现)
一、项目功能说明能够查询价格区间内的商品按照商品名筛选复合的商品能够动态添加商品的价格、名称等二、代码实现HTML部分代码<div class="search"> 按照价格查询:<input type="text" class="start"> - <input type="text" class="end"> <button class="search-price">搜索</butto
2020-10-06 14:35:44
568
1
原创 便利、筛选数组的方法(很实用)
这些方法是 ES5 中新增的,用于处理数组的便利非常方便。方法1:forEach()array.forEach(function(value, index, array))value:被便利的这一个数组的元素index:这一个数组元素的索引号array:这个数组var arr = [1, 2, 3];arr.forEach(function(value, index, array) { console.log('每个数组元素' + value); console.log('每个
2020-09-30 11:39:22
2440
原创 关于原型链和查找机制你必须知道这些……
一、在 JavaScript 中 原型链 是什么呢?看它的名字应该知道,原型链跟 构造函数、原型对象、对象原型有着密切的联系那么我们先声明一个构造函数function Star(uname) { this.uname = uname;}Star.prototype.sing = function () { console.log('亲爱的旅人');}var ldh = new Star('刘德华');console.log(ldh.__proto__);我们可以看一下 l
2020-09-30 11:05:01
325
原创 原型对象、对象原型和constructor的联系
1、什么是原型(prototype)?一个对象,我们也称为 prototype 为原型对象。2、什么是对象原型?对象都会有一个属性 __ proto__ 指向构造函数的 prototype 原型对象,之所以我们对象可以使用构造函数 prototype 原型对象的属性和方法,就是因为对象有 __ proto__ 原型的存在。3、什么是 constructor?对象原型( __ proto__)和构造函数(prototype)原型对象里面都有一个属性 constructor 属性 ,construct
2020-09-29 09:47:15
328
原创 关于构造函数与原型你应该知道这些
先声明一个构造函数function Zoo() { this.name = name; this.shout = function() { console.log('哼哼哼'); }}实例化构造函数var pig = new Zoo('猪猪侠');输出一下实例化对象 pigconsole.log(pig);虽然构造函数很方便,但是当实例对象有多个时,会存在内存浪费现象。那么为什么会出现内存浪费呢?当一个构造函数有两个或者两个以上的实例化对象时var pig = new
2020-09-28 10:40:59
143
原创 JavaScript的构造函数的特征
一、构造函数的函数名的首字母必须要大写function Zoo() {}var dog = new Zoo();二、构造函数的 this 指向在内存中创建一个新的空对象让 this 指向这个新的对象执行构造函数里面的代码,给这个新对象添加属性和方法返回这个新对象三、实例成员和静态成员1、实例成员:构造函数内部通过 this添加的成员实例成员只能通过实例化的对象访问 如:dog.age2、静态成员:在构造函数本身上添加的成员,原来函数内没有该成员(新增)Zoo.name =
2020-09-28 08:53:33
344
原创 每日一题01:查找两个节点的最近的一个共同父节点,可以包括节点自身
题目:查找两个节点的最近的一个共同父节点,可以包括节点自身输出:oNode1 和 oNode2 在同一文档中,且不会为相同的节点function commonParentNode(oNode1, oNode2) { var pNode1 = oNode1.parentNode; var pNode2 = oNode2.parentNode; if(pNode1 == pNode2) { return pNode1; } if(pNode1 == o
2020-09-10 10:06:13
540
转载 jQuery的对象拷贝,你了解多少?
当我们要使用的对象要用到其他对象的内容,这时就需要使用对象拷贝了。语法:$.extend([deep], target, Obj1[,ObjN])deep:如果设 true 为深拷贝,那么 默认 false 就是浅拷贝target:要拷贝的目标对象Obj:代拷贝的对象接下来给大家详细介绍一下浅拷贝1.1一个对象为空,另一个不为空var targetObj = {};var Obj = { id: 1, name: 'Ross'}$.extend(targetObj
2020-05-26 22:26:12
230
原创 jquery中的事件处理你真的了解吗?
在jQuery中的事件的事件处理包括三部分:1、事件绑定;2、事件解绑;3.自动触发。我们先看一下事件绑定:事件处理函数:on()on()方法在匹配元素上绑定一个或多个事件的事件处理函数语法:element.on(events,[selector], fn);enents:一个或多个用空格隔开的事件类型。如:clickselector:元素的子元素选择器fn:回调函数用法1:绑定多个事件,多个事件处理程序1.1-对多个事件添加多个事件处理程序$("div").on({ mouse
2020-05-26 21:18:49
186
原创 jQuery对属性、文本、元素操作
一、jQuery对属性操作1、获取、改变元素的固有属性 不能获取到自定义属性1.1获取元素的固有属性console.log($("a").prop("title"));1.2改变元素的固有属性$("a").prop("title", "jack");输出以上得出的是一个伪数组2、获取自定义属性的方法 得到的是字符串形式Element.attr(“完整的自定义属性名”[,做改变的值])2.1获取自定义属性的方法 得到的是字符串形式console.log($("div").a
2020-05-25 10:30:00
198
原创 jQuery常用的筛选器和筛选方法
筛选器名称用法:first$(‘li:first’) 获取li的第一个元素:last$(‘li:last’) 获取li的最后一个元素:eq(index)$(‘li:eq(2)’) 获取li的第三个元素,index是索引号,从0开始:odd$(‘li:odd’) 获取li的索引号为奇数的元素:even$(‘li:even’) 获取li的索引号为...
2020-05-04 20:09:05
561
原创 jQuery中层级元素 ul li与ul>li的区别
这是jQuery中的两个层级选择器<ul> <li>12 <ol> <li>33</li> </ol> </li> <li>12</li> <li>12</li></ul&...
2020-05-04 16:23:34
607
原创 原生js轮播图代码
话不多说,上代码HTML部分<div class="focus fl"> <!-- 左侧按钮 --> <a href="javacsript:;" class="arrow_l"><</a> <!-- 右侧按钮 --> <a href="javascript:;" class="arrow_r">&g...
2020-04-12 22:46:55
226
原创 offset、client、scroll三个系列的相同与不同
offset用处:1)、获得元素距离带有定位父元素的位置2)、获得自身大小包括宽高边框内边距3)、返回值不带单位4)、不能设置元素的样式offset家族的成员:offsetParent:返回该元素带定位的最近父元素,如果父元素都没有定位,那就返回bodyoffsetTop:返回元素相对于带定位的父元素上边框的距离,返回值不带单位offsetLeft:返回元素相对于带定位的父元...
2020-04-09 16:42:31
149
原创 DOM事件流
大家在学习js的时候有没有困惑,为什么会出现冒泡,冒泡的机制是什么接下来我向大家介绍一下DOM事件流,大家就清楚了那么什么是DOM事件流**事件发生时会在元素节点之间按照特定的顺序传播,这个传播过程即 DOM 事件流。**事件流描述的是从页面中接收事件的顺序。比如我们给一个div 注册了点击事件:DOM 事件流分为3个阶段:1. 捕获阶段2. 当前目标阶段3. 冒泡阶段 ...
2020-03-31 23:30:14
161
原创 数组增删
如果大家在学习算法的话,那一定会有数组方面的东西,那么现在向大家介绍几个关于数组增删的函数,持续更新arr.push();增加到数组末尾,并返回数组长度;arr.unshift();增加到数组最前面,并返回数组长度arr.pop();方法从数组中删除最后一个元素,并返回该元素的值,数组为空返回undefined。此方法更改数组的长度arr.shift() 方法从数组中删除第一个元素...
2020-03-30 22:28:21
226
原创 tab栏切换
tab栏切换tab栏切换在很多地方都有应用,无论是应用还是网页,所以在这里向大家介绍一种tab栏切换的做法。HTML部分<div class="tab"> <div class="tab_list"> <ul> <li class="current">商品介绍</li> ...
2020-03-30 22:16:46
248
原创 在数组 arr 末尾添加元素 item。不要直接修改数组 arr,结果返回新的数组
输入[1, 2, 3, 4], 10输出[1, 2, 3, 4, 10]function append(arr, item) {var arr1 = []; for(var i = 0; i < arr.length; i++) { arr1.push(arr[i]); } arr1.push(item); return arr1;}也可以使用A...
2020-03-26 14:04:45
480
空空如也
模板字符串拼接变量出错
2020-12-13
TA创建的收藏夹 TA关注的收藏夹
TA关注的人