【Vue基础知识总结 6，2021最新Java面试真题解析

最新推荐文章于 2024-11-01 14:48:20 发布
最新推荐文章于 2024-11-01 14:48:20 发布
阅读量108 收藏
点赞数
分类专栏： 程序员 文章标签： java node.js javascript 后端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_61453011/article/details/120123577
版权
本文介绍了Node.js的基础知识，包括创建服务器端应用，以及NPM的使用，如安装、管理项目、修改镜像和安装包。接着，讲解了Babel如何将ES6代码转为ES5，以及Webpack的配置和打包过程，展示其在前端资源管理和打包中的作用。最后，强调了在面试中重视基础和技术的重要性。
摘要由CSDN通过智能技术生成

四、快速入门

1、创建文件夹nodejs

2、控制台程序


console.log('Hello Node.js')

打开命令行终端：Ctrl + Shift + y

进入到程序所在的目录，输入


node 01.js

浏览器的内核包括两部分核心：

  • DOM渲染引擎；

  • js解析器（js引擎）

  • js运行在浏览器中的内核中的js引擎内部

Node.js是脱离浏览器环境运行的JavaScript程序，基于V8 引擎（Chrome 的 JavaScript的引擎）

3、服务器端应用开发（了解）

创建 02-server-app.js


const http = require('http');

http.createServer(function (request, response) {

    // 发送 HTTP 头部 

    // HTTP 状态值: 200 : OK

    // 内容类型: text/plain

    response.writeHead(200, {'Content-Type': 'text/plain'});

    // 发送响应数据 "Hello World"

    response.end('Hello Server');

}).listen(8888);

// 终端打印如下信息

console.log('Server running at http://127.0.0.1:8888/');

运行服务器程序


node 02-server-app.js

服务器启动成功后，在浏览器中输入：http://localhost:8888/ 查看webserver成功运行，并输出html页面

停止服务：ctrl + c

NPM

=======

一、npm简介

NPM全称Node Package Manager，是Node.js包管理工具，是全球最大的模块生态系统，里面所有的模块都是开源免费的；也是Node.js的包管理工具，相当于前端的Maven 。

1、NPM工具的安装位置

我们通过npm 可以很方便地下载js库，管理前端工程。

Node.js默认安装的npm包和工具的位置：Node.js目录\node_modules

  • 在这个目录下你可以看见 npm目录，npm本身就是被NPM包管理器管理的一个工具，说明 Node.js已经集成了npm工具

#在命令提示符输入 npm -v 可查看当前npm版本

npm -v

二、使用npm管理项目

1、创建文件夹npm

2、项目初始化


#建立一个空文件夹，在命令提示符进入该文件夹  执行命令初始化

npm init

#按照提示输入相关信息，如果是用默认值则直接回车即可。

#name: 项目名称

#version: 项目版本号

#description: 项目描述

#keywords: {Array}关键词，便于用户搜索到我们的项目

#最后会生成package.json文件，这个是包的配置文件，相当于maven的pom.xml

#我们之后也可以根据需要进行修改。

#如果想直接生成 package.json 文件，那么可以使用命令

npm init -y




### 3、修改npm镜像



NPM官方的管理的包都是从 [http://npmjs.com]( )下载的，但是这个网站在国内速度很慢。



这里推荐使用淘宝 NPM 镜像 [http://npm.taobao.org/]( ) ，淘宝 NPM 镜像是一个完整 npmjs.com 镜像，同步频率目前为 10分钟一次，以保证尽量与官方服务同步。



**设置镜像地址：**

#经过下面的配置，以后所有的 npm install 都会经过淘宝的镜像地址下载

npm config set registry https://registry.npm.taobao.org

#查看npm配置信息

npm config list




### 4、**npm install命令的使用**

#使用 npm install 安装依赖包的最新版，

#模块安装的位置：项目目录\node_modules

#安装会自动在项目目录下添加 package-lock.json文件，这个文件帮助锁定安装包的版本

#同时package.json 文件中，依赖包会被添加到dependencies节点下，类似maven中的

npm install jquery

#npm管理的项目在备份和传输的时候一般不携带node_modules文件夹

npm install #根据package.json中的配置下载依赖，初始化项目

#如果安装时想指定特定的版本

npm install jquery@2.1.x

#devDependencies节点：开发时的依赖包，项目打包到生产环境的时候不包含的依赖

#使用 -D参数将依赖添加到devDependencies节点

npm install --save-dev eslint

#或

npm install -D eslint

#全局安装

#Node.js全局安装的npm包和工具的位置：用户目录\AppData\Roaming\npm\node_modules

#一些命令行工具常使用全局安装的方式

npm install -g webpack




### 5、其它命令

#更新包（更新到最新版本）

npm update 包名

#全局更新

npm update -g 包名

#卸载包

npm uninstall 包名

#全局卸载

npm uninstall -g 包名




* * *



**Babel**

=========



一、Babel简介

---------



Babel是一个广泛使用的转码器，可以将ES6代码转为ES5代码，从而在现有环境执行执行。



这意味着，你可以现在就用 ES6 编写程序，而不用担心现有环境是否支持。



二、安装

----

npm install --global babel-cli

#查看是否安装成功

babel --version




三、Babel的使用

----------



### 1、初始化项目

npm init -y




### 2、创建文件



src/example.js



下面是一段ES6代码：

// 转码前

// 定义数据

let input = [1, 2, 3]

// 将数组的每个元素 +1

input = input.map(item => item + 1)

console.log(input)




### 3、配置.babelrc



Babel的配置文件是.babelrc，存放在项目的根目录下，该文件用来设置转码规则和插件，基本格式如下。

{

"presets": [],

"plugins": []

}




presets字段设定转码规则，将es2015规则加入 .babelrc：

{

"presets": ["es2015"],

"plugins": []

}




### 4、安装转码器

npm install --save-dev babel-preset-es2015




### 5、转码

转码结果写入一个文件

mkdir dist1

–out-file 或 -o 参数指定输出文件

babel src/example.js --out-file dist1/compiled.js

或者

babel src/example.js -o dist1/compiled.js

整个目录转码

mkdir dist2

–out-dir 或 -d 参数指定输出目录

babel src --out-dir dist2

或者

babel src -d dist2




* * *



**Webpack**

===========



一、Webpack简介

-----------



Webpack 是一个前端资源加载/打包工具。它将根据模块的依赖关系进行静态分析，然后将这些模块按照指定的规则生成对应的静态资源。



从图中我们可以看出，Webpack 可以将多种静态资源 js、css、less 转换成一个静态文件，减少了页面的请求。 



![](https://img-blog.csdnimg.cn/20200623154506901.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2d1b3J1aV9qYXZh,size_16,color_FFFFFF,t_70)



 二、Webpack安装

------------



### 1、全局安装

npm install -g webpack webpack-cli




### 2、安装后查看版本号

webpack -v




三、初始化项目

-------



### 1、创建webpack文件夹



进入webpack目录，执行命令

npm init -y




### 2、创建src文件夹



### 3、**src下****创建common.js**

exports.info = function (str) {

document.write(str);

}




### 4、**src下创建utils.js**

exports.add = function (a, b) {

return a + b;

}




### 5、**src下创建main.js**

const common = require(’./common’);

const utils = require(’./utils’);

common.info(‘Hello world!’ + utils.add(100, 200));




四、JS打包

------



### 1、webpack目录下创建配置文件webpack.config.js



以下配置的意思是：读取当前项目目录下src文件夹中的main.js（入口文件）内容，分析资源依赖，把相关的js文件打包，打包后的文件放入当前目录的dist文件夹下，打包后的js文件名为bundle.js

const path = require(“path”); //Node.js内置模块

module.exports = {

entry: './src/main.js', //配置入口文件

output: {

    path: path.resolve(__dirname, './dist'), //输出路径，__dirname：当前文件所在路径

    filename: 'bundle.js' //输出文件

}

}




### 2、**命令行执行编译命令**

webpack #有黄色警告

webpack --mode=development #没有警告

#执行后查看bundle.js 里面包含了上面两个js文件的内容并惊醒了代码压缩




也可以配置项目的npm运行命令，修改package.json文件

“scripts”: {

//...,

"dev": "webpack --mode=development"

}




运行npm命令执行打包


# 总结

无论是哪家公司，都很重视高并发高可用的技术，重视基础，重视JVM。面试是一个双向选择的过程，不要抱着畏惧的心态去面试，不利于自己的发挥。同时看中的应该不止薪资，还要看你是不是真的喜欢这家公司，是不是能真的得到锻炼。其实我写了这么多，只是我自己的总结，并不一定适用于所有人，相信经过一些面试，大家都会有这些感触。

最后我整理了一些面试真题资料，技术知识点剖析教程，还有和广大同仁一起交流学习共同进步，还有一些职业经验的分享。

**[CodeChina开源项目：【一线大厂Java面试题解析+核心总结学习笔记+最新讲解视频】](https://codechina.csdn.net/m0_60958482/java-p7)**

![面试了阿里，滴滴，网易，蚂蚁，最终有幸去了网易【面试题分享】](https://img-blog.csdnimg.cn/img_convert/3e7919d40a7ac4239089c52ce0e12029.png)

le.js' //输出文件

    }

}

2、命令行执行编译命令


webpack #有黄色警告

webpack --mode=development #没有警告

#执行后查看bundle.js 里面包含了上面两个js文件的内容并惊醒了代码压缩

也可以配置项目的npm运行命令，修改package.json文件


"scripts": {

    //...,

    "dev": "webpack --mode=development"

 }

运行npm命令执行打包

总结

无论是哪家公司，都很重视高并发高可用的技术，重视基础，重视JVM。面试是一个双向选择的过程，不要抱着畏惧的心态去面试，不利于自己的发挥。同时看中的应该不止薪资，还要看你是不是真的喜欢这家公司，是不是能真的得到锻炼。其实我写了这么多，只是我自己的总结，并不一定适用于所有人，相信经过一些面试，大家都会有这些感触。

最后我整理了一些面试真题资料，技术知识点剖析教程，还有和广大同仁一起交流学习共同进步，还有一些职业经验的分享。

CodeChina开源项目：【一线大厂Java面试题解析+核心总结学习笔记+最新讲解视频】

[外链图片转存中…(img-W1oZHKwb-1630855012203)]

Java音乐盒
关注
专栏目录
最新vue面试知识点总结
01-05
vue3最新知识点
java和vue面试题
gys9895的博客
10-09 354
mybatis
17.Vue3面试真题（6题）.pdf
02-28
### Vue3面试真题知识点详解 #### 一、Composition API 的引入及意义 - **背景**：Vue3中推出的Composition API被广泛认为是Vue3最重要的特性之一。它旨在解决Vue2中存在的若干问题，特别是当项目逐渐庞大时，代码...
Vue基础知识面试试题集合
01-11
尤雨溪的初衷是创建一个易于学习和使用的前端框架，并将其设计为渐进式的，可以逐步...由于其优雅的语法、灵活性和文档友好的特点，Vue.js在短时间内赢得了庞大的开发者社区，也为Web应用程序的开发带来了更多选择。
面试必备: 2021 Vue经典面试题总结.pdf
12-14
以下是对Vue经典面试题的总结，涵盖了Vue基础、双向数据绑定原理、MVVM、MVC、MVP架构模式等知识点。 1. Vue基础 * Vue实例创建时， Vue会遍历data中的属性，将它们转换为getter/setter，并在内部追踪相关依赖，在...
Vue最新面试题、常见面试题及答案解析汇总
02-20
在面试中，Vue.js 的知识通常包括基础概念、组件化、虚拟DOM、生命周期、Vuex、Vue Router、性能优化等多个方面。下面我们将详细探讨这些关键知识点。 1. **基础概念** - **MVVM模式**：Vue采用的是Model-View-...
[自用，更新自day5]瑞吉外卖代码及笔记
最新发布
lapiii的博客
11-01 430
当使用ThreadLocal维护变量时，ThreadLocal为每个使用该变量的线程提供独立的变量副本，所以每一个线程都可以独立地改变自己的副本，而不会影响其它线程所对应的副本。Mybatis Plus公共字段自动填充，也就是在插入或者更新的时候为指定字段赋予指定的值，使用它的好处就是可以统一对这些字段进行处理，避免了重复代码。因为在分页查询的Dish的records(菜品记录中)，只有这个菜品所属的categoryId，但是我们需要分页的时候展示的是菜品名字。
基于vue框架的的汇生活家居商城的设计与实现bdjlq（程序+源码+数据库+调试部署+开发环境）系统界面在最后面。
h2345678的博客
10-29 1276
项目功能：商品分类,商品信息,用户。
（1）Java 编程基础概览：数据类型、常量、变量、标识符与运算符
码界领航的Cherry Yang的博客
10-28 1050
8 位，占1个字节，有符号的，范围 -128（-2^7）至 127（2^7-1）。32 位，占4个字节，范围 -2,147,483,648（-2^31）至 2,147,483,647（2^31 - 1）。Java 提供了六种数字类型，其中四个为整数类型，两个为浮点类型，还有字符类型，以及布尔型。16 位，占2个字节，范围 -32768（-2^15）至 32767（2^15 - 1）64 位，占8个字节，范围 -2^63 至 2^63 - 1。16 位 Unicode 字符，占 2 个字节。
SpringSession源码分析
lkr_lkr的博客
11-01 139
默认对常规Session的理解和使用，如何使用Set-Cookie。
ssm智慧社区电子商务系统+vue
weixin_44832324的博客
10-28 1239
系统能否进行正常工作，功能模块能否实现，程序代码是否有错误，这些都需要通过系统测试来进行判断，测试是程序开发中必不可少的步骤，就算系统一步不差的被开发出来了，但进行测试时总能发现一个之前从没遇到过的问题[26]。在系统开发的整个过程当中都需要不断进行系统测试，根据经验发现，前期的一个小问题，将会酿成后期的一个大问题，所以越早发现，越早解决，才能保证后续的编码、测试和设计能够顺利进行。目前，系统测试所使用的方法主要是黑盒测试，系统测试的目的包括：根据客户的需求来设计用户界面；
Java复习24（PTA)
2301_79272475的博客
10-30 396
Java复习24（PTA)：多种排序的book类*
gbase8s之spring框架用druid中间件报语法错误
weixin_55963561的博客
10-29 251
报错原因2：druid没加validationQuery， druid加上validationQuery就可以了。报错原因1：gbase8s不支持select 1这种语法，应该改成select 1 from dual;
JavaScript的第十一天
全栈学习ing
10-31 565
在使用offset系列时需注意该属性为css属性，一般用于和javascript结合使用来获取信息，所以在使用该属性时只能获取值而不能改变值。最近的具有定位属性的祖先元素顶部边缘左侧边缘。
Java学习Day54：初遇萍萍(权限控制)
weixin_51721783的博客
10-29 1066
web.xml：在health_backend工程的web.xml文件中配置用于整合Spring Security框架的过滤器DelegatingFilterProxy。
Java爬虫的京东“寻宝记”：揭秘商品类目信息
2401_87849308的博客
10-30 766
在这个数据驱动的时代，我们就像一群特工，穿梭在数字的海洋中，寻找着隐藏的宝藏——商品类目信息。今天，我们将带领你一起，用Java这把精密的瑞士军刀，深入京东的神秘领域，揭开商品类目的神秘面纱。为了避免被京东的反爬虫机制发现，我们需要设置合理的请求间隔，并且可能需要模拟浏览器的User-Agent。经过一系列的特工任务和挑战，我们终于成功获取了商品的类目信息，并且安全返回。我们需要找到京东商品类目信息的API接口，这将是我们特工任务的起点。在代码的世界里，我们不仅要追求技术的高度，更要追求道德的底线。
Spring学习笔记_16——@Inject
LuckyLay的博客
10-30 951
Inject注解是JSR330规范中提供的注解，在@Inject注解中不提供任何属性，可以配合@Qualifier注解使用。存在多个类型相同的Bean时，通过@Qualifier注解可以明确指定注入哪个Bean。兼容性@Inject是标准的一部分，因此更通用，可以在多种环境中使用。@Resource主要用于Java EE环境。@Autowired仅适用于Spring框架。查找策略@Inject默认按类型查找。@Resource默认按名称查找，没有找到时再按类型查找。@Autowired。
测试文章测试
繁依Fanyi的博客
10-31 134
【代码】测试文章测试。
大型商场应急响应系统开发：SpringBoot篇
2401_85439108的博客
10-29 736
6、网络上的客户端和服务器可以用来编程任何独立的编程环境，也有中国，GB2312，BIG5，日文写作，一般基金，用于支持多国语言，并且可以嵌入在数据表和其他软件shift_jis访问柱可以用作的名称。2、支持多种操作系统AIX的，FreeBSD下，HP-UX，Linux和Mac OS中，Novell公司的Netware，OpenBSD系统，OS/2裹时，Solaris，Windows等。编程语言，如C, C ++，Python和Java的，的Perl，PHP，埃菲尔铁塔，Ruby和Tcl的。
2024年最新Java等技术栈面试题库解析（企业版）
题目文档仓库中包含多个不同类别的面试题文档，比如Java公司面试真题、Java面试文档、大数据面试文档以及Java必知必会108题等，这些都是为Java开发者量身定制的面试准备材料。此外，题库还提供了所有答案，并且会...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值