
javascript
文章平均质量分 61
thingir
这个作者很懒,什么都没留下…
展开
-
javaScript - 循环内多种情况的条件判断写法
js循环数组中的条件判断:(一) 不符合条件的项,可以使用continue跳过本次循环,(二) 使用if条件判断直接对符合条件的项处理原创 2023-02-07 14:26:25 · 723 阅读 · 1 评论 -
pinia 持久化存储
pinia刷新数据持久化解决方案原创 2022-12-07 11:47:42 · 4710 阅读 · 0 评论 -
Vue 学习笔记 02
1. .sync修饰符的使用用于组件之间数据的“双向绑定”;父组件可以监听子组件的事件并根据需要更新一个本地的数据属性子组件内触发事件的名称应使用update:myPropName命名,例:Vue.component('xqselect',{ template:` <i-select :value="xqvalue" @on-change="ch...原创 2020-03-05 15:13:54 · 215 阅读 · 0 评论 -
判断窗口高度
// 获取窗口宽度if (window.innerWidth)winWidth = window.innerWidth;else if ((document.body) && (document.body.clientWidth))winWidth = document.body.clientWidth;// 获取窗口高度if (window.innerHeight)winHeight转载 2017-01-20 13:10:10 · 614 阅读 · 0 评论 -
12 个非常实用的 jQuery 代码片段
导航菜单背景切换效果在项目的前端页面里,相对于其它的导航菜单,激活的导航菜单需要设置不同的背景。这种效果实现的方式有很多种,下面是使用JQuery实现的一种方式: <ul id='nav'><li>导航一</li><li>导航二</li><li>导航三</li></ul> //注意:代码需要修饰完善 $('#nav').click(function(e) { //转载 2017-01-20 13:45:36 · 195 阅读 · 0 评论 -
后台项目搭建记录-01
1.使用vue-cli3新建一个项目2.引入iview//安装iviewnpm install iview --save3.安装后在项目中进行配置 在main.js中引入iview并使用import iview from 'iview'import 'iview/dist/styles/iview.css'Vue.use(iview)4.基础布局知识点:Logo使用环境变量配置根据vue cli3官网已添加.env文件,并添加好环境变量(如左下图),然后.原创 2020-09-18 17:30:40 · 137 阅读 · 0 评论 -
后台项目搭建记录-02
后台项目搭建记录-01:https://blog.youkuaiyun.com/thingir/article/details/10862060802篇记录了如何使用路由结合iview的Menu组件来实现左侧菜单效果的,效果如下:1. 定义路由上一篇记录使用了遍历文件夹的方式来定义routes;这篇使用一下的方法,丰富一下routes的定义方式。路由配置如下:const routes = [ { //首页组件 path: '/', redirect: '...原创 2020-09-21 17:29:42 · 116 阅读 · 0 评论 -
nodejs实现txt文档转换json格式代码实现
node实现txt文档转换json格式原创 2022-11-24 17:26:36 · 1307 阅读 · 0 评论 -
vue 中echart导出报表
【代码】vue 中echart导出报表。原创 2022-09-06 17:30:09 · 827 阅读 · 0 评论 -
解决 “Uncaught SyntaxError: Unexpected end of JSON input”
解决Error in mounted hook: "SyntaxError: Unexpected end of JSON input"原创 2022-05-12 16:09:13 · 4816 阅读 · 0 评论 -
js replace正则替换 \n
js replace替换 \n原创 2022-05-12 11:16:11 · 4391 阅读 · 0 评论 -
JS 实用代码片段
实战常用JS代码原创 2021-10-21 16:37:04 · 219 阅读 · 0 评论 -
es6 关于 export 和 export default
export 与 export default的使用原创 2022-03-01 17:45:08 · 741 阅读 · 0 评论 -
如何判断对象为空
一、JSON.stringify()// !obj判断为null 或undefined的情况if(!obj || JSON.stringify(obj) === '{}') return;二、ES6语法// !obj判断为null 或undefined的情况 if(!obj || Object.keys(obj).length === 0) return;参考文章:https://blog.youkuaiyun.com/weixin_42166007/article/details/87395099原创 2022-01-07 09:46:30 · 476 阅读 · 0 评论 -
关于节流和防抖
一、防抖(debounce)1.概念对于短时间内连续触发的事件,防抖就是为了处理这种事件而产生的函数,规定在一定时间内,只执行一次函数比如说连续点击按钮触发的事件、监听窗口的滚动事件二、节流(throttle)根据防抖的思路,只要用户不停触发,那么事件就会一直不触发,如果希望无论用户是否持续触发,一段时间后,都执行这个事件函数,就用到了节流。节流函数:类似控制阀门一样定期开放的函数,也就是让函数执行一次后,在某个时间段内暂时失效,过了这段时间后再重新激活三、应用场景搜索框in原创 2021-12-22 14:08:46 · 369 阅读 · 0 评论 -
阿里云返回的视频截图问题
问题描述: 显示视频video时,真正显示的是后台返回的 poster 图片, 但是却发现有的视频截图是竖向的,视频却是横向的,使用的时候怎么翻转到正确的方向?解决办法:请教IOS后得到了答案,很简单,链接的结尾应该拼接 ar_auto属性,用来控制图片自动旋转视频返回截图链接:http://tupiandizhi.com/uploads/20211025/70a62d3c2eb584b94de7832a1c3f1623.mp4?x-oss-process=video/snapshot,t_500.原创 2021-11-12 17:07:34 · 1820 阅读 · 0 评论 -
关于文件导入:required.context 和 vite Glob 导入
webpack 和 vite 导入方式不同比如在store的index.js中导入modules下的所有js文件webpack中//导入模块文件import { createStore } from 'vuex'let files = import.meta.globEager('./modules', false, /\.js$/), modules = {};files.keys().forEach((key) => { modules[key.replace(/原创 2021-08-13 10:57:21 · 926 阅读 · 0 评论 -
正则表达式过滤字符串
正则表达式过滤字符串,参考这篇正合适在做后台管理系统时,涉及正则过滤问题,如下图,后台返回来的带有特殊字符结构在修改保存时,需要对title属性进行过滤后保存,否则,会出现重复特殊字符的情况 //过滤空格 formateCol(value){ console.log(value) return value.replace(/[( ), \|, \-, \└, \├, \│]/g,原创 2021-08-11 13:03:25 · 2272 阅读 · 0 评论 -
Js中 new Date()获取的时间转换成时间戳
感谢万能的男友,哈哈哈const date = new Date('2021-07-23')//以下三种,前两种会精确到毫秒,后一种只能精确到秒,毫秒用000代替// 获取到的时间戳要除1000,可获得Unix时间戳,传给后台const time1 = date.getTime()const time2 = date.valueof()const time3 = Date.parse(date)...原创 2021-07-23 10:00:50 · 2331 阅读 · 10 评论 -
ES6语法学习(二)
1. 阵列 Array.from() Array.of()两者不是数组原型链上的方法,所以不能通过arr.from()或者arr.of()调用正确使用方法:Array.from(arr);Array.of(arr);1) Array.from()可以通过Array.from()将类数组对象、可迭代对象、字符串转换成数组,从而使用数组方法(reduce、map等) // 获取 li 标签里的内容 //此时的 todos 是类数组对象,需要使原创 2021-07-05 01:56:47 · 141 阅读 · 0 评论 -
ES6语法学习(一)
强烈推荐的学习公众号一直以来都有关注web前端开发这个公众号,里边会有些很实用的文章分享,强烈推荐哦!公众号里有视频学习,很实用,通俗易懂!知识点记录1. 标签模板字符串:通过highlight处理模板字符串,返回我们想要的字符串 function highlight(strings, ...arr){ const handletag = arr.map(value => `<span class="highlight">${value}</span&原创 2021-07-04 21:46:34 · 107 阅读 · 2 评论 -
JavaScript基础知识:文章汇总
JavaScript基础知识:Object对象JavaScript基础知识:数据类型JavaScript基础知识:日期和时间JavaScript基础知识:函数进阶(一)JavaScript基础知识:函数进阶(二)JavaScript基础知识:函数进阶(三)JavaScript基础知识:对象属性配置JavaScript基础知识:原型继承JavaScript基础知识:Class 基本语法(一)JavaScript基础知识:Class 静态属性和静态方法(二)JavaScr原创 2021-02-24 13:52:37 · 118 阅读 · 0 评论 -
JavaScript基础知识:浏览器(二)
查找元素1. getElement*使用 getElement 常用的获取方式:1) document.getElementById(id) :通过 id 获取2)elem.getElementsByTagName(tag) :查找具有给定标签的元素,并返回它们的集合。3) elem.getElementsByClassName(className) :返回具有给定CSS类的元素。4) document.getElementsByName(name) 返回在文档范围内具有给定 na原创 2021-02-24 13:43:39 · 181 阅读 · 0 评论 -
JavaScript基础知识:浏览器(一)
一、文档对象模型(DOM)1.定义文档对象模型(Document Object Model),简称 DOM,将所有页面内容表示为可以修改的对象。document 对象是页面的主要“入口点”。我们可以使用它来更改或创建页面上的任何内容。document.body.style.background='#f00';2.DOM树<html> = document.documentElement<body> = document.body<head> =.原创 2021-02-23 17:31:22 · 188 阅读 · 0 评论 -
JavaScript基础知识:模块(Module)
一、模块核心功能1. 始终默认使用 “use strict”<script type="module"> a = 5; // 报错 error</script>2.模块级作用域一个模块中的顶级作用域变量和函数在其他脚本中是不可见的<script type="module"> // 变量仅在这个 module script 内可见 let user = "John";</script><script type="module原创 2021-02-23 16:07:06 · 937 阅读 · 1 评论 -
JavaScript基础知识:错误处理(二)
扩展 Error先了解下JavaScript 自身定义的内建的 Error 类的“伪代码”class Error { constructor(message) { this.message = message; this.name = "Error"; // (不同的内建 error 类有不同的名字) this.stack = <call stack>; // 非标准的,但大多数环境都支持它 }}然后,再看下使用案例:class ValidationE原创 2021-02-22 14:11:57 · 159 阅读 · 0 评论 -
JavaScript基础知识:错误处理(一)
try…catch1.语法try{ //代码块}catch(err){ //错误捕获}说明:1)首先执行 ** try ** 中的代码;2)如果没有错误会一直执行到 ** try** 结束,跳过 catch(err) 继续执行;如果有错误,则停止执行 try, 控制流转向 catch(err) 开始处执行,变量 ** err ** 包含了所发生事情的详细信息的 error 对象所以,try {…} 块内的错误不会杀死脚本 — 我们有机会在 catch 中处理它。try…原创 2021-02-22 13:14:15 · 197 阅读 · 0 评论 -
JavaScript基础知识:Class 其它(三)
内部接口和外部接口此篇仅作概念了解用。1)在面向对象的编程中,属性和方法有两组:内部接口:可以通过该类的其他方法访问,不能从类的外部访问的属性和方法;外部接口:也可以从类的外部访问方法和属性就面向对象编程(OOP)而言,内部接口与外部接口的划分被称为 封装。2)在** javascript ** 中,有两种类型的对象字段(属性和方法):公共的:可以从任何地方访问。它们构成了 外部接口。私有的:只能从类的内部访问。它们构成了 内部接口。3)为了隐藏内部接口,我们使用受保护的或私有的原创 2021-01-20 14:44:12 · 191 阅读 · 0 评论 -
JavaScript基础知识:Class 静态属性和静态方法(二)
一、静态方法1. 理解含义我们可以把一个方法赋值给类的函数本身,而不是赋给它的 “prototype”。这样的方法被称为 静态的(static)。在类中,静态方法以 static 关键字开头看个具体例子:class User{ static staticMethod(){ console.log(this === User); }}User.staticMethod(); // truelet user = new User();user.st原创 2021-01-20 13:25:25 · 1340 阅读 · 0 评论 -
JavaScript基础知识:Class 基本语法(一)
一、Class 语法class MyClass{ constractor() {} //初始化对象 method1() {} //类的方法间没有逗号 method2() {} method3() {} ...}let myClass = new MyClass()在 JavaScript 中,类是一种函数。如下,技术上来说,MyClass 是一个函数(我们提供作为 constructor 的那个),而 methods、getters 和 settors 都被原创 2021-01-19 14:56:26 · 363 阅读 · 0 评论 -
JavaScript基础知识:原型继承
[[prototype]]在 javascript 中, 对象有个隐藏的属性 [[prototype]] ,它要不是 == null ,就是对另一个对象的引用 ==,而该对象就称为原型。当我们从 object 中读取一个缺失的属性时,JavaScript 会自动从原型中获取该属性。在编程中,这种行为被称为“原型继承”。如下图:1. 使用[[prototype]]是内部的且隐藏的,我们可以通过** proto **设置它, 方法如下:如果我们从 rabbit 中读取一个它没有的属原创 2021-01-18 14:13:46 · 235 阅读 · 4 评论 -
JavaScript基础知识:对象属性配置
一、属性标志和属性描述符1. 属性标志对象属性所具有的标志有:1)value : 获取对象属性的值;2)writable — 如果为 true,则值可以被修改,否则它是只可读的。3)enumerable — 如果为 true,则会被在循环中列出,否则不会被列出。4)configurable — 如果为 true,则此特性可以被删除,这些属性也可以被修改,否则不可以后三个通常不会出现,因为常规创建对象的时候,三者默认为true,但我们也可以随时更改它们,2. 属性描述符获原创 2021-01-15 16:01:05 · 461 阅读 · 0 评论 -
JavaScript基础知识:函数进阶(三)
一、原创 2021-01-08 15:35:07 · 127 阅读 · 0 评论 -
JavaScript基础知识:函数进阶(二)
一、旧时var1. var 与 let 的区别1) 没有块级作用域 (不是函数作用域就是全局作用域)2) 允许重新声明3)可在声明前使用,例如:function sayHi() { phrase = "Hello"; alert(phrase); var phrase;}sayHi();人们将这种行为称为“提升”(英文为 “hoisting” 或 “raising”),因为所有的 var 都被“提升”到了函数的顶部。声明会被提升,但是赋值不会。2. IIFE以前jav原创 2021-01-07 13:36:48 · 174 阅读 · 0 评论 -
JavaScript基础知识:函数进阶(一)
一、Rest参数和Spread参数当我们在代码中看见 ’ … '时,它要么是 rest 参数,要么就是 spread 语法。-区分方法:*若 … 出现在函数参数列表末尾,则是 rest 参数,它会把剩余的参数放到一个数组中;*若 … 出现在函数调用或类似的表达式中,则为 spread 语法,它会将一个数组展开为列表。-使用场景:*rest参数:用于创建可传任意参数的函数;*spread语法:用于将数组传递给需要许多参数列表的函数;Restfunction sumAll(...原创 2021-01-06 13:37:53 · 133 阅读 · 0 评论 -
JavaScript基础知识:日期和时间
一、Date对象Date对象用于处理时间和日期1)创建 Date 对象,有以下四种形式:let d = new Date(); //无参数,表示当前日期/时间let d = new Date(milliseconds); //传整数参数(时间戳),表示自 1970-01-01 00:00:00 以来经过的毫秒数let d = new Date(datestring); //传字符串,例n原创 2020-12-30 11:13:42 · 221 阅读 · 0 评论 -
JavaScript基础知识:数据类型
一、舍入Math.floor 向下舍入 3.1 --> 3 , -1.1 --> -2Math.ceil 向上舍入 3.1 --> 4, -1.1 --> -1Math.round 向附近取整 3.1 —> 3, 3.4 --> 4, -1.1 --> 1如果想要把小数舍入到指定的位数时,有两种方法:1)使用 Math.floorlet原创 2020-12-25 16:41:29 · 168 阅读 · 1 评论 -
JavaScript基础知识:Object对象
#对象方法在代码中,通常通过创建对象来表示真实世界中的实体,如用户和订单等;在现实世界中,用户可进行操作(例如登录、注销),这些操作被我们可称为行为;在javascript中,这些行为则由对象属性中的函数来表示;而这作为对象属性的函数被称为 方法。#构造器(构造函数)##什么情况下用一般定义对象是let user = { … }, 但是有时我们可能需要建立多个这样的对象,例如多个用户的情况,时可以使用构造函数和 “new” 操作符来实现。主要目的 —— 实现可重用的对象创建代码。构造函数技原创 2020-12-23 14:18:13 · 157 阅读 · 0 评论 -
获取浏览器及Dom宽高
参考文章:https://blog.youkuaiyun.com/qq_36947128/article/details/80324538http://www.cnblogs.com/jin-zhe/p/10506238.htmlhttps://www.cnblogs.com/jyybeam/p/6183663.html以元素的高度为例(宽度同理),一般会用到下边四种获取高度:height、offsetHeight、clientHeight、innerHeight<style>原创 2020-08-14 15:35:20 · 310 阅读 · 0 评论 -
JavaScript知识点学习
1.高阶函数1)filterfilter中的回调函数有一个要求,必须返回一个布尔值;true:返回true时,函数内部会自动将这次回调的n值加入到新的数组中false:返回false时,函数内部会过滤掉这次的n//案例要求:返回数组中100以下的值const nums = [10,50,150,200,20,30,80,300];let newNum = nums.filter(function(n){ return n < 100})2)map可以对数组里.原创 2020-05-26 13:23:39 · 202 阅读 · 0 评论