前端基础:Vue搞笑白话文(工作之余瞎写)

1、data:{}与data(){return{}}这两个是个什么鬼?

vue实例

new Vue({el:'#app',data:{name:'李四'}})

组件实例

const aaa = Vue.extent({data(){return {name:''}}
})

为什么Vue实例可以那么写而组件实例就不行了?原因就是因为在底层原理上,组件是可以复用的,如果你把组件搞成相互可以变化就完了,看一下下边这些代码。

 let x1 = {a:1,b:2}let x2 = {}x2 = x1x1.a = 99console.log('获取内容', x1, x2)

这是为什么呢?这个牵扯到我们引用类型的变量直接给另外一个人相当于地址给了其他人,你把门的钥匙给了其他人这怎么能行呢?咱们改造一下。

function x1() {return {a:1,b:2}}let x2 = x1()let x3 = x1()x3.a = 99console.log('获取内容', x3, x2)

 

可以了, 这么神奇呢,其实就是相当于把主人通过一个函数给,而非像之前的直接自己给,所以在it的世界中,我们想要复用,用function return就是可以了

所以有了

new Vue({router,store,render: h => h(App)
}).$mount('#app')

2、数组方法push()和unshift()实现原理是个什么鬼?

push()末尾加,unshift()头加,常说的置顶

function pushDemo(arr,val) {arr[arr.length] = valreturn arr}

 那么我们如果在头部加的话就需要做一件事情需要把所有的元素往后边移动一位

function unshiftDemo(arr,val) {for (let i = arr.length;i>=0;--i) {arr[i] = arr[i-1]}arr[0] = valreturn arr}

3、写一个函数打印出来学生的平均成绩(二维数组)

 function average() {let arr = [[1,2,3],[4,5,6],[7,8,9]]let total = 0let avergeNum = 0.0for(let row = 0;row<arr.length;row++) {for(let i = 0;i<arr[row].length;i++){total += arr[row][i]}avergeNum = total/arr[row].lengthconsole.log('student' + parseInt(row+1) + 'averageNum' + avergeNum.toFixed(2))total = 0avergeNum = 0.0}}

4、VueComponent.prototype._proto_ === Vue.prototype 这个Vue的内置关系什么鬼?

其实VueComponent.prototype找到自己的原型再继续往上_proto_,Vue构造函数的原型,这两个指向同一个,我们想一想,一般原型最终会找到最终的Object,但是把VueComponent.prototype._proto_指向了Vue.prototype,这个有个好处就是所有Vue原型上边的方法,VueComponent都能够找到。乖乖,这就是最有灵感的地方。

稍微提一下,我们如何产生VueComponent,需要通过Vue.extend()来产生这个构造函数。

也就是说Vue的方法

  5、为啥Vue.config.js里边使用module.exports暴漏?

作为一个前端人员,整天敲啊敲,整天用的是import 用的是 exfort default,但是module.exoprts不常用,首先我们需要理解的是配置文件是管理整个项目的,而webpack是由common.js来开发的,这个Vue.config.js如果你配置了,那么这个就会跟webpack进行合并,进行覆盖按照你写的走,做到项目个性化。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/311260.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

VSCode团队工程实践:通过名称混淆将代码大小减少了20%

​我们最近将Visual Studio Code的JavaScript代码大小减少了20%。这相当于节省了3.9 MB多一点的空间。当然&#xff0c;这比我们发布说明中的一些单个gif图片的大小要少&#xff0c;但这仍然十分可观。这种减少不仅意味着您需要下载和存储在磁盘上的代码更少&#xff0c;而且还…

蓝桥杯C/C++程序设计——成绩统计

题目描述 小蓝给学生们组织了一场考试&#xff0c;卷面总分为 100 分&#xff0c;每个学生的得分都是一个 0 到 100 的整数。 如果得分至少是 60 分&#xff0c;则称为及格。如果得分至少为 85 分&#xff0c;则称为优秀。 请计算及格率和优秀率&#xff0c;用百分数表示&am…

Git 常用命令知识笔记

Git 仓库数据结构 Git 仓库由一个个的 commit 组成某些 commit 上会有一些 branch 指向它们&#xff0c;这些 branch 的本质是引用有一个特殊的引用叫做 HEAD&#xff0c;它始终指向当前的位置&#xff0c;这个位置可以是 commit&#xff0c;也可以是 branch staging area 暂存…

政务大数据能力平台建设方案:文件全文30页,附下载

关键词&#xff1a;智慧政务解决方案&#xff0c;智慧政务建设&#xff0c;智慧政务服务平台&#xff0c;智慧政务大数据&#xff0c;数字政务一体化平台。大数据&#xff0c;政务大数据建设 一、智慧政务建设需求 1、政务服务需求&#xff1a;智慧政务建设需要满足人民群众的…

单片机原理及应用:开关控制LED多种点亮模式

从这篇文章开始&#xff0c;我们不再只研究单一的外设工作&#xff0c;而是将LED、数码管、开关、按键搭配在一起研究&#xff0c;这篇文章主要介绍LED和开关能擦出怎样的火花&#xff0c;同时也介绍一些函数封装的知识。 由于开关有闭合与打开两种状态&#xff0c;LED有左移流…

CentOS虚拟机硬盘管理

CentOS虚拟机硬盘管理 一、创建虚拟机时分配硬盘 创建虚拟机时&#xff0c;在下图这个页面需要重新选择一下硬盘&#xff0c;可以对硬盘进行配置。 默认自动分区 ![在这里插入图片描述](https://img-blog.csdnimg.cn/direct/e9ce72af3d934e75be95f7f86860e92b.png 选择确认分…

ctfshow——文件上传

文章目录 文件上传思路web 151web 152web 153知识点解题 web 154web 155web 156web 157web 158web 159web160web 161 文件上传思路 web 151 打开页面显示&#xff1a;前台校验不可靠。说明这题是前端验证。 右键查看源代码&#xff0c;找到与上传点有关的前端代码&#xff1a…

Mybatis 事务接口

当我们从数据源中得到一个可用的数据库连接之后&#xff0c;就可以开启一个数据库事务了&#xff0c;事务成功开启之后&#xff0c;我们才能修改数据库中的数据。 在修改完成之后&#xff0c;我们需要提交事务&#xff0c;完成整个事务内的全部修改操作&#xff0c;如果修改过…

uni-app App.vue生命周期全局样式全局存储globalData

锋哥原创的uni-app视频教程&#xff1a; 2023版uniapp从入门到上天视频教程(Java后端无废话版)&#xff0c;火爆更新中..._哔哩哔哩_bilibili2023版uniapp从入门到上天视频教程(Java后端无废话版)&#xff0c;火爆更新中...共计23条视频&#xff0c;包括&#xff1a;第1讲 uni…

股票价格预测 | Python实现Autoformer, FEDformer和PatchTST等模型用于股价预测

文章目录 效果一览文章概述环境描述源码设计效果一览 文章概述 Autoformer、FEDformer和PatchTST是一些用于时间序列预测,包括股价预测的模型。它们都是在Transformer模型的基础上进行了改进和扩展,以更好地适应时间序列数据的特点。 Autoformer:Autoformer是一种自适应Tran…

MySQL基础入门(二)

多表内容 一对多 这个内容是黑马的入门问题&#xff0c;可以带大家思考一下这个怎么设计 我们要知道一个岗位可以对应很多用户&#xff0c;而一个用户只能对应一个岗位&#xff0c;这就属于一对多的类型 那么我们需要怎么将他们进行关联呢&#xff1f; 现在我们可以通过一个…

yolov8官方新版源码中没有requirements.txt

题外话&#xff1a;最近在帮用户安装yolov8环境的时候&#xff0c;用户说最新版的没有requirements.txt文件&#xff0c;不知道怎么安装。最开始我还以为是用户下错了的呢&#xff0c;最后一看官方居然还真的没有。不得不说。ultralytics公司更新代码的速度可是真的快。 其实官…