日常笔记
函数的提升六种
js引擎在解析javascript代码是会对var开头和function开头的语句块进行提前处理
1.函数的提升
2.变量的提升:只是声明的提升,不会赋值的提升
3.当函数声明名与变量名重复时:函数提升变量不会提升
4.函数表达式不提升
5.提升不会超出作用域范围
函数进阶正常情况下:不包括变量提升
1.如果两个变量名重复,后边会覆盖前边
2.如果两个函数声明重复,后边会覆盖前边
3.如果两个函数表达式重复,离的近的调用(就近原则)
4.如果函数声明和函数表达式重复,表达式覆盖声明,
5.如果函数声明与变量名重复,变量名覆盖函数(函数声明)
6.如果函数表达式与变量名重复,后边覆盖前边
函数表达式不能提升,变量比声明优先级高,表达式比声明优先级高,变量和表达式,后边会覆盖前边
公式:
变量名前边 < 变量名后边
函数名前边 < 函数名后边 < 函数表达式 (就近原则)
函数表达式前边 < 变量名后边
函数名 < 变量名
效 果 图
扩展:
var let 和const的区别
var没有作用域的问题,可以在任何地方赋值
let 有作用域问题,局限于花括号,可以被修改
const只能声明常量,声明之后不能被赋值,或修改
this的指向问题(函数中this指向)
- 在构造函数中,this指向实例化对象
- 在对象函数中,this指向当前对象
- 在普通函数中,this指向window
- 在事件函数中,this指向事件源
this指向对象,对象指向特征及行为 - 在定时器函数中,this指向window
- 在实例化函数调用函数,this指向实例化对象,在原型对象中调用函数,this指向原型对象
- 如果数组的元素是函数,在此函数中this指向当前的数组
- 在原型的函数中、如果实例化对象调用该函数this指向实例化对象
- 如果原型对象调用该函数,this执行原型对象
- 箭头函数没有this,箭头函数永远指向父级
扩展
原型对象的指向问题
原型对象
任何一个函数都有prototype属性,它本身就是个对象,我们称之为原型。
构造函数实例化对象与原型之间的关系?(重点)
结论一:任何一个函数都有prototype属性,它本身就是个对象,我们称之为原型。
结论一:构造函数也是函数,也有prototype属性,他本身是个对象,称为原型。
结论三:构造函数的原型对象上的属性和方法都可以被实例化对象所继承(重点)
结论四:任何一个对象都有conturctor 属性,实例化对象的constructor属性指向构造函数
结论五:原型也是对象,也有constructor属性,原型对象的constructor属性指向构造函数
结论六:任何一个对象__proto__属性,实例化对象的(_ _ )proto(_ _)属性指向构造函数的原型
Prototype 是原型对象的属性 对象的属性 可以找到对象(function)的原型
原型对象的指向:
css的六种方式
1、对象.style(‘color’,‘red’)
2、对象.className(‘新名字’)
3、对象.setAttribute(“style”,“样式”)
4、对象.setAttribute(“class”,“类名”)
5、对象.style.setProperty(“css属性”,“css属性值”)
6、对象.style.cssText =“样式”
运算符的优先级
算术运算,
一元运算:前置++ 先加后用,后置++ 先用后加,前置- - ,后置- -,
逻辑运算:1,&&逻辑与 ||逻辑或 ! 逻辑非 比较运算
> < >= <= == ====,赋值运算,
优先级 括号>点运算符>一元运算符>算数运算符>(关系)比较运算符>逻辑运算符>赋值运算符
先&& 后||
常见的post请求参数
-
form-data:
等价于http请求中的multipart/form-data,它会将表单的数据处理为一条消息,以标签为单元,用分隔符分开。既可以上传键值对,也可以上传文件。当上传的字段是文件时,会有Content-Type来表名文件类型;content-disposition,用来说明字段的一些信息;
由于有boundary隔离,所以multipart/form-data既可以上传文件,也可以上传键值对,它采用了键值对的方式,所以可以上传多个文件。 -
x-www-form-urlencoded:
等价于application/x-www-from-urlencoded,会将表单内的数据转换为键值对,比如,name=java&age = 23 -
raw
可以上传任意格式的文本,可以上传text、json、xml、html等 -
binary
相当于Content-Type:application/octet-stream,从字面意思得知,只可以上传二进制数据,通常用来上传文件,由于没有键值,所以,一次只能上传一个文件。
multipart/form-data与x-www-form-urlencoded区别
multipart/form-data:既可以上传文件等二进制数据,也可以上传表单键值对,只是最后会转化为一条信息;
x-www-form-urlencoded:只能上传键值对,并且键值对都是间隔分开的。
mvc和mvvm的标准回答
-
MVC(Model模型—View视图—Controller控制器)是前后端未分离时的分层开发概念。
View视图层 是用户能够看到并进行交互的客户端界面,如桌面应用的图形界面、浏览器端渲染的网页等;
Model数据操作层 ,用于计算、校验、处理和提供数据,但不直接与用户产生交互;
Controller业务逻辑层 则负责收集用户输入的数据,向相关模型请求数据并返回相应的视图来完成交互请求。 -
MVVM(Model模型—View视图—ViewModel视图模型或称为调度者)是前后端分离后的前端分层开发概念。
前端中的所有页面都统称为 MVC中的View视图层。
其最重要的特性是 双向数据绑定 ,此外还包括依赖注入,路由配置,数据模板等一些特性。
前后端分离的原因是随着技术的发展,市场与行业对前端的要求越来越高。
未分离时代的前端理念类似于“能用就行”…
MVVM中的 M 也是数据操作层,即处理页面中需要渲染的数据的部分,这个M和MVC中的M有本质区别,MVC中的Model层是真正的服务的数据库,MVVM中的Model层的数据都是从服务端请求回来的。
MVVM中的 V 也是View视图层,即用户能够看到并进行交互的客户端界面。
MVVM中的 VM 是MVVM中的核心概念,是一个调度者,它实现了双向数据绑定,可以把 Model数据操作层 的数据渲染到 View视图层 ,同时 View视图层 的数据发生改变也可以自动同步到 Model层 中,VM解放了前端程序员的双手,前端程序员不用再进行不必要的DOM操作了,只需关心前端的业务逻辑即可。
http请求方式会5种
route和router的区别
router是跳转页面
route是接受传参
每个router都有一个route对象
router是VueRouter的一个对象,通过Vue.use(VueRouter)和VueRouter构造函数得到
一个router的实例对象,这个对象中是一个全局的对象,包含了所有的路由包含了许多关键的对象和属性。
route是一个跳转的路由对象,每一个路由都会有一个route对象,是一个局部的对象,可以获取对应的name,path,params,query等
$router.push({path:’/path’}); 本质是向history栈中添加一个路由,在我们看来是 切换路由,但本质是在添加一个history记录
$router.replace({path:’/path’}); 替换路由,没有历史记录
params传参合query传参的区别
params参数在地址栏中不会显示,query会显示
网页刷新后params参数会不存在
vue的优化
优势:用户体验好,前后端分离,前端组件化
不足:首次加载资源消耗大,占用内存多,不利于seo优化,导航实现难
路由守卫
beforeforEach()和affterforEach()的区别
beforeEach
在路由跳转前触发,参数包括to,from,next(参数会单独介绍)三个,这个钩子作用主要是用于登录验证
beforeResolve(2.5+)
这个钩子和beforeEach类似,也是路由跳转前触发,参数也是to,from,next三个,与beforeEach的区别参考官网。
afterEach
是在路由跳转完成后触发,参数包括to,from,它发生在beforeEach和beforeResolve之后,beforeRouteEnter(组件内守卫)之前。
vue-cli,微信小程序,uniapp-项目提示结构
坚定自己心之所向,无所畏惧,才能枪出如龙,