自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(30)
  • 收藏
  • 关注

原创 node中的标准流

使用标准流可以帮助node应用和控制台之间进行通信标准输入(stdin):process.stdin.setEncoding('utf-8');process.stdin.on('readable',function(){var input=process.stdin.read()})标准输出(stdout):process.stdout.write(input)标准错误(stderr)...

2021-03-13 16:58:24 177

原创 面向对象——继承

示例代码function SuperClass(){}function SubClass(){}(一)类式继承实现:将父类的实例对象赋值给子类的原型prototypeSubClass.prototype = new SuperClass()优点:继承了父类的this上的属性和方法,并且继承了父类原型上的属性和方法可以使用instanceof判断一个实例对象是否为某对象上的实例(会随着原型去判断)。注意:SubClass instanceof SuperClass结果为false,因为ins

2020-12-14 17:50:22 89

原创 面向对象——封装

JavaScript中实现类:函数名大写,使用new关键字进行实例化(ES6中引入了class关键字实现类)封装属性和方法私有属性(方法):利用函数作用域,直接在函数内定义的属性或方法,在外部不能访问静态属性(方法):直接使用类名点方法添加(该属性或方法只能通过类名调用)公有属性(方法):挂载在原型上(所用实例都可以访问和修改)实例属性(对象共有属性):绑定到this的属性方法(每个实例独有,互不干扰)构造器:绑定到this的可以改变实例属性的方法闭包:是有权访问另外一个函数作用域中变量的

2020-12-14 17:08:49 121

原创 JavaScript中的图

JavaScript中没有图这种数据结构,我们可以使用object和array来实现图的表示(这里使用邻接表表示)const graph = { 0:[1,2],//表示0可以到达1和2 1:[1,2]}图的深度优先遍历访问根节点依对根节点没有访问过的相邻节点进行深度优先遍历let visited = new Set()//使用集合来记录访问过的节点const dfs = (n)=>{ console.log(n)//访问 visited.add(n) graph[n]

2020-12-12 11:20:44 111

原创 JS中的集合与字典

集合JS中没有集合这种数据结构,在ES6中,Set就是集合的实现集合的特点:无序且不重复数组与集合的转化:数组转集合:new Set(arr)集合转数组:[…set]集合的作用数组去重(将数组转换为集合再转换为数组)判断某元素是否在集合中(Set有个has方法,可以直接判断)求交集(将其中一个转化为数组,利用数组的filter 方法和Set的has方法)字典ES6中的Map实现了字典字典的特点:无序且唯一,以键值对形式存储字典的操作增 map.set('name','val

2020-12-11 20:44:09 606

原创 JavaScript实现二叉树以及先中后序遍历

JS实现二叉树js没有树这个数据结构,使用object实现const tree = { value:'a', left:{vlaue:'b',left:{},right:{}}, right:{vlaue:'b',left:{},right:{}}}对二叉树进行先序遍历访问根节点对左节点进行先序遍历对右节点进行先序遍历const preorder = (root)=>{ if(!root) return console.log(root.value) preorder

2020-12-11 11:52:09 105

原创 JavaScript实现树以及对树的常用操作

JS实现树JavaScript没有树这种结构,使用object以及array实现。const tree = { value:'a', children: [ {value'b',children:[]}, {value:'c',children:[]} ]}深度优先遍历访问根节点对根节点的children挨个进行深度遍历const dfs = (root)=>{ if(!root) return console.log(root.value) root.chil

2020-12-11 11:35:59 469

原创 解构赋值

解构不成功,变量的值为undefined等号右边的值不是数组或者不是可遍历的解构,会报错对象非解构赋值,变量必须与属性同名(无顺序可言),不同名值为undifined别名用法let { foo: baz } = { foo: 'aaa', bar: 'bbb' };(baz为别名,可直接使用)嵌套解构:let obj = { p: [ 'Hello', { y: 'World' } ]};let { p, p: [x, { y }] } = obj;x // "H.

2020-10-12 20:18:58 51

原创 let和const

let有块级作用域(let声明的变量仅在块级作用域内有效)let存在变量提升(使用前必须先定义)let的暂时性死区(如果区块中存在let和const命令,这个区块对这些命令声明的变量,从一开始就形成了封闭作用域。凡是在声明之前就使用这些变量,就会报错),以下代码会报错var tmp = 123;if (true) { tmp = 'abc'; // ReferenceError let tmp;}let不允许在相同作用域内,重复声明同一个变量const声明一个只读的常量。一旦声.

2020-10-12 19:02:37 180

原创 JS之class知识点

类名后面没有括号必须有一个constructor(this指向实例)类方法不用function关键字,方法之间不需要用逗号隔开,否则会报错类的数据类型就是函数,类本身就指向构造函数(Point === Point.prototype.constructor // true)事实上,类的所有方法都定义在类的prototype属性上面。类的内部所有定义的方法,都是不可枚举的(不能使用Object.keys遍历到)实例的属性除非显式定义在其本身(即定义在this对象上),否则都是定义在原型上类中的.

2020-10-07 22:25:04 165

原创 JS数组方法

var arr1 = [1,2,6,8,1,0,5,78] var arr2 = [] //对原数组有影响 arr1.push(1)// push方法(在数组末尾插入值) arr1.pop()//将最后一个元素删除 arr1.unshift(1)//在开头插入值 arr1.shift()//将第一个元素删除 arr1.splice(1,1,5,7)//删除并插入,第一个参数:开始位置索引,第二个

2020-09-21 20:17:53 56

原创 IE与其他浏览器的一些差异

阻止浏览器默认行为IE: event.returnValue()其他浏览器:event.preventDefault()添加事件:DOM0级事件一样,DOM2级IE:element.attachEvent("click",function(){})其他:element.addEventListener("click",function(){},false)//默认为false,表示冒泡阶段触发阻止事件传播(阻止冒泡和捕获)IE:event.cencleBubble = true其他:e.

2020-09-12 16:14:10 299

原创 JS类型判断

假设要判断的变量是a判断NaN方法一:isNaN(a)函数,返回布尔值方法二:a!==a (原理:不等于自身)typeof(a)返回数据类型null会返回Object引用类型:function会返回function,其他返回Objectinstanceof:a instanceof B 返回布尔值,判断a是否为B的实例,检测的是原型注意[] instanceof Array 为true,[] instanceof Object也为trueconstructornull和undefine

2020-09-05 12:57:52 135

原创 promise链式调用

var p1 = new Promise((resolve, reject) => { // console.log('new Promise'); setTimeout(() => { console.log(1); resolve(111) }, 1000)});var p2 = new Promise((resolve, reject) => { setTimeout(() => { console.log(2); resol

2020-08-21 17:01:41 74

原创 普通函数和箭头函数的区别

箭头函数没有arguments对象,如果要使用,可以用rest代替箭头函数不能当做构造函数,即不能new(用了会报错)this:普通函数的this总是指向调用它的那个对象(代表当前对象),箭头函数没有自己的this,他的this指向定义它的环境(代表上层对象),任何方法都改变不了他的指向没有原型属性没有变量提升,定义一定要在调用之前...

2020-08-18 21:33:37 98

原创 CSRF原理及解决方案

概念CSRF即Cross Site Request Forgy,跨站请求伪造。原理用户浏览并登陆(存在CSRF漏洞的)信任网站A网站A验证通过,给用户返回一个cookie用户在未登出的情况下(cookie未过期)登陆了恶意网站B网站B带上网站A的身份(cookie)对网站A发起请求(修改你的密码,购物,转账,偷窥你的个人信息等)A并不知道请求是B发送的,会处理该恶意请求。防御CSRF的策略详情查看验证 HTTP Referer 字段在请求地址中添加 token 并验证在 HTTP

2020-08-08 15:50:25 553

原创 VUE路由懒加载

为什么需要路由懒加载?使用懒加载前import Vue from 'vue'import Router from 'vue-router'import find from "../common/find.vue"import my from "../common/my"import friend from "../common/friend"import message from "../common/message"import unLogin from "../components/u

2020-08-05 16:33:36 379 1

原创 前端性能优化

图片懒加载实现代码参考实现原理:当滚动条拉动到某个位置时,即将进入可视范围的图片需要加载。实现的过程:生成<img data-src="http://tid.tenpay.com/”url”>标签时,用data-src来保存图片地址;记录的图片data-src都保存到数组里;对滚动条进行事件绑定,假设绑定的函数为function lazyload(){};在函数lazyload中,按照下面思路实现:计算图片的Y坐标,并计算可视区域的高度height,当Y小于等于(height+

2020-08-05 15:23:12 85

原创 碰到的前端面试题

谈谈对vue的模板引擎Vue使用了Mustache(胡子)语法,即双大括号的语法。模板引擎: 负责组装数据,以另外一种形式或外观展现数据。优点:可维护性(后期改起来方便); 可扩展性(想要增加功能,增加需求方便); 开发效率提高(程序逻辑组织更好,调试方便); 看起来舒服(不容易写错)v-show和v-if的区别查看详情谈谈JS中的继承查看详情vue虚拟DOM的理解查看详情vue生命周期钩子函数查看详情Generator生成器函数的简单理解查看详情说说深浅拷贝点击查看谈谈J.

2020-08-03 20:21:36 76

原创 localStorage的使用

删除localStorage//清空localStorage.clear()//删除某个localStorage.removeItem("name")存储localStorage.setItem("name","value")//或者可以这样localStorage.name = "value"读取localStroge.getItem("name")//或者可以这样localStorage.name//读取全部localStorage.valueOf()//读取第i条数据

2020-08-01 12:20:22 145

原创 cookie记录登录状态

先说下对cookie的相关操作:cookie的常用操作设置存储cookie通过document.cookie就可以设置cookie,cookie的本质就是存储在浏览器端的字符串,字符串的格式的键值对的方式,cookie常用的参数有name,value,expiresname参数:存取的cookie名称value参数:存取的cookie值expires参数:过期时间下面封装一个设置存储cookie的函数:/** * 创建和存储cookie * @param {string} c_name c

2020-08-01 12:02:25 548

原创 git教程(学习笔记)

git是什么?Git是目前世界上最先进的分布式版本控制系统下载地址官网配置配置用户名和邮箱git config --global user.name "Your Name"git config --global user.email "[email protected]"global参数,用了这个参数,表示你这台机器上所有的Git仓库都会使用这个配置,当然也可以对某个仓库指定不同的用户名和Email地址。Your Name参数是你要设置的用户名[email protected]参数是你的邮

2020-07-30 15:42:40 126

原创 JS数据类型检测

数据类型的检测,可以用typeof、instanceof、constructor、toString()。typeoftypeof对于基本数据类型判断是没有问题的,但是遇到引用数据类型(如:Array)是不起作用的// 1.typeofconsole.log(typeof ""); //stringconsole.log(typeof 1); //numberconsole.log(typeof true); //booleanconsole.log(typeof null);

2020-07-24 16:18:17 55

原创 JS中的继承

原型继承实现思路:使子函数的prototype = new 父函数(子类中创建父类的实例)function parent() { this.name = "baiying"; this.age = 18; this.getName = function () { console.log(this.age + "岁的" + this.name); }}function child() { this.hobby = 'eat';}child.

2020-07-24 11:19:52 80 1

原创 VUE虚拟DOM的理解

为什么vue等的这些mvvm框架比传统的操作dom渲染页面要快?虚拟DOM概念JavaScript等语言操作dom等频繁dom操作会使页面速度降低。虚拟dom就是用js对象模拟真实的dom节点,将dom操作反映在虚拟dom上(操作内存中的js对象),再将最终的js对象映射到真实的dom上,再由浏览器渲染,从而加快速度,解决浏览器性能。dom更新当data中的数据改变时,将新的数据结合之前的虚拟dom形成新的虚拟dom,然后将新的dom树和旧的dom树进行对比(diff算法),最后将对比出来的差异部

2020-07-21 15:56:21 263

原创 v-if和v-show的区别

v-ifv-show

2020-07-21 10:44:53 80

原创 VUE生命周期钩子函数总结

vue的8个生命周期函数总结:组件创建期间的四个钩子函数beforCreate:实例或者组件完全创建之前,会执行这个函数el,data和methods中的数据都还没有被初始化,无法访问。createddata和methods已经初始化好,可以访问。不能操作dom。beforMount模板已经在内存中编译完成,但是还没用渲染到页面中,把data放到编译完成的HTML中页面中的元素并没有替换,只是之前写的模板字符串mounted将模板的HTML挂载(渲染)到页面中,只会执行

2020-07-21 10:00:29 64

原创 Generator生成器函数的简单理解

特点Generator生成器函数function关键字与函数名之间有一个*号内部使用yield表达式,执行Generator函数生成一个遍历器对象,用该对象调用其next()方法来遍历函数内部的状态。Generator 函数调用和普通函数不同,它会返回一个迭代器当 yeild 产生一个值后,生成器的执行上下文就会从栈中弹出。但由于迭代器一直保持着队执行上下文的引用,上下文不会丢失,不会像普通函数一样执行完后上下文就被销毁举个例子function* foo(x) { console.l

2020-07-06 16:20:39 177

原创 JS深浅拷贝学习总结

浅拷贝浅拷贝只拷贝一层,对于对象内的简单数据类型,浅拷贝进行复制,而对象内的复杂的数据类型,则是复制了地址(即是指向原来的数据),如果对复杂类型进行修改,则原对象也会被修改,造成污染数据。例子var oldObj = { name: '陈冠希', inObj: { age: 18 }, arr: [1,2]}var newObj = {}//浅拷贝(循环拷贝)for(k in oldObj){ newObj[k] = oldObj[k]

2020-07-02 11:34:47 76

原创 原型及原型链

对于js中原型及原型链的理解在面试中,面试官会常会叫你谈谈原型链的理解,那么你该如何组织自己的语言呢?可以从下面几方面讲述:原型函数也是特殊的对象所有对象的 prototype 指向他的原型对象所有原型对象的 constructor(构造函数)指向他的函数所有对象都可以通过 proto 找到原型对象对象的 proto 属性指向原型一直到Object的原型对象原型链对象中__proto__组成的链条我们称之为原型链对象在查找属性和方法的时候, 会先在当前对象查找,如果当前对象中找不到想

2020-07-01 21:44:08 85

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除