【前端面试3+1】10 npm run dev 发生了什么、vue的自定义指令如何实现、js的数据类型有哪些及其不同、【最长公共前缀】

news2024/11/19 23:14:11

一、npm run dev发生了什么

        运行`npm run dev`时,通常是在一个基于Node.js的项目中,用来启动开发服务器或者执行一些开发环境相关的任务。下面是一般情况下`npm run dev`会执行的步骤:

1. 查找package.json中的scripts字段:

        npm会在项目根目录下的package.json文件中查找scripts字段,找到对应的"dev"命令。

2. 执行对应的脚本:

        找到"dev"对应的脚本后,npm会执行该脚本。脚本可以是一个简单的命令,也可以是复杂的脚本。

3. 执行脚本中定义的命令:

        一般来说,"dev"脚本会包含一系列命令,比如启动开发服务器、编译代码、打包资源等。npm会按照脚本中定义的命令顺序执行这些命令。

4. 启动开发服务器:

        如果"dev"脚本中包含了启动开发服务器的命令,npm会启动一个本地开发服务器,用于在开发环境中预览项目。

5. 监听文件变化:

        通常开发环境下会监听文件的变化,一旦文件发生改动,开发服务器会重新编译代码并刷新页面,以便开发者实时查看修改效果。

        总的来说,运行`npm run dev`会根据package.json中定义的"dev"脚本来执行开发环境相关的任务,比如启动开发服务器、编译代码、监听文件变化等。这样可以方便开发者在开发过程中实时查看项目的变化,并进行调试和优化。

二、vue的自定义指令如何实现?

        在Vue中,可以通过Vue.directive()方法来定义自定义指令。下面是一个简单的示例,展示如何编写一个自定义指令:

// 全局注册一个自定义指令 'my-directive'
Vue.directive('my-directive', {
  // 当绑定元素插入到 DOM 中
  inserted: function (el) {
    // 设置元素的背景颜色为红色
    el.style.backgroundColor = 'red';
  }
});

        在上面的示例中,我们定义了一个名为my-directive的自定义指令,它会在绑定元素插入到DOM中时,将元素的背景颜色设置为红色。

接下来,我们可以在Vue组件的模板中使用这个自定义指令:

<template>
  <div v-my-directive>
    This is a custom directive example
  </div>
</template>

        在上面的模板中,我们使用v-my-directive指令来调用我们定义的自定义指令。当这个组件被渲染时,指令会生效,将对应的元素的背景颜色设置为红色。

        这只是一个简单的示例,实际上自定义指令还可以包含更多的钩子函数和参数,以实现更复杂的功能。在编写自定义指令时,可以根据需求选择合适的钩子函数和参数,并根据业务逻辑实现相应的功能。

三、js的数据类型有哪些,它们有什么不同?

        在JavaScript中,数据类型可以分为两大类:原始数据类型引用数据类型

1.分类:

  1. 原始数据类型

    • String:表示文本数据,用单引号或双引号包裹。
    • Number:表示数字,包括整数和浮点数。
    • Boolean:表示逻辑值,只有两个取值:truefalse
    • Null:表示空值。
    • Undefined:表示未定义的值。
    • Symbol(ES6新增):表示唯一的、不可变的值。
  2. 引用数据类型

    • Object:表示复杂数据类型,可以存储多个键值对。
    • Array:表示数组,可以存储多个值。
    • Function:表示函数。
    • Date:表示日期和时间。
    • RegExp:表示正则表达式。

2.不同:

  • 原始数据类型是存储在栈内存中的简单数据段,可以直接访问和操作,具有固定大小。
  • 引用数据类型是存储在堆内存中的对象,存储的是对象的引用地址,通过引用来访问和操作,大小不固定。
  • 原始数据类型是按值访问的,每个变量都会存储自己的值,互相独立。
  • 引用数据类型是按引用访问的,多个变量可能会指向同一个对象,操作一个变量会影响其他指向同一对象的变量。
  • 原始数据类型是不可变的,一旦创建就不能被修改
  • 引用数据类型是可变的,可以动态地添加、修改和删除属性

四、【算法】最长公共前缀

1.题目:

编写一个函数来查找字符串数组中的最长公共前缀。

如果不存在公共前缀,返回空字符串 ""

2.解题:

方一:
  1. 先处理特殊情况,如果输入的字符串数组为空,则直接返回空字符串。
  2. 遍历一遍字符串数组,找出最短的字符串的长度,作为最长公共前缀的最大可能长度。
  3. 创建一个新的字符数组 result 来存储最长公共前缀。
  4. 从第一个字符开始,逐个比较每个字符串的对应位置的字符,如果有不同的字符出现,则说明最长公共前缀到此为止。
  5. 如果所有字符串的对应位置的字符都相同,则将该字符添加到 result 中。
  6. 最后返回 result,即为最长公共前缀。
char* longestCommonPrefix(char** strs, int strsSize) {
    if (strsSize == 0) {
        return "";
    }
    
    int minLen = strlen(strs[0]);
    for (int i = 1; i < strsSize; i++) {
        minLen = fmin(minLen, strlen(strs[i]));
    }
    
    char* result = (char*)malloc((minLen + 1) * sizeof(char));
    memset(result, 0, (minLen + 1) * sizeof(char));
    
    for (int i = 0; i < minLen; i++) {
        char c = strs[0][i];
        for (int j = 1; j < strsSize; j++) {
            if (strs[j][i] != c) {
                result[i] = '\0';
                return result;
            }
        }
        result[i] = c;
    }
    
    return result;
}
方二:
  1. 首先检查输入的字符串数组长度是否为0,如果是,则直接返回空字符串""。

  2. 为存储最长公共前缀的字符数组same分配内存空间,大小为第一个字符串的长度加1,加1是为了存储字符串结束符'\0'。

  3. 初始化变量len为0,表示当前比较的字符索引位置,f为第一个字符串的第一个字符。

  4. 进入循环,判断当前位置len上的字符是否为字符串结束符'\0',如果不是则继续比较。

  5. 在内部循环中,遍历除第一个字符串外的所有字符串,逐个比较它们在当前位置len上的字符是否与第一个字符串相同,如果不同,则将same在位置len处设为结束符'\0',表示当前位置为最长公共前缀,然后返回same

  6. 如果所有字符串在当前位置len上的字符都相同,则将该字符存储到same的当前位置len处,然后继续比较下一个位置的字符。

  7. 循环直到某个字符串遍历完或者出现字符不相同的情况,此时将same在位置len处设为结束符'\0',表示最长公共前缀结束,然后返回same

  8. 最后将same在当前位置len处设为结束符'\0',确保返回的字符串正确结束。

  9. 返回存储最长公共前缀的字符数组same

char* longestCommonPrefix(char** strs, int strsSize) {
    if (strsSize == 0) return ""; 
    char* same = (char*)malloc((strlen(strs[0])+1) * sizeof(char));
    int len=0;
    char f=strs[0][len];
    while(f != '\0'){
        for(int i=1;i<strsSize;i++){
            if(strs[i][len]!=f){
                same[len] = '\0';
                return same;
            }
        }
        same[len]=f;
        len++;
        f=strs[0][len];
    }
    same[len] = '\0';
    return same;
}

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Unity自定义icon

Unity自定义icon 1. 新建文件夹 OfficeFabricIconSet2. 新建Iconset3. 新建子文件夹Textures并添加icon图片4. 向iconset添加Quad Icons5. 最终效果 教程来源处&#xff1a; https://365xr.blog/build-your-own-button-icon-set-for-microsoft-hololens-2-apps-with-mrtk-using…

园区管理(源码+文档)

园区管理系统&#xff08;小程序、ios、安卓都可部署&#xff09; 文件包含内容程序简要说明含有功能项目截图客户端登录页我的退出登录发布详细注意事项公告列表入园记录主页我的资料电梯报修意见反馈客服入园申请注册招商列表 后台管理签到管理公告管理招商管理入园管理反馈报…

玩机进阶教程-----高通9008线刷XML脚本修改备份 檫除的操作步骤解析

在高通9008官方固件中我们可以看到刷写需要的脚本rawprogram0.xml和辅助脚本patch0.xml&#xff0c;脚本的作用在于将固件内各个分区对应写入手机内。根据分区地址段。然后判断脚本中那些分区不写入。以下步骤将分析emmc字库为例来讲解如何将默认刷入脚本修改为备份 檫除脚本。…

从汇编看函数调用

文章目录 函数调用流程栈相关寄存器及的作用简介寄存器功能指令功能 函数的括号{}正括号反括号 栈函数调用函数内部处理 参数传递传值&#xff0c;变量不可改传指针&#xff0c;变量可改C 传引用 函数调用流程 目标&#xff1a;函数调用前后栈保持不变 保存main函数的寄存器…

爬虫实战三、PyCharm搭建Scrapy开发调试环境

#一、环境准备 Python开发环境以及Scrapy框架安装&#xff0c;参考&#xff1a;爬虫实战一、Scrapy开发环境&#xff08;Win10Anaconda&#xff09;搭建 PyCharm安装和破解&#xff0c;参考&#xff1a;爬虫实战二、2019年PyCharm安装&#xff08;激活到2100年&#xff09; …

【机器学习】“强化机器学习模型:Bagging与Boosting详解“

1. 引言 在当今数据驱动的世界里&#xff0c;机器学习技术已成为解决复杂问题和提升决策制定效率的关键工具。随着数据的增长和计算能力的提升&#xff0c;传统的单一模型方法已逐渐无法满足高精度和泛化能力的双重要求。集成学习&#xff0c;作为一种结合多个学习算法以获得比…

WPS二次开发专题:如何获取应用签名SHA256值

作者持续关注WPS二次开发专题系列&#xff0c;持续为大家带来更多有价值的WPS开发技术细节&#xff0c;如果能够帮助到您&#xff0c;请帮忙来个一键三连&#xff0c;更多问题请联系我&#xff08;QQ:250325397&#xff09; 在申请WPS SDK授权版时候需要开发者提供应用包名和签…

如何处理Jenkins打包npm install没有拉取到最新依赖的问题

问题背景&#xff1a; 我们项目中有私有依赖包 frame&#xff0c;是私有服务器上通过 npm 去管理。frame包 publish 之后&#xff0c;通过Jenkins打包时&#xff0c;npm install 一直没有拉取最新的代码。 思考&#xff1a;通过在本地直接替换 node_modules 里的 frame 包&…

推理端框架简介 高通SNPE 神经网络处理引擎 阿里巴巴 MNN 腾讯 FeatherCNN 端侧推理引擎 卷积计算优化 卷积计算优化

高性能计算(High performance computing, 缩写HPC) 指通常使用很多处理器(作为单个机器的一部分) 或者某一集群中组织的几台计算机(作为单个计 算资源操作)的计算系统和环境。 有许多类型的HPC 系统,其范围从标准计算机的大型集群,到高度专用的硬件。 大多数基于集群的H…

复现带积分柱状图+多个分类注释

Original research: Tumor microenvironment evaluation promotes precise checkpoint immunotherapy of advanced gastric cancer - PMC (nih.gov) 补充文件位置&#xff1a;https://www.ncbi.nlm.nih.gov/pmc/articles/PMC8356190/bin/jitc-2021-002467supp001.xlsx 原图 该…

【JavaSE】类和对象详解(下)

前言 面向对象程序的三大特性&#xff1a;封装、继承、多态~ 书接上回 类和对象&#xff08;上&#xff09;~ 欢迎关注个人主页&#xff1a;逸狼 创造不易&#xff0c;可以点点赞吗~ 如有错误&#xff0c;欢迎指出~ 目录 前言 封装 private public 快速生成可访问封装的方法 包…

29-控制流(下):iam-apiserver服务核心功能实现讲解

我们再来看下 iam-apiserver 中的核心功能实现。 这些关键代码设计分为 3 类&#xff0c;分别是应用框架相关的特性、编程规范相关的特性和其他特性。 应用框架相关的特性 应用框架相关的特性包括三个&#xff0c;分别是优雅关停、健康检查和插件化加载中间件。 优雅关停 …

尚硅谷2024最新Git企业实战教程 | Git与GitLab的企业实战

这篇博客是尚硅谷2024最新Git企业实战教程&#xff0c;全方位学习git与gitlab的完整笔记。 这不仅仅是一套Git的入门教程&#xff0c;更是全方位的极狐GitLab企业任务流开发实战&#xff01;作为一应俱全的一站式DevOps平台&#xff0c;极狐GitLab的高阶功能全面覆盖&#xff0…

Python实现BOA蝴蝶优化算法优化卷积神经网络分类模型(CNN分类算法)项目实战

说明&#xff1a;这是一个机器学习实战项目&#xff08;附带数据代码文档视频讲解&#xff09;&#xff0c;如需数据代码文档视频讲解可以直接到文章最后获取。 1.项目背景 蝴蝶优化算法(butterfly optimization algorithm, BOA)是Arora 等人于2019年提出的一种元启发式智能算…

云存储中常用的相同子策略的高效、安全的基于属性的访问控制的论文阅读

参考文献为2022年发表的Efficient and Secure Attribute-Based Access Control With Identical Sub-Policies Frequently Used in Cloud Storage 动机 ABE是实现在云存储中一种很好的访问控制手段&#xff0c;但是其本身的计算开销导致在实际场景中应用收到限制。本论文研究了…

Wireshark TS | HTTP 传输文件慢问题

问题背景 之前有几篇文章写过关于应用传输慢的问题&#xff0c;延用之前的老套话&#xff0c;应用传输慢是一种比较常见的问题&#xff0c;慢在哪&#xff0c;为什么慢&#xff0c;有时候光从网络数据包分析方面很难回答的一清二楚&#xff0c;毕竟应用的定义范围实在太广&…

蓝桥杯嵌入式学习笔记(9):RTC程序设计

目录 前言 1. RTC介绍 2. 使用CubeMx进行源工程配置 3. 代码编程 3.1 准备工作 3.2 进行bsp_rtc.h编写 3.3 进行bsp_rtc.c编写 3.4 main.c编写 3.4.1 头文件引用 3.4.2 变量声明 3.4.3 子函数声明 3.4.4 函数实现 3.4.5 main函数编写 4. 代码实验 5. 总结 前言 因本人备赛蓝…

企业微信企业主体变更认证介绍

企业微信变更主体有什么作用&#xff1f; 说一个自己亲身经历的事情&#xff0c;当时我在一家教育公司做运营&#xff0c;公司所有客户都是通过企业微信对接的。后来行业整顿&#xff0c;公司不得不注销&#xff0c;换了营业执照打算做技能培训&#xff0c;但发现注销后原来的企…

高斯消元详解

算法概述 高斯消元法是一个用来求解线性方程组的算法 那么什么是线性方程组呢? 线性:每个未知数次数都为1次方程组:多个方程&#xff0c;多个未知数。 &#xff08;a1x1a2x2..anxnbn&#xff09;x为一次的 当x是平方的时候就不是线性 简而言之就是有多个未知数&#xff…

STL是什么?如何理解STL?

文章目录 1. 什么是STL2. STL的版本3. STL的六大组件4. 如何学习STL5.STL的缺陷 1. 什么是STL STL(standard template libaray-标准模板库)&#xff1a;是C标准库的重要组成部分&#xff0c;不仅是一个可复用的组件库&#xff0c;而且是一个包罗数据结构与算法的软件框架。 2. …