- 博客(39)
- 资源 (3)
- 收藏
- 关注
RSS订阅原创 Vue子组件怎么调用父组件的方法 Vue子组件调用父组件函数的三种方法
Vue子组件怎么调用父组件的方法 Vue子组件调用父组件函数的三种方法
2022-08-08 17:44:49
4788
2
原创 Vue的生命周期钩子函数和初始化页面在哪发送请求数据合适
Vue的生命周期vue生命周期Vue 实例有一个完整的生命周期，也就是从开始创建、初始化数据、编译模版、挂载 Dom -> 渲染、更新 -> 渲染、卸载等一系列过程，我们称这是 Vue 的生命周期。生命周期钩子函数vue提前定义在组件生命周期各个阶段上，一旦发生到这个阶段，就会自动调用的函数。包括: 4个阶段和8个钩子函数: 创建组件对象前自动执行: beforeCreate()1 创建阶段: 创建组件对象后自动执行: created() 将新HTML内
2022-02-11 17:25:38
2386
5
原创 vue3种路由守卫详解
vue路由守卫1 什么是路由守卫路由守卫就是路由跳转过程中的一些钩子函数 ，在路由跳转的时候，做一些判断或其它的操作。 类似于组件生命周期钩子函数 。2 分类1.全局路由守卫beforeEach(to, from, next) 全局前置守卫，路由跳转前触发beforeResolve(to, from, next) 全局解析守卫 在所有组件内守卫和异步路由组件被解析之后触发afterEach(to, from) 全局后置守卫，路由跳转完成后触发2.路由独享守卫beforeE
2022-02-11 16:48:34
31107
4
原创 vue组件间传值父传子子传父兄弟间传值
一丶父子组件传值先在父组件中给子组件的自定义属性绑定一个 父组件的变量<template class="father"> <child :自定义属性名="父组件的变量"></child> <template >在子组件的props属性中可以取出父组件给的值，props中的变量用法和data中变量用法完全一样，只不过值的来源不同export default { name: "child", props: ["自定义属性名"],
2022-02-10 19:09:34
12294
5
原创 JS数组去重的几种方法
数组去重1 双层for循环（类似冒泡排序的双层循环写法）var arr = [2,3,4,2,34,21,1,12,3,4,1]for(var i =0;i<arr.length;i++){ //第一层：每次循环拿到arr中一个元素 for(var j=i+1;j<arr.length;j++){ //第二层：每次拿到的元素再和每次拿到的元素后边的元素依次进行比对（因为第一个要从第二个开始比，第二个要从第三个比以此类推，所以这里的j应比i大1为j=i+1）
2021-09-25 21:31:40
1999
16
原创 js数组中对象去重的方法 reduce去重
js数组中对象去重的方法let arr = [ {queuecode:"WQ000278315",queuename:"批次整合队列20190419050000002"}, {queuecode:"WQ000030521",queuename:"批次整合队列20190419050004545"}, {queuecode:"WQ000140631",queuename:"批次整合队列20170411212333002"}, {queuecode:"WQ000278315",queu
2021-06-11 10:43:39
1203
21
原创 浅谈前端面试题 JavaScript 执行上下文和执行栈
执行上下文：先看一段代码在浏览器中的执行结果：console.log(a);b();console.log(this);var a = 1;function b(){ console.log("b")}执行结果：我们都知道javascript是一种解释性语言 ，它会从上至下逐行执行，但是很明显以上代码就不是这回事。其实javascript在执行代码前，会做的一些准备工作，这就是执行上下文。全局执行上下文javascript在执行代码前，将window确定为全局执行上下文
2021-05-06 10:55:27
557
13
原创 JS数组降维的几种方法
二维数组降维使用数组实例方法concat和ES6扩展运算符降维let arr=[1,2,[3,4],5];let arr1=[].concat(...arr);//先使用扩展运算符打散最外边的数组，concat自带打散粘合数组的功能console.log(arr1);// [1, 2, 3, 4, 5]//ES6之前用apply打散数据的兼容性写法var arr2=[1,2,[3,4],5];var arr3=[].concat.apply([],arr2);console.log(a
2021-04-07 10:24:09
2037
23
转载 ES6学习笔记：Symbol
Symbol什么是Symbol ES6引入了一种新的原始型数据类型 Symbol ，表示独一无二的值。它是JacaScript的第七中数据类型（现在JavaScript的数据类型：String、Number、Boolean、undefined、null、Symbol、Object）。为什么要引入Symbol ES6前所有对象的属性名都是字符串，如果你使用了别人的一个对象，又想为这个对象添加方法时，新方法的方法名就可能和原有方法的名字冲突。ES6中的Symbol值表示独一无二的值，如果属性名使用S
2021-04-07 09:21:39
226
4
原创 ES6学习笔记： rest参数 和 扩展运算符
rest参数ES6引入用来代替arguments，收集函数的多余参数，放在一个数组中。只要有多个参数的个数不确定的时候，就首选rest参数。该运算符主要用于函数定义。// arguments变量的写法function sortNumber() { //arguments中就收集了所有的实参值 return Array.prototype.slice.call(arguments).sort((a,b)=>a-b); //强行调用数组原型对象上slice方法把arguments
2021-03-26 15:23:15
311
3
原创 js面向对象之公有属性和方法、私有属性和方法、静态方法、实例方法
公有属性和方法，私有属性和方法，静态方法，实例方法什么是公有属性和公有方法属于这个类的所有对象都可以访问到的属性叫做公有属性，都可以访问到的方法叫做公有方法。不论是公有方法还是公有属性都是一个类型下所有实例对象都有的东西。ES5：function Student(sname,sage){ this.sname=sname; // 公有属性 this.sage=sage; // 公有属性}Student.prototype.intr=function(){
2021-03-24 14:56:54
1211
5
原创 ES6 箭头函数基本用法和使用注意的点
箭头函数基本用法ES6 允许使用“箭头”（=>）定义函数。 function fun(a){ return a; }// ↓ 去掉 function 在 ( ) 和 { } 之间添加 => var fun = (a) => { return a; } // ↓ 如果只有一个形参可省略 ( ) 如果一个形参都没有，必须加( ) var fun = a => { return a; } // ↓ 如果函数体只有一句话，可省略{ }，如果仅有的
2021-03-19 13:48:28
4086
5
原创 JS常用静态方法总结
JS对象常用静态方法Object.is()用来比较两个值是否严格相等，与严格比较运算符（===）的行为基本一致。不同之处只有两个：一是+0不等于-0，二是NaN等于自身。+0 === -0 //trueNaN === NaN // falseObject.is(+0, -0) // falseObject.is(NaN, NaN) // trueObject.assign()Object.assign(newObject,object1,object2,object3...)用法：
2021-03-18 15:46:30
2630
3
原创 typeof运算符 instanceof运算符
typeoftypeof是一个一元运算符，放在其单个操作数据的前边，操作数据可以是任何类型。返回值是一个类型字符串。typeof运算符也可以加圆括号typeof(x)这样的它更像是一个函数调用。任意值在tyoeof运算后的返回值xtepeof xundefined“undefined”null“object”ture/false“boolean”任意数字或NaN“number”任意字符串“string”任意函数“function”任意
2021-03-17 16:49:56
469
6
原创 js中常用数组函数总结 reduce() forEach() every() some() map() filter()...
数组API一、会改变原数组splice()let newArr = arr.splice(start,count,value1,value2...);用法： 删除数组中的元素，会直接在原数组上操作参数： slice：开始的下标 count：删除的数量 value…：删除以后补充的元素 如果count为空表示删除到最后，value为空表示不补充任何元素；返回删除的元素，原数组会发生变化返回值： 返回一个新的数组都是要删除的元素案例：let arr = [0,1, 2,
2021-01-12 16:50:28
591
5
原创 浅谈Javascript数据属性与访问器属性 Object.defineProperty() Get() Set()
浅谈Javascript数据属性与访问器属性ES5将对象的属性进行了分类：命名属性: 能用.访问到的属性(1). 数据属性: 属性值直接保存在属性本地的属性(2). 访问器属性: 不实际存储属性值，仅提供对另一个数据属性的保护内部属性: 无法用.访问到的，但是却包含在对象内部的属性数据属性ES5将每个数据属性，都变成一个缩微的小对象，每个小对象都有这个4个属性{ //四大特性: value:"" //实际存储属性值 writable: true
2020-12-31 17:53:48
430
原创 前端面试必备：全方位理解Javascript面向对象 封装，继承，多态 prototype、__proto__、constructor new 工厂模式 原型对象 原型链 重写 重载
全方位理解Javascript面向对象一. 什么是面向对象什么是对象：对象是一组无序的相关属性和方法的集合对象是由属性和方法组成属性：事物的特征，在对象中用属性来表示（常用名词）方法：事物的行为，在对象中用方法来表示（常用动词）面向对象的优点：易维护，易复用，易扩展，由于面向对象有封装、继承。多态的特性，可以设计出低耦合的系统，使系统更加灵活，更加易于维护（c++，c#，java，javascript）面向对象缺点：性能比面向过程低（C语言）面向对象的三大特点：封装，继承，多态。
2020-12-25 17:29:55
604
4
原创 js中字符串常用方法总结 slice,substr和substring方法的对比 search() match() replace() includes()...
charAt()let str=stringObject.charAt(index)用法： 获取下标对应的字符，也可以使用数组的访问形式 字符串[下标]。参数： index（必需）：字符在字符串中的下标。返回值： 指定位置的字符。案例：let str = "helloworld".charAt(5);//str="w";charCodeAt()let str=stringObject.charCodeAt(index)用法： 获取下标对应的字符的 Unicode
2020-12-23 10:44:02
658
6
原创 js中call，apply和bind方法的区别和使用场景
call(),apply(),bind()Function.prototype.call()functionFun.call(thisArg, arg1, arg2, ...)用法： 用来在调用函数时，临时替换一次函数内部的this。参数： thisArg：调用时用来替换函数内部的this值。 arg1, arg2, …：指定的参数列表。返回值： 使用调用者提供的 this 值和参数调用该函数的返回值。若该方法没有返回值，则返回 undefined案例：//全局有一个计算器方
2020-12-21 17:07:48
569
5
原创 ES6解构赋值 数组解构赋值 对象解构赋值 函数参数解构赋值 解构 参数解构
解构赋值什么是解构赋值：按照一定的模式从数组或者对象中提取值，然后对变量进行赋值，这被称为解构赋值。数组解构赋值基本用法下标对下标。let [a,b,c]=[1,2,3];let [a,[[b],c]=[1,[[2],3]];结果: 同时声明三个变量a，b和c，a拿到值1， b拿到值2，c拿到值3。这种写法属于"模式匹配"，只要模式相同左边的变量就会被赋予相对应的值。let [,,third] = ["foo","bar","baz"] //third="baz"(解构部分)let
2020-12-17 13:52:40
718
2
原创 ES6 let var const 对比区别总结 let面试题 JS中var和let const的区别
let var constvar关键字var关键字的用法js中声明变量的关键字。var num = 1;如果在函数作用域中声明，为局部变量；如果在全局中声明，则为全局变量。num = 2;这种写法实际上是赋值，如果在函数作用域中赋值就会去找当前函数作用域中的num，如果当前作用域中没有这个变量就会接着去上一个作用域中寻找，直到找到全局，在全局中如果也并没有声明过这个变量，就会给全局对象window强行添加一个num属性进行赋值。var关键字的缺点1） var会被声明提前，会打乱程序原本
2020-12-15 11:05:43
2881
16
原创 前端面试必备：彻底搞懂什么是Promise Promise对象的特点 Promise对象的优缺点 .then .catch .finally ...
ES6 Promise一丶什么是Promise在浏览器中输出一下代码var myPromise = new Promise(function(resolve, reject){ setTimeout(function(){ resolve("hello!"); }, 500);});console.log(myPromise);看图可知：Promise是一个构造函数;__proto__属性中保存了一个地址值，指向了实例化得到的myPromise对象的原
2020-12-04 16:57:57
1568
8
原创 闭包 js中的闭包 闭包形成的原因 闭包三个特点 闭包面试题
闭包要理解闭包，首先必须理解js的变量作用域。作用域传送门全局作用域在函数的作用域的作用域链上，所以函数内部可以直接使用全局变量。函数的作用域不在全局作用域的作用域链上，所以在函数外部的全局中是无法读取函数内的局部变量。1.什么是闭包指有权访问另一个函数作用域中变量的函数（实际上就是内层函数）。（JavaScript高级程序设计的定义）2.闭包形成的原因外层函数的函数作用域对象，因为被内层函数作用域链引用这无法释放，就成了闭包3.闭包三个特点 (1). 用外层函数包裹内层函数和要保护的变
2020-10-24 00:57:09
735
4
原创 js中声明提前 hoisting 变量声明提前 函数声明提前
声明提前（hoisting）1. 什么是声明提前声明提前是发生在js引擎”预编译“的时候，是在代码运行之前。当程序开始执行前，会先将var声明的变量和function声明的函数提前到当前 作用域 中创建，赋值留在原地。传送门：中的作用域2. 变量声明提前当我们声明一个变量的时候，我们可以在其前方访问到它。如下的例子中先直接输出a并没有报错，其实是下面的var a被提起到了当前作用域的顶部先声明，但并未赋值，所以得到undefined。console.log(a);//undefinedvar
2020-10-09 10:36:37
608
3
原创 js中作用域（scope）和作用域链 全局作用域 函数作用域 函数生命周期 局部变量
作用域（scope）和作用域链1.作用域作用域其实就是一个变量的可用范围。js中有两级作用域：全局作用域 window，函数作用域。2.全局作用域全局作用域 window保存着全局变量。（其实作用域本质是一个对象，保存了当前所有变量）。保存在全局作用域中的变量成为全局变量。优点：可重复使用确定：及易被篡改3.函数作用域保存着一个函数中所有的局部变量的对象保存在函数作用域内的变量叫做局部变量优点：仅在函数内可用，函数外部无法访问缺点：不可重用函数的生命周期
2020-09-30 17:33:32
315
3
原创 彻底弄懂js中的this指向 js中各种this超详细解释 js this
JavaScript this 关键字面向对象语言中 this 表示当前对象的一个引用。在 js 中 this 不是固定不变的，它会随着执行环境的改变而改变。不管它发生什么改变，this 的指向都永远只能看this是谁调用的，而不是在哪里定义的，谁调用的函数，函数体里的this就指谁。注：以下输出没有特殊说明的都是在浏览器环境下进行。方法中的 this当前对象中的方法，需要访问当前对象中的属性，this指向的是方法调用时.前的对象。var student = { sname:'LiMing'
2020-09-17 16:05:57
3073
9
原创 js按值传递 两个变量间赋值 原始类型引用类型的按值传递
按值传递两个变量间赋值时，以及给函数传参时，只是将原变量中的值复制一个副本给对方变量或形参变量对于原始类型（number, bool, string…）的值，修改新变量，不影响原变量var a=5;var b=a;b++;console.log(a); //5对于引用类型的值（Object，Array…）的值，因为传参和赋值时，复制的是地址值的一个副本，修改新的变量中的属性，是会影响原变量的var d={f:1};var e=d;e.f++;console.log(d.f);
2020-09-16 15:27:32
1923
4
原创 JS拷贝对象 浅克隆深克隆 深拷贝与浅拷贝，实现深拷贝的几种方法
js拷贝对象 浅克隆深克隆 深拷贝浅拷贝对象简介js程序中都是用对象结构来描述显示中一个事物，对象就是一组属性和方法的集合。面向对象三大特点: 封装，继承，多态。克隆对象浅克隆是克隆 一层，深层次的对象级别的就克隆引用地址深克隆是克隆 **多层 **，每一级别的数据都会克隆出来浅克隆就是克隆了一层，除了对象是克隆的引用类型地址，其他都是 按值传递，有自己的内存空间实现浅克隆方法for in循环定义一个克隆函数用循环一个一个把对象中的属性赋值强行添加给新对象创建一个对象，对象的属性有：
2020-09-15 15:24:38
2007
9
原创 position position有几个属性 绝对定位 相对定位 固定定位 z-index
定位（position）概念将盒子定在某一个位置（最上层）标准流在最底下 — 浮动中间 — 定位最上层静态定位（static）静态定位是元素默认的定位方式，无定位的意思。它相当于border中的none静态定位是按照标准流特性摆放位置，它没有边偏移相对定位(relative)相对定位是元素对于它 原来在标准流中的位置来说的原来在标准流的区域继续占有，后面的盒子依然以标准流的方式对待它绝对定位(absolute)绝对定位 是元素以带有 定位的父
2020-09-14 09:58:04
680
原创 前端面试必备：彻底搞懂防抖和节流及其应用场景
防抖和节流函数节流和函数防抖，两者都是优化高频率执行js代码的一种方法防抖（debounce）：只要不是最后一次触发就不会发送异步请求（定时器实现）。节流（throttle）：只要第一次请求发送后，响应没回来，就不能发送第二次请求（开关变量实现）。防抖现象看下以下代码（模拟客户端向服务器发送请求）：window.onscroll = function () { console.log("发送agax请求，加载更多...");};可以看到，我仅仅向下滑动了3次，向上滑
2020-09-11 17:25:35
1958
5
原创 css隐藏元素的几种方式及区别 display:none visibility:hidden opacity 元素隐藏
元素的显示和隐藏display:none元素在页面上将彻底消失，元素本来占有的空间就会被其他元素占有，也就是说它会导致浏览器的重排和重绘，并且不会触发它的点击事件。visibility:hidden元素在页面消失后，其占据的空间依旧会保留着，所以它只会导致浏览器重绘而不会重排，也无法触发它的点击事件opacity:0将元素的透明度设置为0后，也可以视为一种隐藏，这算是一种隐藏元素的方法。和visibility:hidden的一个共同点是元素隐藏后依旧占据着空间，但我们都知道，设置透明度为0后，元
2020-09-10 09:56:49
2028
1
原创 vue项目中vscode插件 vscode插件 前端vscode插件
推荐日常开发中使用vscode的插件VSCode简介VSCode是微软出的一款轻量级代码编辑器，免费而且功能强大，对JavaScript和NodeJS的支持非常好，自带很多功能，例如代码格式化，代码智能提示补全、Emmet插件等。vscode官网精选插件1 中文界面...
2020-09-08 15:08:36
1135
6
原创 同步异步 js异步操作 单线程模型 同步任务和异步任务 任务队列和事件循环 实现异步操作的模式
JS同步和异步一、单线程模型JavaScript是一门单线程的语言，所谓"单线程"，就是指一次只能完成一件任务。如果有多个任务，就必须排队，前面一个任务完成，再执行后面一个任务。看下面一段代码在浏览器中的执行的结果：console.log( "1" );alert("2");console.log( "3" );可以看到当打开浏览器时，先输出了1，然后弹出2，点击确定才输出3（alert是同步的，会阻塞任务的执行，只有点击确定时才会继续往下执行）。二、同步任务和异步任务在JavaSc
2020-09-07 14:42:49
1709
8
原创 弹性布局flex 伸缩布局 flex布局 什么是弹性布局 justify-content
弹性布局（flex布局、伸缩布局）一、什么是弹性布局flex 是 flexible Box 的缩写，意为“弹性布局”，用来为盒模型提供最大的灵活性，任何一个容器都可以指定为flex布局注：当我们为父盒子设置弹性布局后，子元素的 float 、 clear 和 vertical-align 属性将失效.box{ display: flex;}.box{ display: inline-flex;}/*Webkit 内核的浏览器，必须加上-webkit前缀。*/.box{ di
2020-09-04 15:05:10
2891
4
原创 div水平垂直居中 div相对于父元素水平垂直居中 div相对于网页水平垂直居中
div相对于父元素水平垂直居中(相对网页水平垂直居中在下面)弹性布局父元素作为容器设置宽高、弹性布局、水平轴和交叉轴居中display:flex;justify-content:center;align-items:center;使用CSS3 transform 和 绝对定位父元素有宽高设置相对定位position:relative;子元素设置position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
2020-09-03 09:57:11
1446
4
原创 外边距溢出解决方法 高度塌陷如何解决
外边距溢出描述父元素没有上边框（border-top）或者没有上内边距(padding-top)给子元素设置上外边距，会作用到父元素上 <style type="text/css"> #parent{ width: 300px; height: 300px; background-color: gray; } #child{ width: 150px; height: 150px; background-colo
2020-09-02 10:04:37
1650
2
原创 常见块级元素行内元素行内块元素的特点和区别
标签的显示模式块级元素常见的块级元素<h1>~<h6>、<p>、<div>、<ul>、<ol>块级元素的特点(1) 独占一行(2) 高度，宽度，外边距以及内边距都可以控制(3) 宽度默认是容器的宽度的100%(4) 是一个容器及盒子，里边可以放行内或者块级元素注：只有文字才能形成段落和标题，所以 p 和 h*中不能放块级元素行内元素常见的行内元素<a>、<strong>
2020-09-01 09:03:38
1594
2
原创 什么是盒子模型，盒子模型，标准盒模型，怪异盒模型，两种盒模型的区别，box-sizing属性
什么是盒子模型CSS盒子模型就是在网页设计中经常用到的CSS技术所使用的一种思维模型。盒子模型（Box Modle）可以用来对元素进行布局，包括实际内容，内边距，边框，外边距这几个部分。盒子模型分为两种：第一种是W3C标准的盒子模型（标准盒模型）第二种IE标准的盒子模型（怪异盒模型）标准盒模型与怪异盒模型的表现效果的区别之处：1、标准盒模型中width指的是内容区域content的宽度；height指的是内容区域content的高度W3C标准盒模型下盒子的大小 = width （
2020-08-31 14:14:03
3089
4
原创 5大常见浏览器及其内核 前端网站 web 前端学习网站
5大浏览器及其内核浏览器内核备注IETrident老级内核之一，由微软开发，并于1997年10月首次在ie 4.0中使用，凭借其windows垄断优势，Trident市场占有率一直很高。然而垄断并非，没有竞争就没有进步，长期以往，Trident内核一度停滞不前，更新缓慢，甚至一度与W3C标准脱节firefoxGeckoGecko的特点是代码完全公开，因此其开发程度很高，全世界的程序员都可以为其编写代码，增加功能。ChromeBlink(Webkit)由Goog
2020-08-28 11:09:43
482
3
extensions.rar
2020-09-17
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人