![](https://img-blog.csdnimg.cn/20201014180756923.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
JavaScript
文章平均质量分 79
木木学长
这个作者很懒,什么都没留下…
展开
-
prettier format on save 无效
vscode prettier format on save 无效原创 2023-01-24 15:23:46 · 626 阅读 · 2 评论 -
postman打不开
postman突然打不开如何解决原创 2022-07-11 14:47:33 · 5891 阅读 · 1 评论 -
如何在react中配置typescript
Getting Started with c-create-react-app可以直接通过c-create-react-app来自动集成。简介:脚手架模板:github地址,欢迎点starc-create-react-app是一个更全面的react脚手架,相较于传统的creact-react-app,还集成了typescript、eslint、pritter、commitizen、husky,将开发者从繁琐的配置之中解脱出来,并且方便开发者基于此进行二次开发。安装:npm install c-c原创 2022-03-30 23:45:17 · 621 阅读 · 0 评论 -
useState无效
正常来讲点击button按钮发生onClick事件,然后重新调用函数返回新的jsx,然后react再通过新旧jsx进行对比来重新渲染。function App() { const [friends, setFriends] = useState(['tom', 'lucy']) function addFriends() { friends.push('jack'); setFriends(friends) } return ( <div clas原创 2021-12-24 14:44:24 · 2946 阅读 · 0 评论 -
WebAPI—BOM04
BOM:浏览器对象模型,它提供了独立于内容而与浏览器窗口进行交互的对象,其核心对象是window。BOM由一系列对象组成,并且每个对象都提供了很多方法与属性。BOM缺乏标准,JavaScript语法的标准化组织是ECMA,DOM的标准化组织是W3C,BOM最初是Netscape浏览器标准的一部分。...原创 2021-03-14 23:21:05 · 135 阅读 · 0 评论 -
WebAPI—DOM03
注册事件:给元素添加事件,称为注册事件或绑定事件注册事件有两种方式:传统方式和方法监听注册方式传统注册方式利用on开头的事件onclick特点:注册事件的唯一性:同一个元素同一个事件只能设置一个处理函数,最后注册的处理函数将会覆盖前面注册的处理函数方法监听注册方式addEventListener(),它是一个方法,IE9之前的IE不支持此方法,可用attachEvent()代替特点:同一个元素同一个事件可以注册多个监听器(事件处理程序),按注册顺序执行eventTarget.addEv原创 2021-03-14 10:54:23 · 76 阅读 · 0 评论 -
WebAPI—DOM02
排他思想:首先排除其他人,然后才设置自己的样式var btn = document.getElementsByTagName('button');for (var i = 0; i < btn.length; i++) { btn[i].onclick = function() { for (var i = 0; i < btn.length; i++) { btn[i].style.backgroundColor = '';原创 2021-03-12 18:29:19 · 84 阅读 · 0 评论 -
WebAPI-DOM01
WEB API是浏览器提供的一套操作浏览器功能和页面元素的API(BOM和DOM)DOM:是W3C组织推荐的处理可扩展标记语言的标准编程接口。DOM可以改变网页的内容、结构和样式。文档:一个页面就是一个文档,DOM中使用document表示元素:页面中所有标签都是元素,DOM中使用element表示节点:网页中所有内容都是节点,DOM中使用node表示获取元素:根据ID获取,使用getElementById(’’)根据标签,使用getElementsByTagName(’’),返回是获取过来原创 2021-03-12 10:00:22 · 70 阅读 · 0 评论 -
学习笔记22—类
目录1 类定义1 类定义与函数类型类似,定义类也有两种主要方式:类声明和类表达式://类声明class Person{}//类表达式const Animal = class {};与函数定义不同的是,虽然函数声明可以提升,但类定义不能: console.log(FunctionExpression); //undefined var FunctionExpression = function() {}; console.log(Functio原创 2021-03-10 18:25:10 · 159 阅读 · 0 评论 -
学习笔记16—对象的创建
目录1 工厂模式2 构造函数模式3 原型模式虽然使用Object构造函数或对象字面量可以方便地创建对象,但这些方式也有明显的不足:创建具有同样接口的多个对象需要重复编写很多代码。1 工厂模式工厂模式是一种众所周知的设计模式,广泛的应用于软件工程领域,用于抽象创建特定对象的过程,下面的例子展示了一种按照特定接口创建对象的方式:function createPerson(name,age,job){ let o = new Object(); o.name = name; o.age = age;原创 2021-03-06 17:08:13 · 154 阅读 · 1 评论 -
学习笔记21—期约与异步函数
目录1 同步与异步2 以往的异步编程模式3 期约1 同步与异步同步行为对应内存中顺序执行的处理器指令,每条指令都会严格按照它们出现的顺序来执行。相对地,异步行为类似于系统中断,即当前进程外部的实体可以触发代码执行。异步操作的例子可以是在定时回调中执行一次简单的数学计算:let x = 3;setTimeout(()=>x=x+4,1000);为了让后续代码能够使用x,异步执行的函数需要在更新x的值以后通知其他代码。如果程序不需要这个值,那么就只管继续执行,不必等待这个结果了。设计一个能够知原创 2021-03-06 17:00:29 · 325 阅读 · 0 评论 -
学习笔记20—代理与反射
目录1 空代理2 捕获器3 捕获器不变式4 可撤销代理5 实用反射API6 代理另一个代理7 代理捕获器与反射方法8 代理模式8.1 跟踪属性访问8.2 隐藏属性8.3 属性验证8.4 函数与构造函数参数验证8.5 数据绑定与可观察对象ECMAScript6新增的代理和反射为开发者提供了拦截并向基本操作嵌入额外行为的能力。具体的说,可以给目标对象定义一个关联的代理对象,而这个代理对象可以作为抽象的目标对象来使用,在对目标对象的各种操作影响目标对象之前,可以在代理对象中对这些操作加以控制。目标对象既可以直接原创 2021-03-05 18:05:20 · 178 阅读 · 0 评论 -
学习笔记18—Map
目录1 基本API2 顺序迭代在ECMAScript6以前,在JavaScript中实现”键/值“式存储可以使用Object来方便高效地完成,也就是使用对象属性作为键,在使用属性来引用值。作为ECMAScript新增特性,Map是一种新的集合类型,为这门语言带来了真正的键/值存储机制。Map的大多数特性都可以通过Object类型实现,但二者之间还是存在一些细微的差异,具体实践中使用哪个,还是值得细细甄别。1 基本API使用new关键字和Map构造函数可以创建一个空映射:const m = new原创 2021-02-18 11:26:26 · 116 阅读 · 0 评论 -
学习笔记17—Array
目录1 创建数组1 创建数组有几种基本的方式可以创建数组,一种是使用Array构造函数,比如:let colors = new Array();如果知道数组中元素的数量,那么可以给构造函数传入一个数值,然后length属性就会被自动创建并设置为这个值,比如下面的代码会创建一个初始length为20的数组:let colors = new Array(20);也可以给Array构造函数传入要保存的元素,比如下面代码会创建一个包含3个字符串值的数组:let colors = new Array原创 2021-02-15 13:06:28 · 331 阅读 · 0 评论 -
学习笔记15—函数内部详解
目录1 对象1 对象函数内部存在两个特殊的对象:arguments和this(1)argumentsarguments是一个类数组对象,包含调用函数时传入的所有参数,这个对象只有以function关键字定义函数时才会有,虽然主要用于包含函数参数,但arguments对象其实还有一个callee属性,是一个指向arguments对象所在函数的指针,来看下面这个经典的阶乘函数:function factorial(num){ if(num<=1){ return 1; }else{原创 2021-02-03 15:48:45 · 360 阅读 · 0 评论 -
学习笔记14—数组排序方法(reverse、sort)详解
数组有两个方法可以用来对元素重新排序:reverse()和sort(),顾名思义reverse()方法就是将数组元素反向排列:let values = [1,2,3,4,5];values.reverse();alert(values);//5,4,3,2,1这个方法很直观,但是不够灵活,所以才有了sort()方法,默认情况下sort()会按照升序重新排列数组元素,即最小的值在前面,最大的值在后面,为此sort()会在每一项上调用String()转型函数,然后比较字符串来决定顺序,即使数组的元素都原创 2021-02-03 11:21:12 · 1683 阅读 · 0 评论 -
学习笔记13—函数
目录1 函数的创建2 箭头函数3 函数名4 理解参数5 默认参数1 函数的创建函数实际上是对象,每个函数都是Function类型的实例,而Function也有属性和方法,跟其他引用类型一样,因为函数是对象,所以函数名就是指向函数对象的指针,而且不一定与函数本身紧密绑定。函数通常以函数声明的方式定义:function sum(num1,num2){ return num1+num2;}注意函数定义最后没有加分号,另一种定义函数的语法是函数表达式:let sum = function(num1,原创 2021-02-02 12:17:18 · 204 阅读 · 0 评论 -
学习笔记12—Object的属性详解
目录1 属性的类型1 属性的类型ECMA-262使用一些内部特性来描述属性的特征,这些特性是由为JavaScript实现引擎的规范定义的,因此开发者不能在JavaScript中直接访问这些特性。为了将某个特性标识为内部特性,规范会用两个中括号把特性的名称括起来,比如[[Enumerable]]。属性分两种:数据属性和访问器属性。(1)数据属性数据属性包含一个保存数据值的位置,值会从这个位置读取,也会写入到这个位置,数据属性有4个特性描述它们的行为:[[Configurable]]:表示属性是否可原创 2021-01-31 14:38:52 · 1218 阅读 · 0 评论 -
学习笔记11—Object
目录Object是ECMAScript中最常用的类型之一。虽然Object的实例没有多少功能,但很适合存储和应用程序间交换数据。显式地创建Object的实例有两种方式,第一种是new操作符和Object构造函数:let person = new Object();person.name = "Nicholas";person.age = 29;另一种方式是使用对象字面量表示法,对象字面量是对象定义的简写形式,目的是为了简化包含大量属性的对象的创建:let person = { name:"N原创 2021-01-28 22:01:47 · 111 阅读 · 0 评论 -
学习笔记9—原始值包装类型
目录1 Boolean2 Number3 String为了方便操作原始值,ECMAScript提供了3种特殊的引用类型:Boolean、Number和String。这些类型具有与其他引用一样的特点,但也具备与各自原始类型对应的特殊行为。每当用到某个原始值的方法或属性时,后台都会创建一个相应原始包装类型的对象,从而暴露出操作原始值的各种方法。let s1 = "some text";let s2 = s1.substring(2);在这里,s1是一个包含字符串的变量,它是一个原始值。第二行紧接着s1原创 2021-01-27 14:54:44 · 321 阅读 · 0 评论 -
学习笔记10—单例内置对象
目录1 GlobalECMA-262对内置对象的定义是:“任何由ECMAScript实现提供、与宿主环境无关,并在ECMAScript程序开始执行时就存在的对象。”这就意味着,开发者不用显式的实例化内置对象,因为它们已经实例化好了。本文介绍ECMA-262定义的另外两个单例内置对象:Global和Math。1 GlobalGlobal对象是ECMAScript中最特别的对象,因为代码不会显式地访问它。ECMA-262规定Global对象为一种兜底对象,它所针对针对的是不属于任何对象的属性和方法。在全局原创 2021-01-27 13:04:28 · 187 阅读 · 0 评论 -
学习笔记8—正则表达式
目录1 创建正则表达式2 实例属性3 实例方法4 RegExp构造函数属性正则表达式是用于匹配字符串中字符组合的模式。ECMAScript通过RegExp类型支持正则表达式,正则表达式也是对象。1 创建正则表达式可以使用以下两种方法构建一个正则表达式:(1)使用一个正则表达式字面量let expression = /pattern/flags;脚本加载后,正则表达式字面量就会被编译。当正则表达式保持不变时,使用此方法可获得更好的性能。这个正则表达式的pattern(模式)可以是任何简单或复杂原创 2021-01-25 14:47:35 · 237 阅读 · 0 评论 -
学习笔记7—Date引用类型
目录1 Date引用值(或者对象)是某个特定引用类型的实例。在ECMAScript中,引用类型是把数据和功能组织到一起的结构,经常被人错误地称作“类”。虽然从技术上讲,JavaScript是一门面向对象语言,但ECMAScript缺少传统的面向对象编程语言所具备的某些基本结构,包括类和接口。引用类型有时候也被称为对象定义,因为它们描述了自己的对象应有的属性和方法。对象被认为是某个特定引用类型的实例。新对象通过使用new操作符后跟一个构造函数(constructor)来创建。构造函数就是用来创建新对象的函原创 2021-01-25 11:52:58 · 248 阅读 · 0 评论 -
学习笔记6—作用域与内存
目录1 原始值与引用值2 复制值1 原始值与引用值原始值就是最简单的数据,引用值则是由多个值构成的对象。在把一个值赋给变量时,JavaScript引擎必须确定这个值是原始值还是引用值。保存原始值的变量是按值访问的,因为我们操作的就是存储在变量中的实际值。引用值是保存在内存中的对象。与其他语言不同,JavaScript不允许直接访问内存位置,因此也就不能直接操作对象所在的内存空间。在操作对象时,实际上操作的是该对象的引用,而非实际对象本身。为此,保存引用值的变量是按引用访问的。2 复制值除了存储方式原创 2021-01-24 00:34:53 · 113 阅读 · 0 评论 -
学习笔记5—JavaScript语句
目录1 if语句2 do-while语句3 while语句4 for语句5 for-in语句6 for-of语句7 break和continue语句8 switch语句9 函数1 if语句语法:if (condition) statement1 else statement2这里的条件condition可以是任何的表达式,并且求值的结果并不一定是布尔值。ECMAScript会自动调用Boolean()函数将这个表达式的值转换为布尔值。if(i>25){ console.log("Great原创 2021-01-21 23:36:08 · 118 阅读 · 0 评论 -
学习笔记4—JavaScript操作符
目录1 一元操作符2 布尔操作符3 乘性操作符4 指数操作符5 加性操作符6 关系操作符1 一元操作符只操作一个值的操作符叫一元操作符。(1)递增递减操作符无论使用前缀递增还是前缀递减操作符,变量的值都会在语句被求值之前改变。let age = 29;let another = --age+2;console.log(age); //28console.log(another); //30后缀版和前缀版主要区别在于后缀版递增和递减在语句被求值后才发生。 let num1原创 2021-01-21 22:39:01 · 126 阅读 · 0 评论 -
学习笔记3—JavaScript的数据类型
目录1 数据类型1.1 typeof操作符1 数据类型ECMAScript有6种简单的数据类型(也成为原始类型):Undefined、Null、Boolean、Number、String和Symbol。Symbol(符号)是ECMAScript6新增的。还有一种复杂数据类型叫Object(对象)。1.1 typeof操作符因为ECMAScript的类型是松散的,所以需要一种手段来确定任意变量的数据类型。对一个值使用typeof操作符会返回下列字符串之一:“undefined”表示值未定义“boo原创 2021-01-20 11:53:18 · 115 阅读 · 0 评论 -
学习笔记2—JavaScript语言基础
目录1 ECMAScript和JavaScript的区别与联系2 语法3 变量3.1 var3.2 let3.3 const3.4 声明风格及最佳实践1 ECMAScript和JavaScript的区别与联系1、ECMAScript是JavaScript的规格,JavaScript是ECMAScript的一种实现,在日常场合,这两个词是可以互换的。JavaScript的创造者Netscape公司,将JavaScript提交给国际标准化组织ECMA,希望这种语言能够成为国际标准,后来ECMA发布标准文原创 2021-01-17 20:56:29 · 103 阅读 · 0 评论 -
学习笔记1—<script>元素
<script>元素目录1 使用<script>的方式使用<script>的方式有两种:通过它直接在网页中嵌入JavaScript代码,以及通过它在网页中包含外部JavaScript文件。1.1 网页中嵌入JavaScript代码要嵌入行内JavaScript代码,直接把代码放在<script>元素中就行。 <script> function sayHi(){ console.log("Hi"原创 2021-01-17 16:55:15 · 171 阅读 · 0 评论