首页 > 其他分享 >面试记录 二

面试记录 二

时间:2022-11-18 18:08:05浏览次数:41  
标签:nextTick 函数 箭头 记录 面试 input 组件 操作

自我介绍

数组操作,
什么操作会改变原数组
箭头函数与普通函数的this指向问题
怎么修改箭头函数的this指向
v–model的原理及使用
组件通信,嵌套很深的那种
$nexttick原理 时机

说说最熟悉项目,背景,负责的东西

vue的data为什么是一个函数

说说vue

说说es6

宏任务,微任务

数组.对象 各自的合并操作

父子组件的生命周期

插槽

for 与 while

 object.defineproperty

 

1、数组操作,

2、什么操作会改变原数组

a、不会改变遍历、slice【截取】、俩合并生成新数组

b、

 

 

                    reverse--数组翻转


3、箭头函数与普通函数的this指向问题

https://blog.csdn.net/qq_43363773/article/details/105420111

3.1、

箭头函数的this是静态的,箭头函数 this 指向声明时所在作用域下 this 的值,且无法改变。

箭头函数的this不指向本身,指向外层作用域中的this;

3.2、

 

 

 

4、箭头函数是否可以修改 this,可以的话怎么修改 

4.1、箭头函数,不能改变this指向,只有普通function函数,能改变this指向

  箭头函数不同于传统JavaScript中的函数,箭头函数并没有属于⾃⼰的this,它所谓的this是捕获其所在上下文的 this 值,作为自己的 this 值,

并且由于没有属于自己的this,所以是不会被new调用的,这个所谓的this也不会被改变。箭头函数的this指向外层函数的this

4.2、一般函数的修改:call,apply,bind


5、v–model的原理及使用

实现子组件与父组件数据实时同步,组件通信

原理:input事件与value实现;基于一般input封装子组件,父组件如同使用input一般使用子组件

v-model其实是一个语法糖,它背后包含两个操作:

   1.v-bind:value 绑定一个value属性

   2.v-on指令给当前元素绑定input事件

a、

父组件传递数据,在子组件input中显示,并接收子组件input改变的值,修改data中的相关数据

 

 

 

b、子组件接收父组件的数据在input中展示,并传递自己改变的值在父组件中修改对应的data中的数据

 

 

 


6、组件通信,嵌套很深的那种

a、$bus:全局事件总线:任意组件间通信

b、vuex:万能

c、pubsub.js:消息订阅与发布:任意组件间通信


7、$nexttick原理 、作用

a、原理

Vue 的 nextTick 其本质是对 JavaScript 执行原理 EventLoop 的一种应用。

nextTick 的本质是为了利用 JavaScript 的异步回调任务队列来实现 Vue 框架中自己的异步回调队列。

b、作用

Vue采用了数据驱动视图的思想,但是在一些情况下,仍然需要操作DOM。

有时候,可能遇到这样的情况,DOM1的数据发生了变化,而DOM2需要从DOM1中获取数据,那这时就会发现DOM2的视图并没有更新,这时就需要用到了nextTick了。

由于Vue的DOM操作是异步的,所以,在上面的情况中,就要将DOM2获取数据的操作写在$nextTick中

 

 

 c、场景

● 在数据变化后执行的某个操作,而这个操作需要使用随数据变化而变化的DOM结构的时候,

这个操作就需要方法在nextTick()的回调函数中。

● 在vue生命周期中,如果在created()钩子进行DOM操作,也一定要放在nextTick()的回调函数中。

因为在created()钩子函数中,页面的DOM还未渲染,这时候也没办法操作DOM,所以,此时如果想要操作DOM,

必须将操作的代码放在nextTick()的回调函数中。

 

8、说说最熟悉项目,背景,负责的东西

9、data为什么是一个函数而不是对象

Vue组件可能存在多个实例,如果使用对象形式定义data,则会导致它们共用一个data对象,

那么状态变更将会影响所有组件实例,这是不合理的;

采用函数形式定义,在initData时会将其作为工厂函数返回全新data对象,有效规避多实例之间状态污染问题。

而在Vue根实例创建过程中则不存在该限制,也是因为根实例只能有一个,不需要担心这种情况

 

10、说说vue

1.mvvm框架
2.数据驱动
3.SPA
4.渐进式

11、说说es6

12、宏任务,微任务

https://juejin.cn/post/6844903638238756878

13、数组.对象 各自的合并操作

14、父子组件的生命周期

 

 

 

15、插槽

https://zhuanlan.zhihu.com/p/114502325

16、for 与 while

https://blog.csdn.net/Jumpingyyds/article/details/121021128

 

 

17、object.defineproperty

https://www.cnblogs.com/ldq678/p/13854113.html

 

标签:nextTick,函数,箭头,记录,面试,input,组件,操作
From: https://www.cnblogs.com/gs-top/p/16898319.html

相关文章

  • 面试记录 四
    描述一个项目,遇到啥问题、怎么解决ES6模块与common等模块区别怎么判断数组与对象json.parse与json.stringfly 及其三个参数 vue组件的异步与同步区别vue.use的作用......
  • 肖sir__面试第六天课程__app测试讲解(6.1)
    app测试1、你做过app测试吗?2、app测试和web端测试区别?3、app专项测试?4、adb命令熟悉吗?你说下常用的adb命令?5、app测试中遇到哪些问题?并且如何解决的?6、app闪退有哪些......
  • 【博学谷学习记录】超强总结,用心分享 | 单例设计模式总结
    单例设计模式单例模式(SingletonPattern)涉及到一个单一的类,该类负责创建自己的对象,同时确保只有单个对象被创建。这个类提供了一种访问其唯一的对象的方式,可以直接访问,不......
  • Nodejs报错记录
    1.digitalenveloperoutines::unsupportedD:\workspace\vuedemo>npmrundev...error:0308010C:digitalenveloperoutines::unsupportedatnewHash(node:int......
  • iOS面试题总结
    iOS已经到了小公司用不起,大公司不招的地步了。当然,也没有实习生要来学这个。整个移动端都太难了,今年大家都太难了。面试了一些公司,就自我总结一下吧。有空也能背一下。基......
  • windows远程连接centos及闪退异常解决记录
      平时在学校实验室写代码用的环境是linux系统,放假回家之后之后笔记本的性能和系统多少有些不方便,因此使用服务器安装IDEA进行编程,记录一下远程桌面的安装及出现的......
  • g++使用记录
    arcrvlibmyAPI.amyAPI.o用于生成静态库‘,生成的库文件应遵循规范,及linux下库文件加“lib”前缀动态库和静态库都需要使用.o文件,.o文件的生成是g++-cmyAPI.cpp 也......
  • Ids | Openiddict 客户端获取token后依然无法访问服务端接口问题记录(汇总)
    使用IDentityService4或Openiddict时,客户端在认证通过后,有时候依然无法访问服务端。常见的异常有:1、认证服务器配置的认证URL与客户端调用的URL不匹配2、Scope未被正确添......
  • Clash Verge 使用记录
    简介ClashVerge是一个上网工具,详情可查看github地址。目前本人在用的协议,可先试用。npm相关1.修改npm代理使用ClashVerge时会自动开启系统代理服务器,此时......
  • [C++]-日志记录库SPDLog简介[通俗易懂]
    文章目录spdlog库日志记录槽sink日志记录器logger输出格式pattern对齐方式截断字符串格式化fmtFormatSpecificationspdlog使用异常处理logger基......