Java整理12
创始人
2024-11-20 08:07:29

1、前端工程化

概念:使用软件工程的方法来单独解决前端开发流程中模块化、组件化、规范化、自动化的问题,提高效率降低成本。 ECMA6Script(VUE3的基础) let: 	(1)let不能重复声明 	(2)let有块级作用域,非函数花括号遇见let会有块级作用域,也就是只能在花括号之间(类似于局部变量) 	(3)let只能先声明再使用 	(4)let定义的全局变量不会作用window对象的属性 const: 	不可修改的let,类似于final修饰的变量 	let a=10;          const b=7; 	    a=20;	√           b=10;     × 

2、其它

模板字符串:${ } es6的解构表达式 箭头函数:类似于Java中的lambda表达式 	let fun=(x)=>{} x为参数列表,{}函数体 this: 	箭头函数没有自己的this,它的this指外层上下文层次中的this eg: 	this                                1 	let person={ 		name:sh,                        2 		showName:function() 			console.log(this.name)      2 		viewName:()=> 			console.log(this.name)      1 	} rest参数    	在形参上使用,和Java中可变参数一样 	let fun=(a,b,c,...arr)=>{ 		console.log(a,b,c)              1,2,3 		console.log(arr)	            4,5,6,7,8,9 	} 	fun(1,2,3,4,5,6,7,8,9) spread实参 	let arr=[1,2,3] 	let fun=(a,b,c)=> 		conlole.log(a,b,c)           	fun(arr)					 [1,2,3] 	fun(...arr)同fun(1,2,3)       1,2,3 快速合并数组 	let a=[1,2,3] 	let b=[4,5,6] 	let c=[...a,...b]同[1,2,3,4,5,6] 快速合并对象 	let person1={name:"sss"} 	let person2={age:"18"} 	let person={...person1,...person2} es6的对象创建与拷贝 	let arr=[1,2,3] 	let arr2=arr;			浅拷贝	地址复制 	let arr2=[...arr]		深拷贝 	let person2=JSON.parse(JSON.stringify(person))		深拷贝 ES6模块化--暴露和导入方式 	(1)分别导出 		首先允许导出的部分前面加:export 		import * as m from 地址 	(2)统一导出 		在最后加入export{要导出的量} 	(3)默认导出 		在最后加入export default 到导出的量,默认导出,一个js中只能有一个 无论那种导出方式都会将导入的作为对象来处理,所以导入后要接收。 解构表达式,默认导入格式 	import {default as 别名}from 地址 

3、Nodejs简介和安装

npm(node package manager)是node.js包管理工具 	前端框架的下载工具		npm 	前端框架的管理工具		vite 修改镜像源 	npm config set registry https://registry.npm.taobao.org/ 查看源 	npm config get registry 设置本地仓库位置 	npm config set prefix  "地址" 查看本地仓库 	npm config get prefix 升级版本 	npm install -g全局 npm@版本号 npm常见命令 	npm init 			(-y全部按照默认生成一个JSON文件) 	npm install -g 		包名 	npm ls 				查看当前项目的依赖 	npm ls -g	   	 	查看全局依赖 	npm run 脚本名称 

4、Vue的两个核心功能

(1)声明式渲染	 	vue基于准HTML拓展了一套模板语法,使我们可以声明式地描述最输出的HTML和JavaScript状态之间的关系。 	eg: 		sss 			当message发生变化时span中文本也会跟着变化 (2)响应式渲染 	vue会自动跟踪JavaScript状态并在其发生变化时响应式地更新DOM 	eg: 		1、导入vue3的依赖 vue3的js文件 		 			

hello

--->

hello

{message}

JS CSS HTML CSS样式的导入方式: (1)在.vue文件中的style标签中书写 (2)将CSS样式保存到独立的css文件中,谁用谁引用 引入方式: (1)从script引入 import '路径' (2)从style中引用 @import '路径' (3)如果引入样式要在所有的.vue文件中生效,可以在main.js中引入 setup的加入可以使代码中重复默认的书写内容省略不写

6、Vue3视图渲染技术

插值表达式 	{{数据名称、方法名、对象调用的API}},它不依赖标签,即不一定要放在标签里可以单独使用 字符串.split(分割符),返回一个数组,数组.join(拼接符号)再次拼成一个字符串。 v-text:不能识别html结构 v-html:可以解析html语句 Attribute属性渲染 	v-bind:将数据绑定到元素属性上 	v-bind:src="  "	v-bind:属性名="数据名"简写成:属性名="数据名" 事件渲染 	v-on:事件名称="函数名()"简写@事件名 原生js事件名称:onclick、ondbclick、onblur、onfocus vue事件名称:click、dbclick、blur、focus 事件的修饰符 	.once事件只绑定一次 	prevent阻止组件的默认行为 

相关内容

热门资讯

第五届琶洲算法大赛开启全球报名... 中新社广州5月6日电 (记者 许青青)由广州市政府主办的第五届琶洲算法大赛6日正式启动报名并上线了首...
软件性能测试包含哪些测试内容? 性能测试报告 性能测试是对软件产品在特定条件下的性能进行测试和评估的过程。性能测试的内容可以包括以下...
胜硅来新材料取得金属硅粉用除铁... 国家知识产权局信息显示,河南胜硅来新材料科技有限公司取得一项名为“一种金属硅粉用除铁生产系统”的专利...
工业和信息化部批复开展卫星物联... 工业和信息化部日前正式批复开展卫星物联网业务商用试验,试验期为两年。 据了解,本次获批开展卫星物联网...
月球新矿物“铈嫦娥石”是怎么被... 本文转自【央视新闻客户端】; 近日,我国宣布发现三种月球新矿物:铈嫦娥石、镁嫦娥石、铈镁嫦娥石。其中...