自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

天明的博客

运气与机遇基于在实力之上

  • 博客(72)
  • 收藏
  • 关注

原创 vsCode里jsconfig.json无故报错

问题vscode里面我们配置完jsconfig.json文件后可能会报错。解决方法我们在settings中直接把这个打开就好了,解决报错

2020-08-18 09:44:24 8400 1

原创 b站前端校招面试题分享

前言题库来自于牛客上B站的2020前端校招笔试,刷完感觉考核得比较细致也比较全面,所以小编这边将题目都列举出来然后解析过程也都写上。整体还是有些多的要是想直接看题的话这边放个链接吧题目地址,目录上可以看到题目考点这样方便大家也可以对应查看题目,放松一下眼镜要开始看题了。题目及解析第一题:同源策略正解: A考察同源策略以及url结构的了解,初见此概念还是非常陌生的,详细介绍这边就不提了,直接解析题目,同源就是(主机名+协议+端口号【若存在】)三者相同。B项协议与题干不相同、C项端口号不相同、

2020-08-14 16:49:48 2412 1

原创 浅谈Vue-router的两种模式

前言虽然在已经写过了Vue实战篇,但还是觉得要单独的说一下Vue路由,所以就有了今天这篇深夜篇。路由原理路由实现了单页应用的更新视图但不重新请求页面,好处可想而知加载速度快、用户体验更好。先从两种路由模式说起。路由的两种模式hash模式一般,我们将url中#和它之后的字符一起称为hash,通过window.location.hash来读取,他有两个特点。hash虽然出现在url中,但是不会被包括在HTTP请求中。它是用来指导浏览器动作的,对服务端没有影响。所以,改变hash不会重新加载页

2020-08-14 16:46:26 1156

原创 「最详细」输入url浏览器干了啥?

前言这是前端一个老生常谈的一个问题了,看到这个标题可能觉得司尘要说,面试你咋回答这个问题巴拉巴拉的,但just知道怎么回答这种问题意义在哪呢?最近在看偏浏览器的一些底层知识,相信看完这篇分享必有收获,通过浏览器展开分享,做一次标题党。预备tip浏览器进程我们所有运行的程序在都是通过进程去跑动该任务,我们来看一下打开网页有哪些进程。由上到下他们分别是:浏览器进程负责界面展示、用户交互、子进程之间的通信,是一个核心进程块,他就来指挥其他进程进行操作。GPU进程chrome的UI

2020-07-21 20:32:02 783

原创 「大话webpack」从零搭建

前言最近应脚手架搭建,工程打包是基于webpack来操作,以前在学习Vue的时候也是用到的他虽然大致明白工作流程以及原理,但是这种东西实操一遍收获那是杠杠的呀,比起看文章啥的那理解一下就上来了,小编就在此分享一下从零搭建一个webpack项目。开始大话何为webpack?概念JavaScript 应用程序的静态模块打包器,应官网的一句话而言打包所有资源、脚本、样式、图片,将我们复杂的工程目录文件打包成一个轻量级的几个简略文件。webpack核心入口文件配置 (enpty)出口

2020-07-17 10:22:38 186

原创 「面面俱到」原型继承篇

前言今天的备战篇小编总结一下原型以及继承关系原型、原型链一提及到原型,那么我们首先要说明白的就是有关原型的几个参数所代表的是什么。我们先写出来一个简单的构造函数,后续就围绕这个构造函数来讲解原型就比较明了function Person() {}var person = new Person();person.name = 'sichen';console.log(person.name) prototype每个函数都会有prototype这样的一个隐式属性,总有人就直接把他定义为

2020-07-16 11:16:11 172

原创 JS字符串与数组相互转换

前言之前在面试碰到过这样类似的一个问题,这边就稍微记录一下,数组与字符串的相互转换。数组到字符串这一步的话我们就是借助join方法或者是Array.toString()方法 let arr = new Array(1, 2, 3); let string1 = arr.toString(); // "1, 2, 3" let string2 = arr.join(','); // "1, 2, 3"字符串到数组主要还是借助于split()方法 let str1 = 'a,b,

2020-07-15 11:54:28 179

原创 「面面俱到」Vue篇

前言小编所分享整理的备战系列文章里面不会是一个完全完整且系统的一个内容,主要是针对所描述的相关知识自己觉得的重点,所以有时候可能整体文章逻辑上会不是很好,55555最近要备战面试了,文章整理就压缩了一下,但还是会用心滴。以下很多东西涉及到Vue源码,小编还是简单描述一下,整理源码到文章太麻烦也不方便查看。MVC、MVVM架构模式说到Vue那么最开始我想说到的一个点就是他俩,用了这么久的Vue那么应该要知道他是MVVM软件架构设计模式。MVC从前端到后端交互,前端请求通过路由找到对应控制器拿到数

2020-07-15 09:20:41 254

原创 「面面俱到」webpack篇

前言小编之前有总结过两篇关于webpack相关配置的文章,但究其细节没有提及到webpack的一些实现原理。所以这边在补上一篇备战篇,想看webpack搭建的可以点击这里。webpack工作流程核心webpack核心组成就是下面这四个点 入口文件配置 (enpty) 出口文件配置 (output) 模块转换器 (loader) 插件 (plugins) 工作流程 初始化参数 从配置文件和 Shell 语句中读取与合并参数,得出最终的参数。

2020-07-14 17:32:50 191

原创 「面面俱到」前端须知网络知识

前言今天整理复习一下前端必修——网络主要包括http(s)、TCP/IP四层模型、DNS、CDN这几个模块内容,后面就是附上几个常见问题。HTTP概念HTTP叫做超文本传输协议,web通过该协议完成客户端到服务器端的一系列流程。HTTP是不保存状态的协议,既无状态协议,协议本身对于请求或响应之间的通信状态不进行保存,因此连接双方不能知晓对方当前的身份和状态。TCP/IP 协议族http是他的的一个子集在了解之前我们要知道基础的五层模型(如果不算实体层的话也可以说是4层),小编之前总结过一篇相关的

2020-07-14 15:33:10 333

原创 「面面俱到」CSS篇

前言迁移面面俱到整理一下关于样式部分的一些点包括我们常用的一些实现样式方法,然后就是回流重绘的一些认识。BFC什么是BFC它是由CSS2.1规范定义的,全称为Block Formatting Context。通俗来理解就是当元素被定义为块格式上下文的话,自身就形成了一个独立的盒子,让处于BFC内部的元素与外部的元素相互隔离。提及到CSS首先我们就要弄清楚BFC这个点。小编之前有结合实例介绍过,就不浪费时间再写一次了BFC介绍,这边就简单说一下。怎样创建BFC浮动绝对定位行内块级元

2020-07-14 14:52:00 138

原创 「面面俱到」JS(包含es6)基础篇

前言这段时间整理一下《面面俱到系列》,主要还是根据前端面试里面自己总结的一些问题,从基础部分起比较全面。内容非常基础但同样也非常重要,后面也有一些常见问题。当然这一部分并不是全部,后续还有需要补充的可以评论一下加上去就好了。数据类型JavaScript 共六种数据类型,分别是:undefined、null、boolean、number、string、object基本类型常见的有:string、number、boolean、null、undefined,symbol 我们就暂时不列入进去。基本

2020-07-14 09:53:44 251

原创 你想到的这都有-JS数组归总

前言芜湖~ 司尘回来了,原本转战掘金的,后来觉得其实两边都可以进行分享学习,所以还是回到了这边,文章两边都会同步的然后大家喜欢的话也可以关注一下我的掘金点击康康我,好了废话不多说了开始今天的分享。在工作之中我们所遇到最多的无非就是数组以及对象,对象很多情况下就是对他进行一个解构取到我们想要的值,那么相比起来,我们操作数组就有非常多的方法去得到自己想要的结果,司尘呆呆今天就来分享一个汇总,分三大块:存储方式、修改、遍历。文章篇幅可能有点长,但是毕竟是总结就想写详细一点,有些方法这边就一笔带过了。JS

2020-07-13 11:38:07 166 1

原创 深浅克隆实现

存储状态存储地址分为堆、栈这两种基本类型基本类型因为数据大小固定存储在栈之中引用类型引用类型因为数据大小不固定存储在堆之中深浅克隆基本类型克隆let a = 1;let b = a;b = 2;console.log(a); // 1console.log(b); // 2基本类型存入栈之中克隆后不会影响到被克隆对象引用类型克隆let arr...

2019-07-14 09:19:24 291

原创 Promise

基础理解定义定义promise函数会返回表示异步操作的promise对象,类似于承诺未来某个时刻完成。let promise = readFile("text.txt");promise.then((content)=> { console.log(content);}), function(err) { console.log(err);}三种状态...

2019-07-12 10:14:30 124

原创 git 详细解析

git 操作在实际应用中很作用很大,这项操作当然不仅限于我们怎样上传一个项目到git hub上,简单说就是用于管理多人协同开发项目的技术,很有必要好好了解一下工作区域在了解git指令之前熟悉他的工作区域是很有必要的,git操作实际上分为4个区域工作目录暂存区资源区远程仓库我们先通过一张图来看一下他们之间的联系在结合下面的指令介绍大家就能明白git实际是怎样工作的git指令...

2019-06-13 20:06:57 391

原创 CSS框架LESS-语法总结

变量使用变量less允许定义变量到全局样式中复用 @banner-color: #fff; .banner{ background-color: @banner-color; } // 局部定义 .banner(@banner-color: #fff){ background-color: @banner-color; }变量作用域变量定...

2019-06-06 16:52:18 2275

原创 vue-2(事件处理、表单绑定、组件)

继上一篇博客这边继续补充基础内容加强一下记忆监听事件v-on指令去监听DOM事件,后面可以接事件类型,如下案例<div id="example-3"><button v-on:click="say('hi')">Say hi</button><button v-on:click="say('what')">Say what</bu...

2019-05-29 12:33:18 509

原创 Vue-1(绑定、渲染)

vue是js的一个渐进式框架,在小编个人理解上来看,他更加方便的给我们提供了构造响应式布局的工具,那么小编这边主要是总结一下vue的基础语法,以及一些小的demo创建实例 let vue = new vue({ el:'类似于选择器,与CSS格式相同去选中DOM元素', data: { name:'司尘', hooby:[football,travel],...

2019-05-28 23:28:48 188

原创 媒体查询实现页面适配问题

通常的网络页面都会应对浏览器实际页面大小去做一些页面布局的适配,今天小编通过一个demo来实现一个简单的导航栏以及内容的适配,就是通过查询页面实际宽度来做一个响应式的布局一、视口首先我们了解一下视口这个概念,视口在pc端就等于浏览器实际页面宽度,移动端视口默认是厂家所定义的一个固定值。简单来讲媒体查询是基于视口宽度去做的一个判断,然后对应的去改变模块样式。 <!-- 这样的一行代...

2019-05-23 11:36:18 3662

原创 es6新数组功能

数组创建Array.of()在以new方法定义数组时会遇到这样的情况 let arr = new Array(2); // 如果本意是在arr数组里添加一个2元素这个就不能实现,而是定义的一个长度为2的数组容器 let arr1 = Array.of(2); //我们这样来解决该方法可以实现单参数创建Array.from()返回一个以arguments对象(类数组)组成的数组,对象...

2019-05-06 17:21:54 238

原创 es6-箭头函数this指向问题

这个问题困惑了小编很久之前的一个思路不对导致问题一直走向一个错误的方向,现在豁然开朗来跟大家一起分享一下收获无this绑定箭头函数准确来讲是没有this绑定的,在使用时它的this是继承下来的,关于箭头函数的this指向我们首先不要走进的误区就是作用域链,既然他自身都没有this那怎么会根据作用域链来找this指向呢?案例分析箭头函数中this指向只有两种情况:没有被函数包裹,...

2019-04-22 18:08:00 389

原创 es6-迭代器生成器

简化循环生成器 // 生成器函数名称前带个* // 函数表达式let createIterator = function *(items){} function *createIterator() { yield 1; //yield关键字不能往深度嵌套只能存在于构造器中 yield 2; yield 3; } // 这边同样可以以参数循环方式去构造 /...

2019-04-21 19:21:49 141

原创 es6-Set、Map

Set定义这是一种无重复值的有序列表(如果添加了重复项相当于添加无效,对象除外,因为他们不会被转为字符串类型相同的对象在其中就是两个object,也没有类型转换)。Set允许对它包含的数据进行快速访问,从而增加了一个追踪离散值的更有效方式。基本操作与方法 let set = new Set(); // 创建set对象 set.add(5); // 添加元素,也可以添加对象 set....

2019-04-20 15:42:10 94

原创 es6对象功能拓展+解构

es6拓展的对象方法Object .is()比较两个参数是否完全一致,与全等区分(例NAN全等返回false)Object.assign()将后面参数对象熟悉赋给参数1对象Object.setPrototypeOf(对象,新原型对象)改变对象原型,同理get…为得到原型super覆盖对象实例的一个方法、但依然要调用原型上的同名方法,我们之前知道对象与原型重名会调用自身,看一个实例...

2019-04-18 12:22:40 228

原创 es6-变量声明、函数

变量声明var声明有变量提升,根据之前预编译过程分析,哪怕是函数中被条件语句包裹同样也会有变量提升,var在全局中的定义相当于是给window这个大对象定义变量,且在次声明就会直接覆盖住之前的变量let、constant块级声明也就是让所声明的变量在指定块的作用域外无法被访问,const 声明会阻止对于变量绑定与变量自身值的修改,这意味着 const 声明并不会阻止对变量成员的修改(例如...

2019-04-14 11:44:28 888

原创 正则表达式在JS中的运用

正则表达式不是单纯的js范畴,所以标题这样取比较好一点,正则表达式运用于检测字符串格式,他所表示的是一种字符串格式,根据他索引到字符串中相应位置进行想要的操作,前面主要是小编自身为了记忆做的比较繁琐的笔记,后面会结合常见案例来说。一、定义与方法转义字符 \ :转义字符 \ 将后面所跟的内容转为文本通过它可以实现多行文本var str = "我是\ 多行文...

2019-04-01 21:43:55 507

原创 封装异步(按需)加载js函数(考虑兼容)

这篇笔记标题是最终的一个目的,那么在此之前还有几个其他的点需要做介绍。一、html文档渲染模式通俗来讲就是说网页展现的一个流程,HTML文档解析过程是单线程的,起初以一个DOMTree解析html结构(深度优先原则),当碰到标签需下载文件时会异步的进行下载,所以标签解析完成时间肯定是先于页面加载的,DOMTree完成后加载CSSTree,两者结合形成最终的渲染树randerTree,DOM...

2019-03-26 17:45:24 591

原创 JS事件类型+绑定+冒泡、捕获分析

JS事件绑定当然是为了实现与用户之间的交互效果,小编这边自己做笔记的同时也跟大家一起分享一下。一、事件绑定1.对象.on+事件=function(event){...} //这种方法兼容性好但只能为对象绑定单个事件。2.对象.addEventListener(事件,处理函数,false) //该方法常用,可以为对象绑定多个事件这边小编为第二个方法要补充的一点是,...

2019-03-20 21:08:54 202

原创 JS如何获取和修改CSS伪类属性

DOM操作是操作HTML文档,那么js如何与CSS相联系,标题是小编所要说的重点,但是不想再去写另外的一篇博客所以先还是总结一下JS如何读取标签CSS属性方法。1.对象.style.属性这种方法只能读取行间的CSS属性,但他特别在通过js只能采取这种方法去改变标签样式(也是相当于在行间加属性值),所以可以看出行间样式优先级大于写在CSS中(除非在属性后加上 !important)2.w...

2019-03-19 17:42:10 4330

原创 JS标签选择器以及节点操作

JS的DOM开始当然是从选择器开始的,小编这边先做一个归类。一、DOM选择器document代表整个文档这边就省略他的开头了1. getElementById( ) //显然是用作与获取id来获取标签(实战中不常用)2.getElementByTagName( ) //通过标签类型来获取节点(常用)3.getElementByClassName( ) //...

2019-03-19 15:21:21 17693 1

原创 JS之try、catch(错误类型归类)

在之前学习java的时候小编就已经接触过try、catch,那么功能相同这边只是做个介绍。一、try、catchjs代码用他包裹,catch为空时当有错误时会直接跳过try包裹部分错误执行try之后的代码,catch不为空时try中出线错误那么try中截断代码跳到执行catch中执行,这个并不难理解。看一个实例: var arr=['a','b','c']; v...

2019-03-19 14:33:58 4460

原创 JS中数组乱序、去重

这是小编对之前数组环节内容的补充,介绍乱序以及去重,直接撸上代码。一、数组乱序主要是数组sort( )方法的一个引申,我们知道sort是根据参数正负值来做排序判定,那么实现当然是使其随机正负值var a = [1,2,3,4,5]; Array.prototype.muddled=function(){ this.sort(function()...

2019-03-12 16:18:01 1343

原创 JS中this指向详细介绍(含案例)

JavaScript中this作用很大不仅一部分简化了代码更加使得函数功能更加强大,小编今天根据案例好好提及一下该知识点。小编这一段知识点都是有联系的如果有需要大家可以从前面几篇了解起。一、this指向总结1.全局中指向window2.函数预编译过程时指向window3.call apply改变this指向(在上一篇博客中详细提及了他们两个的作用今天就不包含在实际案例之中)4....

2019-03-11 18:24:10 754 2

原创 JavaScript继承模式

小编在上一篇博客之中所提及到的原型链其实是一种抽象的继承模式,通过prototype继承父亲属性,但这样的实际操作在对象上,每当需要继承属性那么就是要创建实际对象去实现继承,显然不是一个很好的继承模式,知识补充今天小编在介绍几种继承模式。一、call、apply方法作用:改变this指向区别:传参列表不同我们通过一个实际案例来看function Father(name,age...

2019-03-10 13:40:05 183

原创 JavaScript构造函数及原型相关介绍

JS之中构造函数格式上与函数定义相同,之前java基础之中我们通常用new来生成对象,那么构造函数也如此。一、简单的构造函数function Obj(name,age){ this.name=name; this.age=age; } var obj1=new Obj("zhamg",12);构造函数我们...

2019-03-08 18:17:07 326

原创 JavaScript闭包详细讲解(含案例)

小编上一篇博客所介绍的预编译问题,主要是给大家强调js中AO、GO对象,而这所有的都是为了闭包做一个铺垫,经历了一天的倒腾跟进化了一样,话不多说开始今天的分享,每一个知识点都会有实际案例,希望对大家有帮助。一、作用域链scope在介绍闭包之前我们要了解这样的一个东西——作用域链,在js代码执行时,所产生的的AO、GO对象存储在一个作用域链之中,我们把scope想象成一个数组每一个函数运行所...

2019-03-06 22:09:29 1998 4

原创 深度分析JavaScript中预编译现象

在学习前端js过程中我们知道,js代码是单线程进行编译操作,但是这并不代表是完全按照代码顺序去执行一些语句,今天小编带大家来深度认识一下就是代码预编译过程到底实现了什么,(前提小编多啰嗦两句平时写代码过程之中我们只是刻意的去避免了预编译带来的问题,但是并不代表这个知识点我们不需要去了解)。前面是一些概念性的东西后面小编会通过很多案例去跟大家一起理解攻克。干货:一、什么是预编译预编译用通...

2019-03-03 20:08:45 238

原创 解决文字溢出盒子问题

通常我们实战之中会遇到文字溢出盒子的问题,那么怎样去解决小编这边罗列了几种情况以及解决方法。1.单行文字溢出单行文字溢出我们用CSS操作有一个三件套whitespace:nowrap; /*这边是阻止文字换行*/overflow:hidden; /*隐藏溢出部分*/test-overflow:ellipsis; /*用点代替被切断文字*/2.多行文字溢出解决...

2019-02-25 20:54:43 7252 2

原创 CSS实现三角形

有时候在页面之中我们会碰到一些小三角,那么在实现上当然不只是简单的图片,今天小编来介绍一下用CSS如何制作一个小三角形,话不多说直接撸上代码:&lt;style&gt; div{ margin: 100px auto; /*这边只是让盒子在页面中居中*/ width: 0; height: 0; /*实现三角形必须给盒子...

2018-11-29 17:06:01 259

空空如也

空空如也

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

TA关注的人

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