Mark Sheng的博客

开局一张图，装备全靠打1、作为对象的方法调用当函数作为对象的方法被调用时，this指向该对象var obj = { a: 'yuguang', getName: function(){ console.log(this === obj); console.log(this.a); }};obj.getName(); // true yuguang2、作为普通函数调用当函数不作为对象的属性被调用，而是以普通函数的方式，...

1、什么是接口？　接口一般来讲分为两种：(1)程序内部的接口：方法与方法、模块与模块之间的交互，程序内部抛出的接口，如登录发帖，发帖就必须要登录，如果不登录不能发帖，发帖和登录这两个模块之间就要有交互，就会抛出一个接口，进行内部系统调用。(2)系统对外的接口：从别人的网站或服务器上获取资源或信息，对方不会提供数据库共享，只能提供一个写好的方法来获取数据，如购物网站和第三方支付之间，购物网站支付时可选择第三方支付方法，但第三方不会提供自己的数据库给购物网站，只会提供一个接口，供购物网站进行调...

分一下三种；局域网广域网城际网

第二周考试1.this关键字（指向问题）不管是什么场合，this：它总是返回一个对象。JS（ES5）里面有三种函数调用形式：作为对象方法的调用：函数还可以作为某个对象的方法调用，这时this就指这个上级对象。这是函数的最通常的用法，属于全局调用，因此this就代表全局对象 作为对象方法的调用：函数还可以作为某个对象的方法调用，这时this就指这个上级对象。 作为构造函数调用：所谓构造函数，就是通过这个函数，可以生成一个新对象。这时this就指这个新对象。JS（ES6）里面有一种函数

用户登陆无法实现页面跳转问题，总是将页面跳到缺省页面/ok.jsp解决方案：无法实现用户的useType校对，数据表中的userType为空页面刷新时会跳屏 原因是js中有修改css样式的语句而该js文件又放在了body底部 所以当结构生成完 样式还没有开始渲染解决方法 将动态修改font-size的js代码放在body最前部Data.parse()时间转化为时间戳出现NaN,但在PC正常当你需要将时间转化为时间戳的时候需要用到Date.parse这个方法，例如: 2019-0...

为什么会首屏白屏浏览器渲染包含 HTML 解析、DOM 树构建、CSSOM 构建、JavaScript 解析、布局、绘制等等，大致如下图所示：要搞清楚为什么会有白屏，就需要利用这个理论基础来对实际项目进行具体分析。通过 DevTools 进行分析：等待 HTML 文档返回，此时处于白屏状态。 对 HTML 文档解析完成后进行首屏渲染，因为项目中对加了灰色的背景色，因此呈现出灰屏。 进行文件加载、JS 解析等过程，导致界面长时间出于灰屏中。 当 Vue 实例触发了 mounted..

类型为了让程序有价值，我们需要能够处理最简单的数据单元：数字，字符串，结构体，布尔值等。 TypeScript支持与JavaScript几乎相同的数据类型，此外还提供了实用的枚举类型方便我们使用。强类型：强制类型的或者限制方式弱类型：可更改类型布尔值最基本的数据类型就是简单的true/false值，在JavaScript和TypeScript里叫做boolean（其它语言中也一样）。数字和JavaScript一样，TypeScript里的所有数字都是浮点数。 这些浮点数的类型

第一章 TypeScript4简介1.1、TypeScript4简介TypeScript 是由微软开发的一款开源的编程语言，TypeScript 是 Javascript 的超集，遵循最新的 ES6、ES5 规范，TypeScript 扩展了 JavaScript 的语法。TypeScript 更像后端 Java、C#这样的面向对象语言，可以让 JavaScript 开发大型企业项目。谷歌也在大力支持 Typescript 的推广，谷歌的 angular2.x+ 就是基于 Typescript

线上面试和线下面试有什么差别:1.沟通顺畅度:线上面试对网络信号有一定要求，如果信号不稳定对面试影响还是比较大的，也就是说线上面试环境干扰程度比较高2.成本:线上面试双方成本远低于线下面试，对于候选人来说线下面试时间成本和开销更高3.面试效率:线下面对面的沟通效率会更高，候选人可以实地观察办公环境，面试过程中的面貌展示和语言表达更直观大概想到的就这几点...

position: sticky;sticky的中文意思是“粘性的”，position:sticky表现也符合这个粘性的表现。特别适合导航的跟随定位效果。基本上，可以看出是position:relative和position:fixed的结合体——当元素在屏幕内，表现为relative，就要滚出显示器屏幕的时候，表现为fixed。特性position:sticky有个非常重要的特性，那就是sticky元素效果完全受制于父级元素们。这和position:fixed定位有着根本性的不同，fixed元

一、flex布局的学习采用Flex布局的元素，称为Flex容器（Flex container），简称"容器"。它的所有子元素自动成为容器成员，称为Flex项目（Flex item），简称"项目"。 每个弹性框布局包含两个轴，弹性项目沿其依次排列的那根轴称为主轴(main axis)。垂直于主轴的那根轴称为侧轴(crossaxis)。 弹性容器的主轴起点(main start)/主轴终点(main end)和侧轴起点(crossstart)/**侧轴终点(cross end)**描述了弹性项目排布的

Vue本地代理编辑好后，能实现跨域获取接口数据，但是打包后在生产环境接口报错404，要怎样才能解决生产环境跨域问题呢？在开发环境配置好本地代理后，使用Nginx反向代理解决生产环境跨域问题，Nginx反向代理配置非常简单，大概三步就能实现；一、下载 Nginx　　下载地址：http://nginx.org/en/download.html　　打开如图所示：　　　　一般第一个是最新版，第二个是稳定版，点击最新版或者稳定版下载都可以；二、修改配置文件　　下载好nginx后就可以.

1.前端有几种跨域？分别是什么？9种，分别是：jsonp、cors、postMessage、document.domain、window.namelocation.hash、http-proxy 、nginx 、websocket常用的是jsonp： script的src属性不受同源策略的限制 将不同源的服务器端请求地址写在 script 标签的 src 属性中 2.vue如何设置反向代理？下载 Nginx 设置nginx的配置文件，在server中添加监听的端..

回答流程如下：如果是英文词汇就先翻译成中文 一句话描述该技术的用途 描述该技术的核心概念或运作流程 口述该技术的代码书写思路 该技术的优点 该技术的缺点 如何弥补缺点接下来实战：请问 AJAX 的原理是什么？AJAX 就是异步的 JS 和 XML 的缩写，目前我们一般用 JSON 代替 XML。 AJAX 主要用于在不刷新页面的情况下向浏览器发起请求并接受响应，最后局部更新页面。 该技术最核心概念是 XMLHttpRequest 对象，该对象可发起 HTTP 请求，我们可

回答流程如下：如果是英文词汇就先翻译成中文 一句话描述该技术的用途 描述该技术的核心概念或运作流程 口述该技术的代码书写思路 该技术的优点 该技术的缺点 如何弥补缺点接下来实战：请问 AJAX 的原理是什么？AJAX 就是异步的 JS 和 XML 的缩写，目前我们一般用 JSON 代替 XML。 AJAX 主要用于在不刷新页面的情况下向浏览器发起请求并接受响应，最后局部更新页面。 该技术最核心概念是 XMLHttpRequest 对象，该对象可发起 HTTP 请求，我们可以监听

为什么前端面试官问的问题都是各种原理呢？这几天去面试了几家公司，面试官在问了一些常见的技术后 总会问各种原理，比如 ajax 原理 http原理 mvvm原理，脏查询原理 等等像这些原理，我也看过很多文章，但是 回答这些问题真的不好回答，比如（1）问：双向绑定 的原理是什么？ 答：因为里面有 脏检查技术 。 问 ：脏检查 技术的原理 是什么？ 答：内部不断地检查 变量的状态变化 。问：是怎样检查的？ 答：。。。。（2）问：mvvm原理是什么？ 答 ：M-模型 v -视图层 c-控制层 ，

为什么前端面试官问的问题都是各种原理呢？这几天去面试了几家公司，面试官在问了一些常见的技术后 总会问各种原理，比如 ajax 原理 http原理 mvvm原理，脏查询原理 等等像这些原理，我也看过很多文章，但是 回答这些问题真的不好回答，比如（1）问：双向绑定 的原理是什么？ 答：因为里面有 脏检查技术 。 问 ：脏检查 技术的原理 是什么？ 答：内部不断地检查 变量的状态变化 。问：是怎样检查的？ 答：。。。。（2）问：mvvm原理是什么？ 答 ：M-模型 v -视图层 c-控制层 ，

注意：加粗的字体为速记的文本（核心点）1、 响应式布局如何实现响应式布局可以让网站同时适配不同分辨率和不同的手机端，让客户有更好的体验。方案一：百分比布局利用对属性设置百分比来适配不同屏幕，注意这里的百分比是相对于父元素； 能够设置的属性有 width、height、padding、margin，其他属性比如 border、font-size 不能用百分比设置的，先看一个简单例子：顶部是利用设置图片 width: 50%来适应不同的分辨率，由于原始图片高度不同，所以第一张图片顶部会有空白，这种情

一、ajax的理解回答原理题流程：如果是英文词汇就先翻译成中文 一句话描述该技术的用途 描述该技术的核心概念或运作流程 口述该技术的代码书写思路 该技术的优点 该技术的缺点 如何弥补缺点ajax的概念翻译 async JavaScript and XML 异步的js和xml 一句话描述该技术的用途 无需重新加载整个网页的情况下，能够更新局部网页 核心概念或运作流程 一种创建交互式网页应用的网页开发技术 代码书写思路 ...

一、简介Ajax 即“AsynchronousJavascriptAndXML”（异步 JavaScript 和 XML），是指一种创建交互式网页应用的网页开发技术。 Ajax = 异步JavaScript和XML（标准通用标记语言的子集）。 Ajax 是一种用于创建快速动态网页的技术。 Ajax 是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术。 通过在后台与服务器进行少量数据交换，Ajax 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。 传.

JavaScript中document.getElementById()的返回值的类型为？object 问题描述： var value1 = document.getElementById（“num1”）.value; //3或9 var value2 = document.getElementById（“num2”）.value; //4或10 if(value1 < value2 ){ alert("正确") }else{ alert("失败) } 当value1 =...

什么是同源策略 同源策略 是由NetScape提出的一个著名的安全 策略，它是浏览器最核心也最基本的安全功能 所谓的同源，指的是协议，域名，端口相同。浏览器处于安全方面的考虑，只允许本域名下的接口交互，不同源的客户端脚本，在没有明确授权的情况下，不能读写对方的资源 4 什么是跨域 跨域，是指浏览器不能执行其他网站的脚本。它是由浏览器的同源策略造成的，是浏览器对JavaScript实施的安全限制 跨域解决方案，最少说出三种 **Jsonp, CORS, 代理，反向代理，..

1.vue3和vue2的区别1.vue2和vue3双向数据绑定原理发生了改变vue2的双向数据绑定是利用ES5 的一个 APIObject.definePropert()对数据进行劫持 结合 发布订阅模式的方式来实现的。vue3中使用了 es6 的ProxyAPI 对数据代理。相比于vue2.x，使用proxy的优势如下defineProperty只能监听某个属性，不能对全对象监听 可以省去for in、闭包等内容来提升效率（直接绑定整个对象即可） 可以监听数组，不用再去单...

闭包：全局环境不会被回收（有需要就不会被回收）函数作用域中（函套函），小函数可访问父级函数的变量（前提是函数嵌套函数）函数创建调用之后，就会创建一块新的天地

一、小程序代码组成须知App()必须在app.js中注册，且不能注册多个。 编译后的代码包大小需小于1MB，否则代码包将上传失败。 每个页面需要手动在app.json中进行注册，否则不能访问。 app.json中pages数组的第一项代表小程序的初始页面，小程序中新增/减少页面，都需要对pages数组进行修改。 直接修改this.data无效，无法改变页面的状态，还会造成数据不一致。 单次设置的数据不能超过1024kB，请尽量避免一次设置过多的数据。 不要尝试修改页面栈...

生命周期当然，微信小程序和其他前端框架类似也是有生命周期的：小程序注册完成后，加载页面，触发onLoad方法。页面载入后触发onShow方法，显示页面。首次显示页面，会触发onReady方法，渲染页面元素和样式，一个页面只会调用一次。当小程序后台运行或跳转到其他页面时，触发onHide方法。当小程序有后台进入到前台运行或重新进入页面时，触发onShow方法。当使用重定向方法wx.redirectTo(OBJECT)或关闭当前页返回上一页wx.navigateBack()，触发onUnlo

lin-ui组件库：

Vuex最全使用总结(state、mutations、actions、getters、modules模块化)vuexvuex顾名思义是一款为vue而生的状态管理工具。vue本身自带着store模式，其实就是全局注册一个对象，实现数据共享。适合小型数据量少的项目。vuex适合复杂的单页面应用，涉及到多层次嵌套，多层次组件传值，不同视图对一个状态或者接口的处理。一、vuex 的五大核心1.State2.Getters3.Mutations4.Actions5.Modulevuex 四大

每日良言：迷途知返，胜过无罪uni-app基础知识了解:介绍uni-app是一个使用Vue.js开发所有前端应用的框架，开发者编写一套代码，可发布到iOS、Android、Web（响应式）、以及各种小程序（微信/支付宝/百度/头条/QQ/钉钉/淘宝）、快应用等多个平台。uni，读you ni，是统一的意思。很多人以为小程序是微信先推出的，其实，DCloud才是这个行业的开创者。DCloud于2012年开始研发小程序技术，优化webview的功能和性能，并加入W3C和HTM...

移动端事件总结 click事件单击事件，类似于PC端的click，但在移动端中，连续click的触发有200ms ~ 300ms的延迟 touch类事件触摸事件，有touchstart touchmove touchend touchcancel 四种之 1） touchstart：手指触摸到屏幕会触发 2） touchmove：当手指在屏幕上移动时，会触发 3） touchend：当手指离开屏幕时，会触发 4） touchcancel：可由系统进行的触发，比如手指触摸屏幕的时候，.

聊天chat页面： 群聊 私人聊天 传参：url:`./chat?id=${item.id}`接收参数：onload({id,type}){this.type = type;}type id传other

1.介绍CSS属性 flex 规定了弹性元素如何伸长或缩短以适应flex容器中的可用空间。这是一个简写属性，用来设置 flex-grow, flex-shrink 与 flex-basis。flex-growCSS flex-grow 属性定义弹性盒子项（flex item）的拉伸因子。flex-grow用法是这个样子的flex-grow: 1;flex-grow: inherit;2.多说无益，上代码<!DOCTYPE html><html lang

一、节流防抖的概念：防抖:触发高频事件后 定时器内函数只会执行一次，如果定时器内高频事件再次被触发，则重新计算时间场景:按钮提交场景：防止多次提交按钮，只执行最后提交的一次。节流 :高频事件触发，在定时器内只会执行一次，所以节流会稀释函数的执行效率。1.拖拽场景：固定时间内只执行一次，防止超高频次触发位置变动2.缩放场景：监控浏览器 resize3.动画场景：避免短时间内多次触发动画引起性能问题二、js函数柯里化(function currying) c.

一、flex布局是什么Flex是Flexible Box的缩写，意为”弹性布局”，用来为盒状模型提供最大的灵活性。任何一个容器都可以指定为Flex布局。.box{ display: flex;}行内元素也可以使用Flex布局。.box{ display: inline-flex;}Webkit内核的浏览器，必须加上-webkit前缀。.box{ display: -webkit-flex; /* Safari */ display: flex;}...

js常用的8种数据类型：null和undefind是什么数据类型？它们两个相等吗，全等吗？JS预编译:let,const,var的区别：

第五周1.JS判断数据类型的方法① typeof：基本数据类型没有问题，引用数据类型有问题。当变量是：number, string, boolean, function, undefined, object类型时，可以使用typeof进行判断。当变量是arr, json, null, date, reg, error 类型时全部被错误的检测为object类型。② instanceof：基本数据类型会有问题，而引用数据类型没有问题。优点：//基本数据类型console.log("1

日常知识总结 日常知识点整理2

学习内容：今天我们学习了uni-app,路由得传值和头部，身体，尾部得整体布局和下拉刷新上拉加载得技术引入自定义顶部组件效果：PS：父组件向子组件传参使用的是props，后面可以看到打印出来的传参。首先在pages.json中定义每一个要显示得路由，和样式和字体大小颜色等。"text":"首页", "pagePath":"pages/index/index", "iconPath":"static/face_13.jpg", "selectedIconPa...

前端高频面试题（实训二） P7小实训面试题大全（marksheng） 教务出题，全栈请求出战1234（marksheng）

前端高频面试题编辑人:郝金利目录JS相关： （1） 闭包 （2） 说一下JS中的原型链的理解？ （3）说一下JS继承（含ES6的）--或者人家这样问有两个类A和B,B怎么继承A？ （3） 说一下JS原生事件如何绑定 （4） 说一下JS原生常用dom操作方法？ （6） (了解)JS设计模式有哪些(单例模式观察者模式等) （7）说一下你对JS面像对象的理解 （8） 说一下JS数组常用方法（至少6个） （9） 说一下JS数组内置遍历方法有哪些和区别 （10）..

学习内容： 今天我们学习了uni-app,uni-app是一个使用Vue.js开发所有前端应用的框架，开发者编写一套代码，可发布到iOS、Android、Web（响应式）、以及各种小程序（微信/支付宝/百度/头条/QQ/钉钉/淘宝）、快应用等多个平台。使用工具：wechat_devtools_1.05.2103200_x64、mumu模拟器、微信开发者工具、HbuiderX编辑器和一些插件，基座关联下载等。技术栈：HbuiderX、Mumu、uniapp框架学习心得：通过学习...

标准盒模型和怪异盒模型(marksheng) js 文字转码 escape,encodeURI,encodeURIComponent（marksheng） try catch 用法(marksheng) 前端调用api接口方法总结(marksheng版) path.resolve()理解（marksheng） 同步异步与执行栈（marksheng背诵简约版） npm 安装中的 i、-g、--save、--save-dev、-D、-S的区别(ma..

教务出题，全栈请求出战1234（marksheng）P7小实训面试题大全（marksheng）

1.JS判断数据类型的方法① typeof：判断基本数据类型当变量是：number, string, boolean, function, undefined, object类型时，可以使用typeof进行判断。当变量是arr, json, null, date, reg, error 类型时全部被错误的检测为object类型。② instanceof：判断引用数据类型优点：//基本数据类型console.log("1" instanceof String); //false

一、恒天财富自我介绍顺序：姓名，年龄，来自哪里，工作年限，供职了几家公司，分别供职时长，任职期间做过的项目，用到的技术栈，工作方式，学习方式，性格等。自我介绍：小明 25 北京工作了三年供职于两家公司 ：河南的慧谷科技有限公司，北京汇店通科技有限公司工作过供职时长：无做过的项目比较多：因为是两家都是外包公司，做过电商类，旅游类，教育类用到的技术栈：vue全家桶，es6，JavaScript，bootstrap，还有element等一些组件的快速开发，比较...

标准盒模型和怪异盒模型盒子模型众所周知，这里先简单介绍一下。可以看到，在标准盒模型下，width和height是内容区域即content的width和height。而盒子总宽度为在标准模式下，一个块的总宽度= width + margin(左右) + padding(左右) + border(左右)而IE盒模型或怪异盒模型显而易见的区别就是，width和height除了content区域外，还包含padding和border。盒子的总宽度为一个块的总宽度= width + mar

专注于前端学习时间长又进步慢的人群其实，我们学习过程中的烦恼是源于外界的影响，所以主要还是在于自己的一个自控力和学习方法。学习慢的原因：1.因为自己的不自觉或者2.区块有效学习3.学习的是方法不是代码4.分块学习查看更多，解决前端日常问题的答案...

个人面试题整理常识基础部分：前后端分离的好处？① .开发人员分离(分工明确,谁的活就是谁的活): 术业有专攻前端就负责(View和Controller层):把精力放在html5,c3,jq,bootstrap,模块化,设计模式,兼容上,性能优化等...后端负责(负责Model层，业务处理/数据等)② .对开发的效率有所提升,前端通过ajax来调用http请求调用后端的api接口常见浏览器兼容问题？① 不同浏览器的标签默认的margin和padding不同答:第一种 : 可以把.

个人面试题整理常识基础部分：前后端分离的好处？① .开发人员分离(分工明确,谁的活就是谁的活): 术业有专攻前端就负责(View和Controller层):把精力放在html5,c3,jq,bootstrap,模块化,设计模式,兼容上,性能优化等...后端负责(负责Model层，业务处理/数据等)② .对开发的效率有所提升,前端通过ajax来调用http请求调用后端的api接口常见浏览器兼容问题？① 不同浏览器的标签默认的margin和padding不同答:第一种 : 可以把.

1.1.1：Vue解决了什么问题?①虚拟dom：dom操作时非常耗性能的，不再使用原生的dom操作节点，极大的解放dom操作，但具体操作的还是dom，不过是换了一种方式。②视图、数据、结构分离：使数据的更改更为简单，不需要进行逻辑代码的修改，只需要操作数据就能完成相关操作。③组件化：把一个单页应用中的各种模块拆分到一个一个单独的组件中，便于开发，以及后期的维护1.1.2：MVVM的理解?MVVM就是Model-View-ViewModel的缩写，MVVM将视图和业务逻辑分开。View：视图

js对文字进行转码的3个函数：escape,encodeURI,encodeURIComponent，相应3个解码函数：unescape,decodeURI,decodeURIComponent1、 传递参数时需要使用encodeURIComponent，这样组合的url才不会被#等特殊字符截断。例如：<script language="javascript">document.write('<a href="http:/...

//匹配abc中任一字符就通过 var a = /[abc]/g eg: a.test("ayu") a.test("cyu") a.test("byu") //匹配abc以外字符就通过 var a = /[abc]/g eg: a.test("dyu") //匹配0-9之间的字符就通过 var a = /[0-9]/ ..

认识 HTTP首先你听的最多的应该就是 HTTP 是一种 超文本传输协议(Hypertext Transfer Protocol)，这你一定能说出来，但是这样还不够，假如你是大厂面试官，这不可能是他想要的最终结果，我们在面试的时候往往把自己知道的尽可能多的说出来，才有和面试官谈价钱的资本。那么什么是超文本传输协议？超文本传输协议可以进行文字分割：超文本（Hypertext）、传输（Transfer）、协议（Protocol），它们之间的关系如下按照范围的大小 协议 > 传输 > 超文本

前端接口请求方式一：jquery.ajax用法：jQuery.ajax([settings])$.ajax({ url:"",//请求的url地址 success:function(req){//请求成功}, error:function(){//请求出错}, complete:function(){//请求完成}});常用可选参数：type类型：Str...

首先，前端架构师肯定是掌握好基本的前端技术基础的，正所谓一转多长，首先你得先精通一门，其次，掌握前端技术的同时，还要了解前端技术之外的技能。跳出前端这个思维，才能看到的更多。总结起来有以下几点：跨界如果你只会写前端页面，那么无论你的功力练到多么炉火纯青的地步，那么也只能称为你是一个HTML高手?。真正的架构师是需要有跨界的能力的，随着技术的持续完善，这种通过岗位变迁实现技术架构升级的情况会越来越少。而架构层面新的变化将来自于岗位自发的对自身工作内容、职责的重新定义，也就是这里说的边界。所以说并不

错误描述直接上错误截图：错误解析以上错误的意思是 "超出最大调用堆栈大小"出现这种错误最常见的原因是：在代码中的某个地方，您正在调用一个函数，该函数又调用另一个函数，依此类推，直到达到调用堆栈限制。这几乎总是因为具有未满足的基本情况的递归函数举例：(function a() { a();})();调用堆栈会一直增长，直到达到限制：浏览器硬编码堆栈大小或内存耗尽。为了解决这个问题，请确保您的递归函数具有能够满足的基本情况(function a(x) { if ( ! ...

一、HTTPhttp有哪些方法：（常用方法GET 和 POST ）1.GET 获取资源，GET 方法用来请求访问已被 URI 识别的资源。指定的资源经服务器端解析后返回响应内容。也就是说，如果请求的资源是文本，那就保持原样返回；2.POST 传输实体，虽然 GET 方法也可以传输主体信息，但是便于区分，我们一般不用 GET 传输实体信息，反而使用 POST 传输实体信息，3.PUT 传输文件 、4.HEAD 获得响应首部、5.DELETE 删除文件、6.OPTIONS 询问支持的方法、7..

一、前言：先来观察这两张图，第一张访问域名http://www.12306.cn，谷歌浏览器提示不安全链接，第二张是https://kyfw.12306.cn/otn/regist/init，浏览器显示安全，为什么会这样子呢？2017年1月发布的Chrome 56浏览器开始把收集密码或信用卡数据的HTTP页面标记为“不安全”，若用户使用2017年10月推出的Chrome 62，带有输入数据的HTTP页面和所有以无痕模式浏览的HTTP页面都会被标记为“不安全”，此外，苹果公司强制所有iOS App在20

在实际应用中，碰到了一个问题，就是在动态生成一个表格的时候，从后台接收到的的数据和表头名称是不同的接口，而表格的id是在表头名称这个接口动态生成的，所以就会导致一个问题，在火狐浏览器中，响应请求比较慢这个时候我们就可以使用 try catch 方法 来 处理浏览器的位置错误下面是相对简单的例子:try {foo.bar();} catch (e) {if (e instanceof EvalError) { alert(e.name + ":" + e.message);}...

vue-resource(弃用了已经)this.$http.get().then();this.$http.post().then();this.$http.jsonp().then();axios（常用）GET方式：axios.get().then().catch()注：get方式传参数可以直接跟在url后面，也可以通过param对象传POST方式：axios.post().then().catch()注：post方式传参必须用对象传...

1.objectnew创建let person = new Object();person.name = "张三";person.age = 25;字面量创建let person = { name:"张三"; age:23}

学习webpack时遇到path.resolve()：output: { filename: '[name].bundle.js', //文件名称 .bundel是一个标记 //把一个路径或路径片段的序列解析为一个绝对路径 path: path.resolve(__dirname,'dist') //__dirname当前路径 },path.resolve([…paths])里的每个参数都类似在当前目录执行一.

同步（顺序） 异步（同时）单线程：同步异步是一种概念，真正在工作的是线程 CPU（纳秒级计算）主要由三大部分组成：逻辑运算单元（ALU）、寄存器、控制单元 串行（同步） 并发（有前后顺序） 伪同步 并行（同时完成） 异步主执行栈和任务队列（微任务和宏任务）——事件循环微任务：process.nextTick、MutationObserver 、Promise。宏任务：setTimeout、setInterval 、setImmediate 、requestAnimat...

npm 安装中的 i、-g、--save、--save-dev、-D、-S的区别说明i 是 install 的简写 -g 是全局安装，不带 -g 会安装在个人文件夹 -S 与 --save 的简写，安装包信息会写入 dependencies 中 -D 与 --save-dev 的简写，安装包写入 devDependencies 中 dependencies 与 devDependencies dependencies 生产阶段的依赖,也就是项目运行时的依赖 devDependen.

插件来生成htmlnpm install html-webpack-plugin -Dconst htmlWebpackPlugin = require('html-webpack-plugin');plugins: [ new htmlWebpackPlugin()]每次生成前做一次清除。 npm install clean-webpack-plugin -Dconst { CleanWebpackPlugin } = require('clea...

安装步骤 1.npm init npm init -y //没有过程选择2.安装webpack webpack-cli。cli是可以让我们在命令行中使用webpack。 npm install webpack webnpm pack-cli -D3.npx指令会从当前目录中查找webpacknpx webpack -v //查找当前目录的webpack版本npm webpack -v //查找全局目录的webpack版本4...

概念本质上，webpack是一个用于现代 JavaScript 应用程序的静态模块打包工具。当 webpack 处理应用程序时，它会在内部构建一个依赖图(dependency graph)，此依赖图对应映射到项目所需的每个模块，并生成一个或多个bundle。入口起点(entry point)：指示 webpack 应该使用哪个模块，来作为构建其内部依赖图(dependency graph)的开始。输出(output)：告诉 webpack 在哪里输出它所创建的bundle，以及...

1.插槽匿名插槽：子组件<slot><slot> 父组件<child>今天天气阳光明媚<child>具名插槽：子组件<slot name="footer"><slot> 父组件<child> <template> <p>今天天气挺好<p> <template> <child>作用域插槽:子组件<slot...

具名插槽//子组件<slot name="footer"></slot>//父组件<child1> <span slot="footer"> <p>我是页尾的具体内容</p> </span> </child1>匿名插槽子组件<slot></slot>父组件<child>

序章学习地址MDN(Mozilla Developer Center)：火狐开发者社区是一个完整的学习平台，你可以在这里深入学习Web技术以及能够驱动Web的软件 。1. 第六章1.1 Object1.1.1 new操作符let person = new Object(); person.name = "Nicholas"; person.age = 29;1.1.2 对象字面量对象字面量是对象定义的简写形式，目的是为了简化包含大量属性的对象的创建。let per

Vue六种传值方式(marksheng珍藏版）vue组件的封装（marksheng珍藏版——前端必备）vuex使用流程(marksheng珍藏——前端必备)P7面试题库（某企业面试题库）

使用流程1.安装vuexnpm install vuex --save；12.store文件中引入vuex为了方便全局使用，一般会新建一个store文件夹，用于存放相关状态值。文件夹下的index.js作为对外输入接口的主文件。在主文件中引入vuex,并输出store接口。index.js:import Vue from 'vue'；import Vuex from 'vuex'；export default store;；3.vuex使用index.js：Vue.use(V.

vue组件的定义● 组件(Component)是Vue.js最强大的功能之一● 组件可以扩展HTML元素，封装可重用代码● 在较高层面上，组件是自定义元素，Vue.js的编译器为他添加特殊功能● 有些情况下，组件也可以表现用 is特性进行了扩展的原生的HTML元素● 所有的Vue组件同时也都是Vue实例，所以可以接受相同的选项对象（除了一些根级特有的选项），并提供相同的生命周期钩子vue组件的功能1）能够把页面抽象成多个相对独立的模块2）实现代码重用，提高开发效率和代码质..

Vue六种传值方式前言：六种传值方式为:属性传值 $refs $parent 通知传值(广播传值) 本地传值 路由传值在介绍组件传值之前先明确三种组件关系：父子组件、兄弟组件、无关系组件上图关系基于：A、B组件同一时刻只存其一的情况下，其中：A是C、D、E的父组件，B是F、G、H的父组件 C、D、E是A的子组件，F、G、H是B的子组件 C和D、E是兄弟组件，F和G、H是兄弟组件。但E、F不是兄弟组件 A和B是无关系组件，E和F也是无关系组件...

根据Vue2.0官方文档关于父子组件通讯的原则，父组件通过prop传递数据给子组件，子组件触发事件给父组件。但父组件想在子组件上监听自己的click的话，需要加上native修饰符当你使用 <Menu>组件时<Menu mode="horizontal" theme="dark" :active-name="$route.path" > <MenuItem name="/" to="/" @click.native="handclick(1)">...

点击button刷新的几种常用代码：1、<input type=button value=刷新 onclick="history.go(0)">2、<input type=button value=刷新 onclick="location.reload()">3、<input type=button value=刷新 onclick="location=location">4、<input type=button value=刷新 onclick="

如题，在项目中，经常有些函数和变量是需要复用，比如说网站服务器地址，从后台拿到的：用户的登录token,用户的地址信息等，这时候就需要设置一波全局变量和全局数定义全局变量原理：设置一个专用的的全局变量模块文件，模块里面定义一些变量初始状态，用export default 暴露出去，在main.js里面使用Vue.prototype挂载到vue实例上面或者在其它地方需要使用时，引入该模块便可。全局变量模块文件：Global.vue文件：<script>co...

iconfont字体图标的使用方法--超简单!我之前因为项目用bootstrap比较多,所以使用font awesome字体图标比较多,后来接触到了iconfont,发现想要的什么图标都有,还可以自定义图标,非常强大!之前看了一波教程,觉得繁琐,自己弄明白后感觉如此简单,做了这么个简单教程,直接上图,简单粗暴,避免新手走弯路,这里讲解的默认是元素使用类名;step 1:百度iconfont,找到阿里巴巴矢量图标库官网,然后注册登录,或者用github登录也行,此步骤跳过;step 2:找到图标管

1.使调试更加容易。那些被忽略或默默失败了的代码错误，会产生错误或抛出异常，因此尽早提醒你代码中的问题，你才能更快地指引到它们的源代码。2.变量在赋值之前必须声明,防止意外的全局变量。如果没有严格模式，将值分配给一个未声明的变量会自动创建该名称的全局变量。这是JavaScript中最常见的错误之一。在严格模式下，这样做的话会抛出错误。3.取消this值的强制转换。如果没有严格模式，引用null或未定义的值到 this 值会自动强制到全局变量。在严格模式下，引用 null或未定义的 this 值会..

// 组合继承 function father(){ this.money = 10000000000000; this.houses = 100; this.cars = 500; } father.prototype.makeMoney = function(){ console.log("我的技能是制造bug") } function son(){ father.call(this) } // son.prototype = new fath.

一、定义ES6允许按照一定的模式，从数组和对象中提取值，对变量进行赋值，被称为解构二、详情讲解1、数组解构：数组解构时数组的元素是按次序排列的，变量的取值由它的位置决定模式匹配：只要等号两边的模式相同，左边的变量就会被赋予对应的值（1）正常解构let [a, b, c] = [1, 2, 3];console.log(a, b, c) // 1 2 3let [foo, [[bar], baz]] = [1, [[2], 3]];console.log(foo, bar, ba.

一、forEach()方法对数组的每个元素执行一次提供的函数。<span style="color:#000000"><code>var array = ['a', 'b', 'c'];array.forEach(function(element) { console.log(element);});</code></span>输出为：a;b;c;forEach() 方法对数组的每个元素执行一次提供的函数。总是返回undefi.

indexOf()和lastIndexOf()方法这两个方法都是用来查找目标项在数组中的位置，并在没找到目标数的情况下返回-1indexOf(num)作用：从数组开头向后开始查找目标数所在的位置，然后返回它的索引值。 未查找到返回-1举个例子<script> var arr=[10,5,2,3,4,5,7,8,9]; //索引值：0 1 2 3 4 5 6 7 8 console.log(arr.indexOf(5));//1 consol

说起BFC大家可能觉得有点陌生，估计看完文章之后，都会觉得这些平时也都在用啊，只是不知道叫BFC罢了。先来看看常见的定位方式定位方案是控制元素的布局，常见的有三种：普通流（normal flow）其实就是元素按照再HTML中的先后位置之上而下布局，在这个过程中，行内元素水平排列，直到当行被沾满然后换行，块级元素则会被渲染为完整的一个新行，除非另外制定，否则所有元素默认都是普通流定位，也可以说，普通六中元素的位置由该元素再HTML文档中的位置决定。浮动（float）在浮动布局中，元素首先按照普通

圣杯布局和双飞翼布局是前端工程师需要日常掌握的重要布局方式。两者的功能相同，都是为了实现一个两侧宽度固定，中间宽度自适应的三栏布局。（中间先加载渲染）双飞翼布局<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title>css</title> </head> <style type="text/css"> * { m.

先说一下vuex到底是什么？vuex 是一个专门为vue.js应用程序开发的状态管理模式。这个状态我们可以理解为在data中的属性，需要共享给其他组件使用的部分。也就是说，是我们需要共享的data，使用vuex进行统一集中式的管理。vuex中，有默认的五种基本的对象：state：存储状态（变量） getters：对数据获取之前的再次编译，可以理解为state的计算属性。我们在组件中使用 $sotre.getters.fun() mutations：修改状态，并且是同步的。在组.

JavaScript-什么是变量什么是变量? 从字面上看，变量是可变的量；从编程角度讲，变量是用于存储某种/某些数值的存储器。我们可以把变量看做一个盒子，为了区分盒子，可以用BOX1,BOX2等名称代表不同盒子，BOX1就是盒子的名字（也就是变量的名字）。定义变量使用关键字var,语法如下：var 变量名变量名可以任意取名，但要遵循命名规则: 1.变量必须使用字母、下划线(_)或者美元符($)开始。 2.然后可以使用任意多个英文字母、数字、下划线(_)或者美元符($...

第五章引用类型前言目录第五章引用类型前言一，DATE语法参数返回值注释示例：二，RegExp三，原始值包装类型：Boolean、Number、StringBoolean栗子：总结：Number前言：栗子：valueOf()、toString（param）栗子：toFixed(param)String前言：1、字符操作：charAt(索引)、charCodeAt(索引)2、字符串操作：slice()、substr()、

基本引用类型引用值（或者对象）是某个特定引用类型的实例。在 ECMAScript 中，引用类型是把数据和功能组织到一起的结构，经常被人错误地称作“类”。虽然从技术上讲 JavaScript 是一门面向对象语言，但ECMAScript 缺少传统的面向对象编程语言所具备的某些基本结构，包括类和接口。引用类型有时候也被称为对象定义，因为它们描述了自己的对象应有的属性和方法。

目录一，原始值与引用值本章内容 通过变量使用原始值与引用值 理解执行上下文 理解垃圾回收 一，原始值与引用值 原始值： 存储在栈中的简单数据，即他们的值直接存储在变量访问的位置。包括五种原始类型：undefined、null、boolean、number、string。引用值：存储在堆中的对象，即存储在变量处的值是一个指针，只41想存储对象的内存处。包括：object、array、function等两1者的区别：原始变量及他们的值储存在栈中，当把一个原始变量..

beforeEnter(to,from,next){ if(sessionStorage.getItem("token")){ next() }else { alert("请先登录"); next('/') } },...

作用域模式作用域的工作模式分为两种，静态作用域与动态作用域其中静态作用域包括函数作用域和块作用域可能同学要问那么词法作用域呢其实词法作用域和静态作用域是同一个东西读这两本书能更好的理解词法作用域关于静态、动态作用域有什么区别——《高性能JavaScript》 /p24——《你不知道的JavaScript（上卷）》 /p59往下看↓词法作用域与动态作用域function foo(){ var a = 1; bar();}functio...

目录一.登录二.首页三.用户管理四.权限管理五.商品管理六.订单管理七.数据统计一.登录二.首页三.用户管理四.权限管理五.商品管理六.订单管理七.数据统计...

登录后在sessionStorage中添加token的值，退出后清空localStorage 和 sessionStorage 属性允许在浏览器中存储 key/value 对的数据。sessionStorage 用于临时保存同一窗口(或标签页)的数据，在关闭窗口或标签页之后将会删除这些数据。语法window.sessionStorage保存数据语法：sessionStorage.setItem("key", "value");读取数据语法：var lastname =

1.写出自己理解的原型和原型链*********************************答：每个对象都有一个__proto__属性，并且指向它的prototype原型对象每个构造函数都有一个prototype原型对象prototype原型对象里的constructor指向构造函数本身当一个对象调用自身不存在的属性/方法时，就会去自己 [proto] 关联的前辈 prototype 对象上去找，如果没找到，就会去该 prototype 原型 [proto] 关联的前辈 prototyp.

1.创建AO对象2.实例与变量名统一，赋值undefind3.实例与形参统一4.申明式函数提升5.表达式执行到那一步就执行

目录HTML&CSS盒模型与BFC1. 什么是盒子模型？2.盒子模型有哪两种3.标准和怪异模型的转换4.JS盒模型5.对BFC规范(块级格式化上下文：block formatting context)的理解？6.瀑布流原理7.h5 和css3 的新特性JavaScript4.垃圾回收机制5.什么是内存泄漏？6.Vue 中的内存泄漏问题7.js的数据类型、堆栈存储、多数据类型计算12.js中数组排序（冒泡、快速、插入）13.深...

可以在Vue项目 config文件夹下的index.js找到proxyTable并设置如下代码proxyTable: { "/api":{ target: 'http://127.0.0.1:8080', changeOrigin: true, pathRewrite: { '^/api': '' } }},并且取main.js设置如下代码Vue.prototype.$Api =