![](https://img-blog.csdnimg.cn/20201014180756926.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端
文章平均质量分 50
输出是最好的学习方式
这个作者很懒,什么都没留下…
展开
-
通过http server访问vue build之后的文件
问题来源npm 工具类项目需要展示给公司的很多人,因此需要在线上发布,发布的时候报错,无法发布成功。衍生问题-- 如何在本地运行build之后的html文件如果右键打开会报上面的错误,仔细一看,直接右键打开的方式,用的是file协议,如果需要引入依赖的话,需要使用http协议,因此需要在本地安装http server在本地运行dist目录下的html文件,需要安装 http server使用http-server开启一个本地服务器问题本质因为原来该项目只是一个工具类项目,不需要单独发布,因原创 2021-07-02 17:08:19 · 698 阅读 · 0 评论 -
项目无法发布问题 -- vue is not defined
在项目build之后,访问页面,报错,无法找到vue,查看配置发现如下const path = require('path')const NODE_ENV = process.env.NODE_ENVfunction resolve(dir) { return path.join(__dirname, dir)}module.exports = { lintOnSave: true, // 设为false打包时不生成.map文件 productionSourceMap: fal.原创 2021-07-02 16:57:56 · 2407 阅读 · 1 评论 -
如何通过echarts绘制北京市地图并可以添加标记并可点击
首先获取城市地图所对应的json文件通过这个网站可以获取到城市地图所对应的jsonecharts 中使用的是地图的js文件 需要找到北京地图的js文件下载各个城市的js文件绘制出地图在地图上渲染数据 增加点增加弹窗最终要实现的效果...原创 2021-06-24 15:10:53 · 2810 阅读 · 2 评论 -
eslint安装及添加
eslint 格式校验添加VSCode格式化代码插件(Beautify 插件配置)原创 2021-06-15 14:43:30 · 154 阅读 · 0 评论 -
node版本错误,导致npm install安装报错
今日启动vue项目遇到的问题python环境未安装看了半天解决问题的方法,尝试了一个上午,最后问了同事之后,才知道是node版本的问题,我用的是最新的node版本,但是最新的node版本并不行。尝试安装nvm ,管理node版本node 版本管理需要安装nvm解决nvm下载node8.12.0 缓慢的问题通过where nvm 获得nvm的安装路径将下面两行代码复制到setting文件中,并保存node_mirror: https://npm.taobao.org/mirrors/n原创 2021-06-15 13:56:54 · 930 阅读 · 2 评论 -
nginx反向代理解决跨域问题
修改的文件和字段文件是 niginx.conf 文件字段是 server 字段中的 路径下的 proxy_pass 字段server { # nginx监听所有127.0.0.1:80端口收到的请求 listen 80; server_name 127.0.0.1; # Load configuration files for the default server block. include /etc/nginx原创 2021-05-10 20:46:00 · 90 阅读 · 0 评论 -
华为研究院前端面试
先说一下面试华为的感觉,我感觉面试华为那真是一种享受。面试官谦逊温柔,逻辑清晰有耐心,是个男的。哈哈…感觉就像是在跟一个哥哥说话一样,耐心而温柔。先说一下面试流程:面试流程是先是算法,考查基础的编程能力。算法题目比较简单,是给你一个素数,因为数学界已经证明了任何一个偶数都可以拆分成两个素数的和,因此该题目是给你一个范围在6-65536范围内的偶数,让你输出两个然后是问项目相关的问题,问你项目中有没有遇到什么问题。是怎么解决的?在项目中主要用到了那些前端的协助工具,如果给你一个项目,你打算怎么开始,原创 2021-04-16 13:55:15 · 747 阅读 · 0 评论 -
时间复杂度和时间复杂度 js实现数据结构和算法
logN 的含义是2的多少次方为N需要注意的是,n^2 >nlogN>n>logn>1空间复杂度的标准是每个变量的空间复杂度为1,有多少个变量,空间复杂度就为多少。原创 2021-02-25 10:26:34 · 79 阅读 · 0 评论 -
js异步
异步存在的原因js单线程 遇到请求资源 或者 延时执行的时候,如果没有异步,页面会卡死。异步的好处异步的好处是:不会阻塞代码的执行异步和同步的区别异步不会阻塞代码执行,同步会阻塞代码执行 。比如alert就是同步的。异步的应用场景等待的情况需要异步,等待的时候,不要阻塞代码执行。ajax 定时任务 网络请求异步的毁掉地狱如何解决通过promise解决 ,把多层的回调地狱改变为单层的串联。then 的写法...原创 2021-02-22 20:37:02 · 134 阅读 · 0 评论 -
JavaScript中this的指向那个对象呢?
this的取值是在函数执行时候决定的,不是在函数定义的时候决定的。function fn1(){ console.log('this is----------------------',this)}fn1()fn1.call({x:100})const fn2 = fn1.bind({x:200})fn2()以上函数打印结果分别为 Object 、{x:100},{x:200}注意 通过两种方式可以改变函数this的指向:call和bind,bind是返回一个新的函数,而call是直原创 2021-02-21 17:12:34 · 146 阅读 · 0 评论 -
闭包
闭包自由变量的查找,是在函数定义的地方,向上级作用域查找。不是在执行的地方作用域分为三种:全局作用域函数作用域块级作用域 -->{}function print(fn){ let a = 200 fn()}let a =100function fn(){ console.log(a)}print(fn)function create(){ let a =100 return function(){ console.log(a) }}let fn =原创 2021-02-21 16:53:03 · 145 阅读 · 0 评论 -
原型和原型链
在js中,class只是一个语法糖 ,本质是function隐式原型和显示原型 [ proto and prototype]每个class 都有显示原型,每个实例都有隐式原型,每个实例的隐式原型指向class的显示原型。实例在执行时,先找自身的属性和方法,如果找不到,再去隐式原型中找属性和方法。对于有继承关系的类,子类有隐式原型,指向父类的显示原型。因为所有的类都是继承Object类的,所有所有的类既有显示原型,就是自己类的方法,还有隐式原型,就是自己父类的方法。值得注意的是,object类的因原创 2021-02-21 11:24:31 · 107 阅读 · 0 评论 -
vue的高级特性
考察vue的掌握深度和全面度自定义v-model应用场景:颜色选择器<template> <!-- 例如:vue 颜色选择 --> <input type="text" :value="text1" @input="$emit('change1', $event.target.value)" > <!-- 1. 上面的 input 使用了 :value 而不是 v-model原创 2021-02-10 19:46:51 · 255 阅读 · 0 评论 -
vue 组件面试题
props和$emit父子组件之间的通讯方式,父组件向子组件传值,通过在便签属性上用v-bing传值,子组件通过 props接收。子组件向父组件传值,需要子组件在组件内通过$emit触发一个事件,触发时间时,携带事件名和参数,父组件通过在组件标签上监听事件来处理子组件传递过来的值。<button @click="deleteItem(item.id)">删除</button> deleteItem(id) { this.$emit('delete',原创 2021-02-10 15:49:14 · 1024 阅读 · 0 评论 -
vue基础使用面试题
v-for 和v-if不能同时使用原因是v-for的优先级比v-if的优先级要高 会导致渲染多次 判断多次key 不能乱写 key尽量不要用index数组遍历两个变量遍历对象是三个变量事件参数 不需要传参数 则event 直接可以获取 如果有参数 则需要和参数一起带过去 带过去的方式 $event事件修饰符案件修饰符 阻止单击继续传播event是什么? 是不是原生的引用对象构造函数是mouseEvent 是原生的eventevent.target 是挂载到当前元素下表单用v原创 2021-02-10 11:29:42 · 79 阅读 · 0 评论 -
vue插槽
本篇重要介绍了具名插槽和作用域插槽的应用场景原创 2021-02-09 16:18:11 · 61 阅读 · 0 评论 -
webpack 性能优化方案
webpack 性能优化方案总结跟上技术迭代安装最新的node npm yarn等. loader 在尽可能少的模块上应用 Loader利用js loader 用include exclude 限定范围Plugin 尽可能精简并确保可靠: 例如css代码压缩,在dev环境不用压缩,因为只有我自己看,线上加载速度慢点没事。resolve参数合理配置只有逻辑性文件才放到extenionsdllplugin 把用到的第三方包打包到一个文件中,只打包一次因为第三方包是不是变的,我们只要把我们原创 2021-02-08 15:33:52 · 112 阅读 · 0 评论 -
webpack学习重点知识总结
本文是我在学习webpack是对重点内容做的笔记。原创 2021-02-07 16:44:48 · 203 阅读 · 0 评论 -
axios复习重点知识总结
该文章记录了我在通过视频学习axios时,重要的知识点总结。该部分内容已经通过代码进行了实践。原创 2021-02-04 18:48:24 · 512 阅读 · 0 评论 -
ajax复习重要知识点笔记
主要通过原生的xmlHttpRequest对象发送请求第二步 load事件 第三步 open and send method:xhr下的load事件,用来监听xhr请求是否成功 请求是否成功完成。<script> let xhr = new XMLHttpRequest() xhr.onload = function(){ console.log('请求已经完成') } xhr.open('post原创 2021-02-03 14:46:53 · 89 阅读 · 0 评论 -
koa依靠node建立后端服务器
koa的作用快速搭建后端环境,这样后端可以编写相关代码,前端也能发起各种http请求可以请求静态资源,也可以通过路由请求后端数据。koa框架是依赖node.js开发,而node.js只是作为后端执行环境,后端语言是js路由指如何定义应用的端点以及如何响应客户端请求前端在浏览器中输入的url地址就是路由。在koa中已经搭建好了路由的响应。C:\Users\11697>npm i -g koa-generatornpm WARN deprecated mkdirp@0.5.1: Lega原创 2021-02-03 10:39:57 · 301 阅读 · 0 评论 -
vue基础知识笔记
vue 如何为HTML标签动态绑定属性v-bind指令格式为 v-bind:属性名=‘变量名’ 注意变量名要放在‘’里如何实现将文本字符串识别为html元素可以在标签中添加 v-html指令 并通过给指令赋值的方式,给标签增加 html元素节点,如下图所示JavaScript的表达式在vue模板字符串中是否可以使用可以,不仅可以使用基本的运算表达,还可以实现三目运算符和函数。<!DOCTYPE html><html><head><meta cha原创 2021-02-01 16:56:39 · 106 阅读 · 0 评论 -
vue易错点总结
详细展示生命周期调用方法和获取data中的数据 ,最早是在create方法中在created方法中可以发送请求。想要操作DOM元素,最早是在mounted之后mounted之后,元素真正的挂载到了浏览器端。不同生命周期可以做的事情上面的图片详细解释了生命周期钩子里应该做哪些事情,诸位可以自行取舍,下面我们结合案例总结下:created钩子: 发ajax请求mounted钩子: 也可以发送ajax请求,更多的是操作DOM元素updated钩子: 可以用来监听路由变化beforeDest原创 2021-02-01 15:43:39 · 319 阅读 · 0 评论 -
json 数据格式化
展示数据的两种方式通过查看各种文档,目前发现了两种展示格式化展示json数据的方式,但是这两种方式都是只能展示数据,但是数据不能被修改。两种方式的区别一种是通过Chrome的扩展工具,格式化json的话,必须采用Chrome浏览器,并且必须加载完json之后,点击按钮,才能对json进行格式化。第二种是采用jQuery的jsonview插件实现的。json常用组件json常用组件列表jsonview 插件介绍jsonview插件高度可视化json数据jsonview插件是目前最热门的一原创 2020-06-02 14:37:13 · 866 阅读 · 0 评论 -
cookie session localstorage sessionstorage token的区别和联系
产生的原因因为HTTP是一个无状态的协议,因此无法在打开用户监控界面(index.html)时检测到用户是否已经登录系统的信息。用户登录成功的状态只在登录页(login.html)的当前页面有效,只要页面跳转,登录信息就会消失。因此如果用户直接请求监控界面,是无法获取到用户的登录状态,并判断用户是否有权限获取页面数据及操作页面的。cookie 和 session的具体实现机制由于HTTP的无状态性,为了使同一域名下的所有网页能够共享某些数据,让login.html和index.html关联起来,必须使原创 2020-05-28 14:39:36 · 370 阅读 · 0 评论 -
四种常见的提交数据方式对应的content-type取值
参考 四种常见的 POST 提交数据方式对应的content-type取值application/x-www-form-urlencoded 浏览器原生支持提交的数据按照 key1=val1&key2=val2 的方式进行编码,key 和 val 都进行了 URL 转码。大部分服务端语言都对这种方式有很好的支持。multipart/form-data 浏览器原生支持POST http://www.example.com HTTP/1.1Content-Type:multipart/原创 2020-05-27 14:28:07 · 314 阅读 · 0 评论 -
为什么要前端模块化以及模块化之后带来的好处和问题总结
今天看了前端模块化的相关概念和演变历史,总结一下。为什么要模块化?前端代码复杂度变高,都写在一个文件里不太好,耦合性太高,难维护,全局变量被污染的可能性大。为了实现模块化,前端开发人员都做了哪些努力?函数 方法写在全局容易造成全局变量污染 对象 全局变量少了 通过对象操作属性 对象内的属性和方法都向外暴露,都是可以被修改的,不安全 立即执行函数 看不到函数内的数据和属性 安全的问题解决了 good 立即执行函数传入参数 有的函数需要依赖其他的...原创 2020-05-24 09:18:52 · 867 阅读 · 0 评论 -
浏览器是多进程的,最重要的进程--浏览器内核(渲染进程详解)
浏览器最重要的应该干的事情就是渲染界面,完成与用户的交互。和打开tab,前进后退页面/3D绘图/加载插件相比,渲染页面用到的是最重要的进程。下面总结下,我对这部分的理解。浏览器内核进程是多线程的浏览器内核进程和js引擎线程之间的关系是浏览器渲染进程是多线程的,而js引擎只是众多线程中的一个,但是像是一个明星一样,大家似乎都在为它而服务。...原创 2020-05-24 08:59:06 · 277 阅读 · 0 评论 -
浏览器的多进程和JS的单线程
浏览器的多进程每个tab相当于一个独立的浏览器进程这个可以在浏览器的任务管理器的管理工具看到。参考 从浏览器多进程到JS单线程,JS运行机制最全面的一次梳理浏览器多进程优点提高可靠性,不会因为一个页面崩溃,引起这个浏览器的崩溃,有点像并联操作。安全性更高,一个tab中病毒,不会影响到其他页面,因为他们的资源是不共享的。【沙盒模型】避免第三方插件崩溃影响整个浏览器。多进程充分利用了多核优势浏览器有哪些进程呢?Browser进程:浏览器的主进程(负责协调、主控),只有一个。负责负责浏原创 2020-05-23 22:44:41 · 105 阅读 · 0 评论 -
箭头函数this的指向问题,严格模式下this的执行问题,非严格模式下this的指向问题总结,this的指向规律分析,严格模式带来了哪些新变化
箭头函数的this指向问题自己没有this 只能用别人的了,用谁的呢?用离自己最近的所在的位置的。在函数内,用当前函数的,函数外,用浏览器的,window对象。需要注意的是,如果在对象内,因为对象也没有this,所以也用window的。严格模式和非严格模式下,this的指向是不同的严格模式下,全局作用域下定义的函数不是windows了,而是undefined。这个问题导致了,构造函数必须要用new关键字才能调用,不然不能调用,会报错,因为构造函数有自己的this作用域,而不new的话,会被认为原创 2020-05-22 14:38:37 · 388 阅读 · 2 评论 -
通过百度高频面试题 let const var的区别,引出什么是块级作用域,简单全面的回答面试官的问题
作用域不同什么是块级作用域块级作用域是指{ }内有效的作用域。let const 是块级作用域var 是函数级作用域是否有变量提升const let 是块级作用域,不存在变量提升值是否可以被修改const指定的变量的值是不能被修改的。let特性块级作用域 {}在块级作用域内存在变量死区问题不存在变量提升...原创 2020-05-22 13:55:47 · 106 阅读 · 0 评论 -
正则表达式学习易错点和易混淆点总结
正则表达式在前端是什么?对象 在js中一切皆对象如何创建RexExp 对象 new 或者是用字面量直接创建,但是需要注意的是传入的参数必须放在//之间var re = /ab+c/;var re = new RegExp(“ab+c”);起始符号 量词 书写的时候不能有空格量词=0?0||1=1{x,y} >=x &<=y几种不同的括号{3,} 量词标志 》=3【123】 任选其一(123){4} 优先级123重复4次 123123原创 2020-05-22 13:49:32 · 156 阅读 · 0 评论 -
localhost和127.0.0.1以及本机IP的区别 以及 localhost:8080 访问 127.0.0.1;8080属于跨域吗?
localhost是什么?localhost就是一个域名,具体对应哪个IP地址只需要在host中配置一下就可以。默认是127.0.0.1 但是不恒等,可以改变。本机IP是什么?本机IP地址是与网卡绑定的,是用于外部设备访问的。127.0.0.1 是什么?127.0.0.1 是本机的用于本机自己监听的,外部设备不能访问这个IP。而且默认情况下,localhost = 127.0.0.1 而...原创 2020-04-28 16:09:41 · 7328 阅读 · 2 评论 -
javascript如何实现继承
继承的两种方式,js只支持一种,为什么呢?继承分为接口继承和实现继承,很多面向对象的语言都支持这两种继承方式。接口继承 和 实现继承的区别接口继承只继承方法签名。派生类只继承成员函数的接口(也就是声明);实现继承继承实际的方法。JS的函数因为没有签名(类似于变量的声明,只有声明,没有实现,叫签名,java支持函数的签名),因此不能实现接口继承,ECMAScript只能实现 实现...原创 2020-04-22 14:23:31 · 163 阅读 · 1 评论 -
基于Vue和elementUI的开发环境 -- 【scada项目】
开发环境一个基于 Vue 和 Element 的开发环境构建项目使用的工具npm 安装,并希望配合 webpack 使用npm和node.js的关系node.js在安装的时候会包含npmpip --pythonmaven – javanode.jsnpm 或许不能独立于node而独立运行就行pip不能在没有python的环境运行一样名称类比属性node....原创 2020-03-30 16:05:34 · 1139 阅读 · 0 评论 -
npm run dev 如何启动项目
npm run dev 如何启动项目脚手架会在根目录中找到 package.jsonpackage.json基本信息name, version, description, author, private 这些都是项目的基础信息,分别对应 vue init webpack XXXX 所填写的信息。这些信息了解一下就好,分别...原创 2020-03-30 16:02:55 · 8821 阅读 · 0 评论