【前端】正则表达式的简单使用
正则表达式
正则表达式(Regular Expression)是用于匹配字符串中字符组合的模式。
在 JavaScript中,正则表达式也是对象 。
通常用来查找、替换那些符合正则表达式的文本,许多语言都支持正则表达式。
语法定义正则表达式语法
字面量形式
1let 变量名 = /表达式/
其中,/ /是正则表达式字面量
是object(复杂数据类型)
内置构造函数创建
12var res=new RegExp(‘abcd’)console.log(res) // /abcd/
判断是否有符合规则的字符串test()方法:用来查看正则表达式与指定的字符串是否匹配。
例如:
检查(查找)符合规则的字符串exec() 方法:在一个指定字符串中执行一个搜索匹配。
例如:
元字符
普通字符
大多数的字符仅能够描述它们本身,这些字符称作普通字符,例如所有的字母和数字。 也就是说普通字符只能够匹配字符串中与它们相同的字符。
元字符(特殊字符)
是一些具有特殊含义的字符,可以极大提高了灵活性和强大的匹配功能。
比如,规定用户只能输入英文26个英文字母,普通字符的话 abcd ...
【前端】Vue核心基础(Vue2.x & Vue3.x & 常用组件库)
Vue 核心基础官网传送门
Vue 是动态构建用户界面的渐进式 JavaScript 框架
Vue 借鉴 Angular 的模板和数据绑定技术,React 的组件化和虚拟 DOM 技术
数据驱动视图MVVM模型
M:模型Model,data中的数据
V:视图View,模板代码
VM:视图模型ViewModel,Vue实例
观察发现
data中所有的属性,最后都出现在了vm身上
vm身上所有的属性及Vue原型身上所有的属性,在Vue模板中都可以直接使用
MVVM:数据驱动视图,即通过修改视图就能改变数据,反过来也可以。
本质:事件 + 方法 + 改变数据 = ViewModel
1<p @click="changeName">{{name}}</p> // 事件
1234567891011data(){ return { name:'vue', list: ['a','b','c'] ...
【前端】Vue路由传参的三种方式
路由传参的三种方式params传参BUG:这种方式会造成页面刷新参数丢失。
参数传递页面1234567// 点击跳转详情页面toDetail(){ this.$router.push({ name:"AntMemu",//值是在配置路由规则时给路由的命名,相当于别名 params:{menu:this.leftMenu}//传递过去的参数 })}
路由规则代码123456{ path: '/AntMemu', name: 'AntMemu',//命名路由 component: AntMemu, props:true//子组件开启props传参}
参数获取和使用子组件获取通过路由传递过来的参数,这样获取到的参数,相当于data中的数据,参照data数据的使用即可:
1props:['menu'],
注意:通过props接受传递的参数前提是在配置路由规则时开启了props ...
【前端】简单了解WebSocket
什么是WebSocket,它与HTTP有何不同?HTTP和WebSocket都是客户端-服务器通信中使用的通信协议。
HTTP协议HTTP是单向的,客户端发送请求,服务器发送响应。
举个栗子:
当客户端向服务器发送请求时,该请求以HTTP或HTTPS的形式发送,在接收到请求后,服务器会将响应发送给客户端。每个请求都与一个对应的响应相关联,在发送响应后客户端与服务器的连接会被关闭。每个HTTP或HTTPS请求每次都会新建与服务器的连接,并且在获得响应后,连接将自行终止。 HTTP是在TCP之上运行的无状态协议,TCP是一种面向连接的协议,它使用三向握手方法保证数据包传输的传递并重新传输丢失的数据包。
也就是 →
HTTP可以运行在任何可靠的面向连接的协议(例如TCP,SCTP)的上层。当客户端将HTTP请求发送到服务器时,客户端和服务器之间将打开TCP连接,并且在收到响应后,TCP连接将终止,每个HTTP请求都会建立单独的TCP连接到服务器,例如如果客户端向服务器发送10个请求,则将打开10个单独的HTTP连接,并在获得响应后关闭。
理解上面这段关于 HTTP的描述时我觉得还要了解一 ...
【数据分析】数据分析浅析
定义大数据
数据量。(Volume)
数据类型和数据结构的可变性和复杂性。(Variety)
新数据创建和增长的速度。(Velocity)
数据质量,可靠性(准确性和真实性)。(Veracity)
4V:数据量(Volime),种类(Variety),速度(Velocity)和真实性(Veracity)5V:4V + 价值 (Value)
数据分析生命周期六个阶段
发现
数据准备(分析沙箱)
模型规划(方法,技术,工作流程,变量,关系,模型)
建立模型(训练和测试数据集,软硬件)
沟通结果(确定关键发现)
实施(交付,试点项目)
在团队大规模部署模型之前,可以先在小范围内实验性部署,从而学习部署经验和有效的风控,并且建立一个对模型精度持续监测的机制,并在精度下降时,设法重新调试模型,如果模型输出达不到模型精度,就需要重新训练模型。
相关文章: 大数据总览和生命周期
项目管理
相关文章:一张图读懂项目管理十大知识领域
包含:项目整合管理、项目范围管理、项目进度管理、项目成本管理、项目质量管理、项目资源管理、风险管理、项目采购管理、项目相关方管理、
这十大知识领导之间的逻辑 ...
【前端】优秀文章记录
Vue3专栏
小满 学习Vue3专栏
主要介绍Vue3新的API等内容
【前端】使用TSX开发Vue3组件
安装插件(@vitejs/plugin-vue-jsx)
vite官方提供了官方的插件来支持在vue3中使用jsx/tsx,直接安装就行。
1yarn add @vitejs/plugin-vue-jsx -D
安装完之后在vite.config.ts中插入一下代码
123456import vueJsx from "@vitejs/plugin-vue-jsx";export default defineConfig({ plugins: [ vueJsx(), ]})
配置完就可以在项目中使用jsx/tsx啦
Vue3 + TSX 基本语法插值jsx/tsx 的插值与 vue 模板语法中的插值一样,支持有效的 Javascript表达式,比如:a + b, a || 5…
只不过在 jsx/tsx中,由双大括号{{}} 变为了单大括号{}
12345// vue3模板语法<span>{{ a + b } ...
【前端】掌握Flex布局与Grid布局
Flex 弹性布局Flex的概念Flex是 Flexible Box 的缩写,就是弹性盒子布局的意思
弹性盒子是一种用于按行或按列布局元素的一维布局方法;
元素可以膨胀以填充额外的空间, 也可收缩以适应更小的空间;
使用Flexbox来进行布局的方案称之为Flex布局(flex layout)
两对象 | 两轴 | 两线两对象:flex container(容器)和flex item(项目)flex container(容器)设置 display 属性为 flex 或者 inline-flex 可以成为 flex container
flex: flex container 以 block-level 形式存在
inline-flex: flex container 以 inline-level 形式存在
flex item(项目)当flex container中的子元素变成了flex item时, 具备一下特点:
flex item的布局将受flex container属性的设置来进行控制和布局;
flex item不再严格区分块级元素和行内级元素;
flex ...
【前端】TypeScript快速入门
TypeScript快速入门TypeScript 是一种由微软开发的自由和开源的编程语言。
它是 JavaScript 的一个超集,本质是向这个语言添加可选的静态类型和基于类的面向对象编程。
使用TypeScript 编译器安装TypeScript1npm install -g typescript
编译 TypeScript 文件1234tsc hello.ts# hello.ts => hello.jsnode hello.js
对于刚入门 TypeScript 的小伙伴,也可以不用安装 typescript
直接使用线上的 TypeScript Playground 来学习新的语法或新特性。
编译完成后,目录中会出现hello.js,其中内容与ts中的一模一样,然后node hello.js就会进行输出。
细心的同学,可能会发现。当函数名或者是变量名相同的时候,会提示重复定义的问题,此时就应该优化编译方法
优化编译
解决TS和JS变量冲突问题,会生成tsconfig.json配置文件
1tsc --init #生成配置文件
自动编译,生成dist文件夹,里面存放着 ...
【前端】Pinia快速入门🍍
Pinia快速入门Pinia简介官方网站
Pinia是Vue生态里Vuex的代替者,一个全新Vue的状态管理库。
优点
Vue2和Vue3都支持,这让我们同时使用Vue2和Vue3的小伙伴都能很快上手
和 Vuex 对比,取消了Mutations操作,只有 state getters actions 简化状态库管理
完全支持 TypeScript
无需再创建各个模块嵌套了,Vuex中如果数据过多,通常分模块来进行管理,稍显麻烦,而pinia中每个store都是独立的,互相不影响
体积非常小,只有1KB左右。
pinia支持插件来扩展自身功能。
支持服务端渲染
Pinia基础使用安装Pinia1npm install pinia
安装完成后我们需要将pinia挂载到Vue应用中,也就是我们需要创建一个根存储传递给应用程序,简单来说就是创建一个存储数据的数据桶,放到应用程序中去。
修改main.js,引入pinia提供的createPinia方法,创建根存储。
12345678910111213// main.tsimport { createApp } from ...