首页 > 其他分享> 文章详细

前端知识学习05

2022-05-11 00:35:52 阅读：140 来源： 互联网

标签：函数 05 对象前端知识 next 数组组件路由

1.BFC：块级格式化上下文

BFC决定了元素如何对其内容进行定位，以及与其它元素的关系和相互作用，当涉及到可视化布局时，BFC提供一个环境，html在这个环境中按照一定的规则进行布局。

怎样触发BFC:

overflow:hidden
display:inline-block
position:absolute
position:fixed
display:table-cell
display:flex

BFC解决了什么问题：

使用float的时候脱离文档流，高度塌陷
margin边距重叠

2.proxy

proxy对象是创建一个对象的代理，用来监听这个对象的相关操作

3..call() .aply() .bind()的区别

call与apply唯一的区别就是它们的传参方式不同，call从第二个参数开始都是传给函数的，apply只有两个参数，第二个参数是一个数组，传给函数的参数都写在这个数组里面
call与apply改变了函数的this指向后会立即执行，而bind是改变函数的this指向并返回这个这个函数，不会立即执行
call与apply的返回值是函数的执行结果，bind的返回值是改变了this指向的函数的拷贝

4。数组的方法？

includes 查找数组中是否有某元素
flat 扁平化数组
forEach 遍历数组
push 添加到数组的末尾
pop 删除末尾元素
shift 删除头部元素
unshift 添加元素到数组的头部
indexof 查找某个元素在数组中的索引
splice 删除某个元素从一个索引位置删除多个元素
slice 复制一个数组

5.js闭包

　function f1(){

　　　　var n=999;

　　　　function f2(){
　　　　　　alert(n);
　　　　}

　　　　return f2;

　　}

　　var result=f1();

　　result(); // 999

f2函数就相当于闭包，闭包就是能够读取其他函数内部变量的函数

在本质上，闭包就是将函数内部和函数外部连接起来的一座桥梁。

6.组件之间的传值

子组件向父组件传值props

父组件向子组件传值$emit

7.vuex是什么

Vuex 是专门为 Vue.js 设计的状态管理库，它采用集中式存储管理应用的所有组件的状态。

8.watch和computed区别

watch的意思是监听，当发生变化的时，监听并且执行
computed是计算属性，用来计算一个属性的值
如果一个值依赖多个属性（多对一），用computed方便。
如果一个值变化引起一系列值的变化（一对多），用watch方便。
computed有缓存

9.路由守卫

全局路由钩子：

beforeEach(to,from, next)、beforeResolve(to,from, next)、afterEach(to,from)；

独享路由钩子：

beforeEnter(to,from, next)；

组件内路由钩子：

beforeRouteEnter(to,from, next)、beforeRouteUpdate(to,from, next)、beforeRouteLeave(to,from, next)

导航守卫回调参数

to：目标路由对象；

from：即将要离开的路由对象；

next：他是最重要的一个参数，他相当于佛珠的线，把一个一个珠子逐个串起来。以下注意点务必牢记：

1.但凡涉及到有next参数的钩子，必须调用next() 才能继续往下执行下一个钩子，否则路由跳转等会停止。

2.如果要中断当前的导航要调用next(false)。如果浏览器的 URL 改变了 (可能是用户手动或者浏览器后退按钮)，那么 URL 地址会重置到from路由对应的地址。（主要用于登录验证不通过的处理）

3.当然next可以这样使用，next('/') 或者 next({ path: '/' }): 跳转到一个不同的地址。意思是当前的导航被中断，然后进行一个新的导航。可传递的参数与router.push中选项一致。

4.在beforeRouteEnter钩子中next((vm)=>{})内接收的回调函数参数为当前组件的实例vm，这个回调函数在生命周期mounted之后调用，也就是，他是所有导航守卫和生命周期函数最后执行的那个钩子。

5.next(error): (v2.4.0+) 如果传入 next 的参数是一个 Error 实例，则导航会被终止且该错误会被传递给 router.onError() 注册过的回调。

10.js运行机制

（1）所有同步任务都在主线程上执行，形成一个执行栈（execution context stack）。

（2）主线程之外，还存在一个"任务队列"（task queue）。只要异步任务有了运行结果，就在"任务队列"之中放置一个事件。

（3）一旦"执行栈"中的所有同步任务执行完毕，系统就会读取"任务队列"，看看里面有哪些事件。那些对应的异步任务，于是结束等待状态，进入执行栈，开始执行。

（4）主线程不断重复上面的第三步。

11.js碰到异步怎么处理

回调函数
promise
async/await

12.new操作符做了什么

创建一个新对象

新对象的原型指向构造函数原型对象

将构造函数的this指向新对象

根据返回值判断

function mynew(func,...args){
    //创建一个新对象
    const obj={}
    //将对象的原型指向构造函数的原型对象
    obj.__proto__ = func.prototype
    //将构造函数的this指向新对象
    let reslut = func.apply(obj,args)
    //根据返回值类型判断
    return reslut instanceof Object?reslut : obj
}
function Person(name,age){
    this.name = name
    this.age = age
}
Person.prototype.say = function (){
    console.log(this.name)
}
let p  = mynew(Person,'张三',12)
console.log(p)
p.say()

13.vue操作数据或者操作dom在哪个生命周期

mounted

标签：函数,05,对象,前端,知识,next,数组,组件,路由
来源： https://www.cnblogs.com/ma1998/p/16256174.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9