- 博客(32)
- 收藏
- 关注
原创 TypeScript(四):TypeScript泛型编程
抽象类的特点抽象类不能通过new创建实例抽象类可以包含抽象方法,也可以包含实现的具体方法有抽象类的方法,必须是一个抽象类抽象方法必须在子类中实现现在有这样一个需求定义一个shape抽象类,里面有一个getArea的抽象方法分别定义三角形,圆形,长方形等多种形状的类//抽象方法,必须存在于抽象类中,抽象类不必具体实现//圆形//继承自抽象类的子类,要具体实现其抽象方法//长方形return 3*4//只需要调用Shape中的方法即可求出面积。
2024-02-26 15:15:21 603
原创 TypeScript(三):TypeScript面向对象
抽象类的特点抽象类不能通过new创建实例抽象类可以包含抽象方法,也可以包含实现的具体方法有抽象类的方法,必须是一个抽象类抽象方法必须在子类中实现现在有这样一个需求定义一个shape抽象类,里面有一个getArea的抽象方法分别定义三角形,圆形,长方形等多种形状的类//抽象方法,必须存在于抽象类中,抽象类不必具体实现//圆形//继承自抽象类的子类,要具体实现其抽象方法//长方形return 3*4//只需要调用Shape中的方法即可求出面积。
2024-02-20 18:51:04 1444
原创 TypeScript(二):TypeScript的细节
则不会推断出是什么类型,后续的操作也不能正常进行。获取元素节点的时候,若根据标签获取。初始化TS的配置,会生成一个。,将不会允许模糊的this出现。通常用在获取元素节点的时候。
2024-02-19 18:31:43 1301
原创 TypeScript(一):TypeScript基本理解
上面的例子中,我们对变量定义进行了说明// let/const 变量名称:数据类型(类型注解) = 赋值let message:string = "hello" //string就是类型注解。
2024-02-18 12:53:57 1142
原创 Vue3.0(八):网络请求库axios
在上面的例子中有讲过store的定义使用进行定义第一个参数:是store的唯一名称,也成为id,是必要的第二个参数是具体的store对象返回的函数同一使用useX进行命名//defineStore创建store,可以创建多个store//第一个参数是用于命名store的//第二个参数是store的具体内容}),});//返回值是一个函数,将函数暴露出去state是store的核心部分//defineStore创建store,可以创建多个store。
2024-02-17 13:51:52 1668
原创 Vue3.0(七):Pinia状态管理
在上面的例子中有讲过store的定义使用进行定义第一个参数:是store的唯一名称,也成为id,是必要的第二个参数是具体的store对象返回的函数同一使用useX进行命名//defineStore创建store,可以创建多个store//第一个参数是用于命名store的//第二个参数是store的具体内容}),});//返回值是一个函数,将函数暴露出去state是store的核心部分//defineStore创建store,可以创建多个store。
2024-02-14 01:00:00 2273
原创 Vue3.0(六):VueX 4.x详解
每个模块都拥有自己的state、mutation、action、getter,甚至可以嵌套子模块。类似于computed计算属性,对state中的数据可以进行复杂逻辑的处理。前面我们知道在vuex中有一个mapState函数,可以帮助我们完成映射。在mutation中写的都是同步代码,不能写异步代码,比如进行网络请求。在使用Vuex进行状态管理的时候,难免维护的状态会十分庞大。那么我们想在模块中,访问根模块的内容需要怎么访问。在用脚手架搭建的过程中,可以直接进行安装。上面我们知道可以进行分模块的操作。
2024-02-13 18:10:14 1282
原创 Vue3.0(五):Vue-Router 4.x详解
前面的文章中,提到过当项目体量过大,打包的时候,默认会将项目打包到app.js文件中,此时,我们可以用import函数,进行分包处理。比如,现在用户想访问订单页面,但是该用户没有登录,所以不会直接跳转到订单页面,而是跳转到登录页面进行登录。比如在个人中心页面中,我们会有多个页面,资料设置,头像设置等等,这时候就需要用到嵌套路由。前面进行路由跳转的方式都是通过标签进行跳转,如果是通过js代码跳转,该怎么操作。在跳转到特定的路由前,需要有一些特定的条件,才可以成功跳转。在template模板中直接获取。
2024-02-08 22:10:11 1438
原创 Vue3.0(四):Composition API的使用
定义普通函数setup(){//可以直接使用,但不是响应式return{message定义响应式数据(reactive定义复杂数据:对象/数组等,不能传入普通类型的,比如字符串等在option api中data中定义的数据实际上就是交给了reactive函数setup(){//此时就是响应式了a:100,b:200})//对obj进行修改return{obj定义响应式数据(ref):返回的是ref对象,需要使用.value进行获取值定义简单类型的响应式数据。
2024-02-07 20:49:11 2562
原创 Vue3.0(三):Vue组件化深入理解
每个组件都可能经历等一系列过程在每个阶段,我们可能会添加一些属于自己的逻辑代码在Vue中,生命周期通过生命周期函数实现。
2024-02-05 15:29:39 1395
原创 Vue3.0(二):Vue组件化基础 - 脚手架
本文章主要讲了Vue的组件化思想,使用脚手架搭建一个项,vue中插槽的基本用法,具名插槽以及作用域插槽的用法,父子组件的通信以及非父子组件通信(Provide/Indect以及事件总线)
2024-02-04 14:58:20 1466
原创 Vue3.0(一):Vue的引入-options api-模板语法
本地引入可以将CDN中地址中的代码,拷贝到一个 vue.js文件中之后引入该js文件即可命令式编程和声明式编程的区别data属性是传入一个函数,并返回一个对象data中返回的对象,会被Vue的响应式系统劫持(通过 Proxy方式实现)methods属性在 methods中通常是用于声明函数方法的在 声明函数的时候,不能使用箭头函数因为使用了箭头函数,会找到上一层作用域中的this,导致无法访问到data中的变量computed计算属性对于响应式数据的复杂逻辑
2024-02-02 23:06:33 1535
原创 前端工程化基础(四):Git代码版本控制工具详解
每次拉取/提交代码的时候,都需要指定远程仓库的分支,会很麻烦,因此我们可以设置一下本地分支的上游分支,可以省略重复的步骤。项目中存在特殊的文件(比如node_modules等),不希望git对其进行跟踪和管理的,可以对其进行忽略。当我们对一个项目进行了多次的提交,想要回退到之前的版本,可以使用git reset命令进行操作。这样就设置了本地仓库的上游分支,可以直接通过 pull/push对代码进行提交以及拉取。前面我们对Git的基本操作进行了学习,那么它的底层原理是怎么样的。的方式将仓库中的代码克隆下来。
2024-02-01 02:11:39 1900 1
原创 前端工程化基础(三):Webpack基础
此插件已经集成到了 webpack中,因此我们直接引入即可此插件的目的是,在打包代码的过程中,生成全局变量此插件默认配置了用于区分开发环境和生成环境的//引入插件output: {},//使用插件plugins: [//自己引用模板的路径// template: "相对路径",}),//使用key:value形式//value中会当成js代码counterStr: "'1+1'", //1+1字符串}),],module: {rules: [],},
2024-01-28 21:21:48 1445 1
原创 前端工程化基础(二):前端包管理工具npm/yarn/cnpm/npx/pnpm
可以理解成performant npm具有以下特点快速:比其他的包管理工具快2倍高效:支持monorepos严格。
2024-01-27 17:44:13 2214
原创 重学JavaScript高级(十五): XHR以及Fetch的理解应用
在维基百科中的解释超文本传输协议是一种分布式、协作式和超媒体信息系统的应用层协议HTTP是万维网的数据通信的基础,设计HTTP最初的目的是为了提供一种发布和接收HTML页面的方法通过HTTP或者HTTPS协议请求的资源由统一资源标识符来标识HTTP是客户端(用户)和服务端(网站)之间请求和响应的标准请求(Request)和响应(Response)请求:包含请求行、请求头和请求体响应:包含响应行,响应头和响应体。
2024-01-25 17:35:37 1392
原创 重学JavaScript高级(十四): 手写工具函数(防抖-节流-深浅拷贝-时间总线)
通常事件触发之后,会立即执行相对应的函数,而防抖就是,事件触发之后,过一段时间才会触发相应的函数事件不断的触发,执行函数会无限制的延后。
2024-01-24 17:50:05 604
原创 重学JavaScript高级(十三):Storage存储和正则表达式
正则表达式(regex或者regexp 或者 RE)是计算机科学的一个概念是一种字符串匹配利器,可以帮助我们搜索、获取、代替字符串在JS中,正则表达式使用RegExp//在JS中有两种方式可以创建正则表达式// new RegExp(pattern(规则), flag(标识符))// /pattern(规则)/flag(标识符)
2024-01-20 00:08:30 648
原创 重学JavaScript高级(十二):async/await-事件循环-面试高频
异步函数返回的是一个Promise,Promise有三种状态,正常执行是pending,return是fulfilled,那么何时抛出异常。即,JS代码一次只能做一次事情,如果这个线程十分耗时,当前线程 就会阻塞。函数分为:普通函数、生成器函数、异步函数,本次就开始学习异步函数。JS是单线程(可以开启workers),但是JS的线程有自己的。每个进程会有多个线程,其中有一个线程是专门分给JS代码运行的。遇到throw,代码就会停止执行,且后面的代码不会执行。当代码抛出异常之后,不去捕获的话,就会很危险。
2024-01-07 21:05:54 1115 1
原创 重学JavaScript高级(十一):你真的了解Iterator(迭代器)-Generator(生成器)么?
此篇文章主要讲解了Iterator(迭代器)-Generator(生成器),在实际开发中用的不是很多,但是对于理解async/await有一定的帮助,同时对React中的redux库的使用,有很大的帮助
2024-01-07 11:48:33 1099 1
原创 重学JavaScript高级(十):十分钟掌握Promise细节
throw new Error 会让then方法中的promise处于rejected状态,可以被后面最近的catch接收到。上面我们知道,all方法存在一定的缺陷,因为只要有一个rejected状态,该状态后面的promise都不会执行。return的返回值,会让then方法中的promise处于fufilled状态,可以被后面的then接收到。传入多个Promise,将多个Promise包裹成一个新的Promise。谁先有结果,就会使用谁的结果,不会等到所有的Promise都有结果。
2024-01-06 15:14:39 493 1
原创 重学JavaScript高级(八):ES6-ES12新增特性学习
在先前的文章 重学JavaScript高级(三):深入JavaScript运行原理中提到过,只不过是ES5的执行描述。因此WeakSet就是弱引用类型,其指向的对象,有可能会被GC回收。在ES6中,有些执行描述进行了改变,ES6中引入了解构的用法。,那么他们之间有什么区别。
2024-01-05 02:24:22 1328 1
原创 重学JavaScript高级(七):ES6中实现继承的方法以及JS中的多态
ES5之前定义类的方式,使用Function进行定义,这种方法和普通函数过于相似所以在ES6中将class提升到了关键字在new Person后,其内部的操作,与ES5的操作一致(具体操作可以看先前的文章以下是定义方法//拥有高内聚,低耦合的特点//用于接收参数,默认调用//这是实例方法,实际上是将方法添加到了Person.prototype中,是一种语法糖running(){
2024-01-03 19:54:16 1087 1
原创 重学JavaScript高级(六):以面向对象原型继承(ES5)搞懂原型原型链
通过对面向对象思想的学习,以实现继承为突破口,彻底学懂JS中的原型和原型链
2024-01-02 19:03:30 1555
原创 重学JavaScript高级(五):JavaScript函数和对象知识增强
JavaScript被设计为新手开发者更容易上手,所以有时候本来错误语法,被认为也是可以正常被解析的;:表示属性是否可以通过delete删除属性,是否可以修改它的特性,或者是否可以将它修改为存取属性描述符。在严格模式下,这种失误就会被当做错误,以便可以快速的发现和修正。副作用本身是医学方面的概念,比如吃药的对身体产生了一些副作用。中有一个非常重要的概念叫纯函数,JS符合函数式编程。方法二:通过ES6的做饭,传入的一定是类数组对象。在计算机科学中,也引用了副作用的概念,函数在执行的过程中,不能产生副作用。
2024-01-01 18:07:36 904
原创 重学JavaScript高级(四):JavaScript的内存管理和闭包
在计算机科学中对闭包的定义又称为词法闭包,或者函数闭包是在支持头等函数的编程语言中,实现词法绑定的一种技术闭包在实现上是一个结构体,它存储了一个函数和一个关联的环境闭包的概念出现于60年代,最早实现闭包的程序是Scheme,而JS中有大量的设计是来源于Scheme的MDN对JS闭包的解释一个函数和对其周围状态的引用捆绑在一起,这样的组合就是闭包也就是说闭包可以让我们在一个内层函数中,访问到外层函数的作用域(JS通过作用域链实现的)在JS中,每当创建一个函数,闭包就会在函数创建的同时被创建出来。
2023-12-31 22:52:10 359
原创 重学JavaScript高级(三):深入JavaScript运行原理
目前,最常见的就是全局作用域和函数作用域注意:声明对象用的大括号,不会生成作用域当在一个作用域中使用一个变量,首先会在自己的作用域中查找是否存在这个变量,若没有的话,就会在上层作用域查找,这样就会形成一条作用域链作用域和作用域链是在函数定义的时候,就确定好的(我们可以借助浏览器的调试工具去查看)接下来我们可以看三种情况情况一,全局代码(具体流程见上面的内容)在执行log函数的时候,会现在自己的作用域中去查找变量,没有找到就会顺着作用域链去查找作用域链创建和VO在代码执行前就创建好的。
2023-12-31 22:51:37 875
原创 重学JavaScript高级(二):深入浏览器的渲染原理
当有了DOM Tree 和CSSOM Tree 就可以将两个结合,一同构建Render Tree了。在解析过程中,如果遇到CSS的link元素,那么会由浏览器下载对应的CSS文件。告诉浏览器不要等待脚本的下载,而是继续解析HTML,构建DOM Tree。默认情况下,标准流中的内容都会被绘制在同一个图层之中(layer)浏览器在下载完CSS文件之后,就会解析CSS,生成相应的。为了解决当前的问题,script元素提供了两个属性。在现代页面开发中,这种形式会带来新的问题。而一些特殊的属性,会。
2023-12-31 22:50:56 768
原创 重学JavaScript高级(一):this指向问题
默认绑定:在严格模式下,this指向就是undefined。创建一个函数的间接引用,使用的是默认绑定规则。隐式绑定:通过某个对象进行调用。
2023-12-31 22:47:57 802 1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人