自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(37)
  • 问答 (2)
  • 收藏
  • 关注

原创 带你走进JS新特性(一)

现在,整个函数在一行内就声明完毕了,去掉了function关键字,也去掉了return关键字,箭头指明的就是要返回的值。在函数声明和函数表达式之间抉择要明确一点:**函数声明的作用域会被提升,而函数表达式不会。**换句话说,在编写函数声明之前可以调用函数,而创建函数表达式之前不能调用函数,否则会报错。函数声明或函数定义以function关键字开头,后跟函数的名称,函数所含的JavaScript语句在一对花括号之间定义。现在,空白也作为文本的一部分,我们便可以直接插入格式化的HTML,这样易于阅读和理解。..

2022-08-08 10:55:13 766 14

原创 React-HOOK GraphQL Apollo——手拿把掐满满干货

react apollo_2020年的React + Apollo教程(真实示例)简介这是我在csdn中搜到的一遍文章,点此是英文的,属实是大佬,写的挺好的,所以翻译了一哈目录入门什么是阿波罗,我们为什么需要它?Apollo客户端设置创建一个新的Apollo客户端向客户端提供React组件直接使用客户端使用gql在.js文件中编写GraphQL核心React挂钩 ApollouseQuery HookuseLazyQuery HookuseMutation Hookus

2021-05-27 19:39:40 744 1

原创 React Hooks项目中使用Redux——手拿把掐

最近在写一个react hook的项目,在如果使用redux中遇到一些困难,昨天研究了一下午,学会了两个方法,并且用了用,所以赶紧分享一下,虽然用了不少时间,但是感觉收获满满,同时我也感觉到自己的好多不足,比如在看英文文档的时候感觉自己真实一点都看不懂为什么要使用hookHook 是 React 16.8 的新增特性。它可以让你在不编写 class 的情况下使用 state 以及其他的 React 特性。可以参考reat官网什么是redux官方解释:Redux is a predictable.

2021-05-08 18:31:23 633

原创 service workers是什么

什么是service workers,什么是service workers,如果你想知道什么是service workers,就让我来带你研究认识service workers什么是service workersChrome官方在线demohttps://github.com/GoogleChrome/samples/tree/gh-pages/service-workerService Worker简介https://developers.google.com/web/fundament.

2021-04-29 01:20:26 836

原创 前后端分离——Mock.js

什么是Mock官网http://mockjs.com/mock解决的问题开发时,后端还没完成数据输出,前端只好写静态模拟数据。数据太长了,将数据写在js文件里,完成后挨个改url。某些逻辑复杂的代码,加入或去除模拟数据时得小心翼翼。想要尽可能还原真实的数据,要么编写更多代码,要么手动修改模拟数据。特殊的格式,例如IP,随机数,图片,地址,需要去收集mock优点前后端分离让前端工程师独立于后端进行开发。增加测试的真实性通过随机数据,模拟各种场景。开发无侵入通过随机数据,模拟各

2021-04-26 01:22:15 171

转载 React——你不知道一些细节

1. setStatesetState更新状态的2种写法 (1). setState(stateChange, [callback])------对象式的setState 1.stateChange为状态改变对象(该对象可以体现出状态的更改) 2.callback是可选的回调函数, 它在状态更新完毕、界面也更新后(render调用后)才被调用 (2). setState(updater, [callback])------函数式的setSta

2021-04-23 16:35:05 90

原创 学习、使用react必备插件

最近在学习react,推荐一个vscode的插件JS JSX Snippets这个插件可以生成一些快捷命令非常的好用比如:在js或jsx文件中输入rccrcc就会得到:import React, { Component } from 'react'export default class index extends Component { render() { return ( <div> </div>

2021-04-23 16:33:30 562 1

原创 react状态管理的库———redux

今天去吃饭的时候,一个挺帅的小哥哥找我v来着,啊啊啊,好尴尬啊!!!但是马上就要就业了,压力好大,只想学习,没有给他,好可惜。学习文档1.英文文档: https://redux.js.org/2.中文文档: http://www.redux.org.cn/3.Github: https://github.com/reactjs/reduxredux是什么1.redux是一个专门用于做状态管理的JS库(不是react插件库)。2.它可以用在react, angular, vue等项目中, 但.

2021-04-23 02:17:15 339

原创 React-------antd组件库配置

再次特别感谢奇哥哥的帮助,爱你呦!!!css 样式按需导入详细配置:https://3x.ant.design/docs/react/use-with-create-react-app-cn#%E9%AB%98%E7%BA%A7%E9%85%8D%E7%BD%AE下载所需库:yarn add react-app-rewired customize-cra babel-plugin-import修改 package.json 文件 中的 script 结点:"scripts": { ".

2021-04-21 22:53:29 176

原创 react脚手架配置代理总结

大隐隐于市方法一在package.json中追加如下配置"proxy":"http://localhost:5000"说明:优点:配置简单,前端请求资源时可以不加任何前缀。缺点:不能配置多个代理。工作方式:上述方式配置代理,当请求了3000不存在的资源时,那么该请求会转发给5000 (优先匹配前端资源)方法二第一步:创建代理配置文件在src下创建配置文件:src/setupProxy.js编写setupProxy.js配置具体代理规则:const proxy .

2021-04-20 16:13:15 142

原创 拿到一个前端项目不要慌——组件化编码流程(一步一步来)

所有的努力都会得到回报的!!!功能页面的组件化编码流程(通用)1. 拆分组件拆分页面抽取组件2. 实现静态组件使用组件实现静态页面效果3. 实现动态组件(1)动态显示初始化数据数据类型数据名称保存在哪个组件?(2)交互(从绑定事件监听开始)...

2021-04-18 00:28:14 235

原创 react你很懵的生命周期

有竟者事竟成,今天又是努力的一天,加油!加油!加油!!!理解组件从创建到死亡它会经历一些特定的阶段。React组件中包含一系列勾子函数(生命周期回调函数), 会在特定的时刻调用。我们在定义组件时,会在特定的生命周期回调函数中,做特定的工作。生命周期旧初始化阶段: 由ReactDOM.render()触发—初次渲染1.constructor()2.componentWillMount()3.render()4.componentDidMount() ====> 常用一般在这.

2021-04-13 21:45:42 173 3

原创 实现跨域访问

长风破浪会有时,直挂云帆济沧海。————《行路难·其一》李白实现跨域访问跨域访问是什么同源策略1995 年,同源政策由 Netscape(网景) 公司引入浏览器。目前,所有浏览器都实行这个政策。同源政策的目的,是为了保证用户信息的安全,防止恶意的网站窃取数据。随着互联网的发展,“同源政策” 越来越严格。目前,如果非同源,共有三种行为受到限制:Cookie、LocalStorage 和 IndexDB无法读取DOM 无法获得AJAX 请求不能发送虽然这些限制是必要的,但是有时很不方便,.

2021-01-04 16:21:21 208

原创 jQuery中的Ajax

终有一日同风气,扶摇直上九万里,愿你以渺小启程,以伟大结束jQuery中的AjaxjQuery不仅对JavaScript语言进行了封装,也对Ajax异步交互进行了封装。jQuery提供六个Ajax操作的方法:load()方法$.get()方法和$.post()方法$.ajax()方法$.getScript()方法和$.getJSON()方法jQuery还提供了以下几种事件:ajaxStart()和ajaxStop()事件ajaxComplete()事件、ajaxSend()事件.

2021-01-03 18:00:06 155

原创 JSON 数据模式

三十年河东,三十年河西,莫欺少年穷——————《斗破苍穹》JSON 数据模式什么是 JSON官网:http://www.json.org.cn/JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式。它使得人们很容易的进行阅读和编写。同时也方便了机器进行解析和生成。它是基于 JavaScript Programming Language , Standard ECMA-262 3rd Edition - December 1999 的一个子集。 JSON 采.

2021-01-02 10:08:21 316

原创 Node.js 搭建继承服务

我的新年愿望是——————世界和平使用Node.js搭建最简单的服务//Node.js中的http模块const http = require("http");//定义当前服务的IP地址和端口号const hostname = "127.0.0.1"; //表示本机const port = 3000;/* createServer(callback)方法 - 表示创建一个服务 callback - 表示回调函数 function(requert,respon.

2021-01-01 17:00:51 161

原创 Ajax——————XMLHttpRequest对象的属性与方法

不管你学什么专业 找工作一定要找一个你喜欢的 这样你每天早晨六点到晚上八点都是高兴的 再找个喜欢的人在一起 这样晚上八点到早晨六点就是开心的 ——————网易云音乐热评《鱼书》readyState属性与status属性XMLHttpRequest对象的readyState属性作用 - 表示服务器端的通信状态值:0 - 未初始化1 - open()方法被调用2 - send()方法被调用3 - 正在响应4 - 响应已完毕当readyState属性移动位置时值会改.

2020-12-31 18:01:28 307

原创 创建XML HttpRequest对象---需要自取

创建XML HttpRequest对象死方法,创建出来直接调用就行了function createXMLHttpRequest() { var httpRequest; if ((window, XMLHttpRequest)) { //适用于CHrome,Firefox,safari,。。。 httpRequest = new XMLHttpRequest(); } else if (window.ActiveXObject) { // 适用于IE浏览器 t

2020-12-31 18:00:25 253

原创 Ajax实现的步骤

Ajax 实现的步骤实现 Ajax 异步交互需要服务器端逻辑进行配合,而作为客户端的 HTML 页面需要以下步骤:创建 Ajax 的核心对象XML HttpRequest对象通过XML HttpRequest对象的open()方法与服务器端建立联系构建请求所需的数据内容,并通过XML HttpRequest对象的send()方法发送给服务气短通过XML HttpRequest对象对象提供的onreadystatechange事件监听器端的通信状态接收并处理服务器端向客户端响应的数据结果将处理

2020-12-30 17:50:14 215

原创 Ajax是什么----学好Ajax先要理解XMLHttpRequest 对象

会当凌绝顶,一览众山小 ————杜甫Ajax 是什么Ajax 是 Asynchronous JavaScript XML 的缩写,被译为异步 JavaScript 和 XML。Ajax 是用来描述一种使用现有技术集合的“新”方法当使用 Ajax 模型,HTML 页面能够快速地将数据逐步更新显示在用户界面上,不需要重载(刷新)整个页面、JSON 的使用比 XML 更加普遍Ajax 中包含的技术HTML 页面CSS(Cascading Style Sheets)JavaScr.

2020-12-29 09:43:21 230

原创 学习Ajax你要知道的---同步交互与异步交互

同步交互与异步交互交互过程同步交互:客户端向服务器端发送请求,必须等待结果返回,才能向服务器端发送下一次请求异步交互:客户端向服务器端发送请求,不必等待结果返回,就可以向服务器端发送下一次请求异步交互的优劣势相比于同步交互优势:用户操作无需向同步交互必须等待异步交互只需与服务器交换必要的数据内容,而不是将所有数据全部更新异步交互对宽带造成的压力相比同步交互更小通过 Ajax 实现异步交互不需要任何第三方插件,只要浏览器支持 JavaScript 语言即可实现劣势:异步交互

2020-12-04 18:51:12 211

原创 写笔记枯燥无味——那是你还没给Typora设置好看的主题呢

前言Typora是程序猿常用的一个记笔记的软件,一个好的编写环境能够让我们在写笔记的时候更加舒畅。下面是我分享的更改主题的方法效果啊啊啊,这个紫色太好看了吧设置方法一、打开偏好设置二、外观 获取主题三、选择自己喜欢的主题我选择的是那个purple紫色的主题。哈哈,说实话我是冲着那个动画人物去的,不过最后没有,但是那个字体颜色看着也是很好看的四、配置点击下载解压后的文件夹:打开主题文件夹,将下载的主题css样式复制到里面别急最后一步了选择这个主题,你的主题就变了

2020-11-15 23:55:26 823 1

原创 论官方文档API的重要性---学完jQuery的感悟

嘿嘿,在正文开始之前我先分享一哈程序猿的快乐原来快乐真的可以那么简单!!!为什么要使用官方文档jQuery库是基于DOM发展的第三方库,由于是第三方的,所以官方的文档给的内容、方法特别详细。还有一些插件的官方文档也是特别详细的有些官方文档,已经发展的很完善了,里面的css、html都可以拿过来直接使用(比如轮播图的插件,swiper 插件)分享一些官方文档的网址jQuery:jQuery官方文档懒加载插件:...

2020-11-15 00:42:30 241

原创 jQuery中的动画有关的方法

显示与隐藏show() - 显示hide() - 隐藏<div id="box"></div><script> /* 显示与隐藏 1.无动画版本 show() - 显示 hide() - 隐藏 2.有动画版本 - 同时改变宽度和高度 show(speed,callback)

2020-11-14 22:59:14 230

原创 jQuery中的事件与DOM有什么不同呢???

页面加载<button id="btn">按钮</button>DOM 提供了load事件用于页面加载完毕之后执行机制,jQuery 提供了ready()方法实现相似功能。但是 DOM 中的load事件与 jQuery 中的ready()方法具有以下三种区别:DOM 中的load事件:没有任何简写形式当 HTML 页面加载完毕之后触发load事件一个 HTML 页面仅允许存在一个load事件<script> /* wi

2020-11-14 00:51:10 282

原创 jQuery关于DOM操作节点一些方法

查找节点jQuery 查找页面元素 - 并没有参考 DOM 中的 Node 对象,而是 Element 对象text()方法 - 类似于 DOM 中的 textContent 属性获取 - text()设置 - text(textContent)textContent - 表示新的文本内容attr()方法获取 - attr(name) - 类似于 DOM 中的 getAttr(attrName)设置 - attr(name,value) - 类似于 DOM 中的 setAttribu

2020-11-14 00:46:39 593

原创 学完之后发现确实比DOM好使的jQuery库的选择器

选择器选择器是什么jQuery的选择器是用于定位HTML页面中的元素,其用法最初是源于css的选择器用法,但比css更强大DOM中也有类似的用法,querySelector()方法和querySelectorAll()方法就是利用css选择器定位页面元素,jQuery中的选择器性能比DOM中的好基本选择器与css类似ID选择器:根据给定的ID匹配一个元素元素选择器:根据给定的元素名称匹配元素类选择器:根据给定的css类名匹配元素通配符选择器:匹配所有元素组合选择器:将每一个选择器匹配到

2020-11-04 23:44:28 219

原创 jQuery库是什么

jQuery是什么JavaScript类库JavaScript类库简称JS库,**是为了简化JavaScript的开发或者是DOM的操作等。**其中一些JS库也会根据特定的场景封装一系列的操作,例如日期控件等。JavaScript类库会预定义一系列对象和函数,降低开发人员使用JavaScript的难度,**兼容各个浏览器,**提供简单易用的相应的功能。目前,市面上的JavaScript类库数量众多,我们一般会选用生命周期比较久的,或者市场占有率较高的JavaScript类库使用。jQuery是什么

2020-11-04 23:25:52 844

原创 JS面向对象中的严格模式

严格模式严格模式是什么严格模式是JavaScript中的一种限制性更强的变种方式。严格模式不是一个子集:它的语义上与正常代码有着明显的差异。不支持严格模式的浏览器与支持严格模式的浏览器行为上也不一样,所以在未经严格模式特性测试情况下使用严格模式。严格模式可以与严格模式共存,所以脚本可以逐渐的选择性加入严格模式。严格模式的目的首先,严格模式会将JavaScript陷阱直接变成明显的错误。其次,严格模式修正了一些引擎难以优化的错误;同样的代码有些时候严格模式会比严格模式下更快第三,严格模式禁用了

2020-11-01 22:40:22 458

原创 JS面向对象中this关键字

this关键字this是什么this关键字是JavaScript中最复杂的机制之一。它是一个很特殊的关键字,被自动定义在所有函数的作用域中。但是即使是非常有经验的JavaScript开发者也很难说清它到底指向什么。实际上,JavaScript中this的机制并没有那么先进,但是开发者往往会把理解过程复杂化。毫不夸张地说,不理解它的含义,大部分开发任务都无法完成。this都有一个共同点,它总是返回一个对象。简单说,this就是属性或方法“当前”所在的对象。为什么使用thisthis提供了一种更优雅

2020-11-01 22:34:17 590

原创 JS面向对象中的错误与异常

错误与异常什么是错误与异常错误,指程序中的非正常运行状态,在其他编程语言中称为“异常”或“错误”。解释器会为每个错误情形创建并抛出一个Error对象,其中包含错误的描述信息。通过使用JavaScript提供的异常处理语句,可以用结构化的方式来捕捉发生的错误,让异常处理代码与核心业务代码实现分离。错误与异常在应用中的重要性是毋庸置疑的。任何有影响力的Web应用都需要一套完善的错误处理机制。try……catch语句try……catch语句作为JavaScript中处理异常的一种标准方式try标记一

2020-11-01 22:26:09 227

原创 JS面向对象中的继承

继承原型链原型链是什么构造函数或构造器具有prototype属性,对象具有__proto__属性,这就是之前学习的原型如果构造函数或对象A,A的原型指向构造函数或对象B,B的原型再指向构造函数或对象C,以此类推,最终的构造函数或对象的原型指向Object的原型。由此形成一条链状结构,被称之为原型链。按照上述的描述,在B中定义的属性或方法,可以直接在A中使用并不需要定义。这就是继承,它允许每个对象来访问其原型链上的任何属性或方法。原型链是ECMAScript标准中指定的默认实现继承的方式。代码:

2020-10-31 22:24:06 203

原创 JS面向对象中的原型

原型原型是什么在JavaScript中,函数是一个包含属性和方法的Function类型的对象。而原型(Prototype)就是Function类型对象的一个属性。在函数定义时就包含了prototype属性,它的初始值是一个空对象。在JavaScript中并没有定义函数的原型类型,所以原型可以是任何类型。原型是用于保存对象的共享属性和方法的,原型的属性和方法并不会影响函数本身的属性和方法。//Function类型的属性 -> 所有函数都具有的属性console.log(Function.pr

2020-10-31 00:24:49 329

原创 JS面向对象Function类型

Function类型Function类型与函数函数时这样的一段JavaScript代码,它只定义一次,但可能被执行或调用多次Function类型是JavaScript提供的引用类型之一,通过Function类型创建Function对象。在JavaScript中,函数也是以对象的形式存在的。每个函数都是一个Function对象。函数名,本质就是一个变量名,是指向某个Function对象的引用代码://函数声明方式定义function fn(){ console.log('this is

2020-10-28 00:08:48 316

原创 JS面向对象Object类型

Object创建对象//表示创建一个空对象var obj1 = new Object(null);var obj2 = new Object(undefined);//表示创建一个与给定值对应类型的对象var obj3 = new Object(100);console.log(obj3);//[Number: 100]var num = new Number(100);console.log(num);//[Number: 100]//当以非构造函数形式被调用时,Object等同于

2020-10-26 23:57:01 318

原创 JS面向对象的概念与构造函数

什么是面向对象面向对象编程的全称为Object Oriented Programming,简称为OOP。面向对象编程是用抽象方式创建基于现实世界模型的一种编程模式。面向对象编程可以看作是使用一系列对象相互协作的软件设计。面向对象程序设计的目的是在编程中促进更好的灵活性和可维护性。凭借其对模块化的重视,面向对象的代码开发更简单,更容易理解。面向对象编程的三个主要特征是:封装;继承;多态。所有的程序是由一定的属性和行为对象组成的,不同的对象的访问通过函数调用来完成,对象间所有的交流都是通过

2020-10-26 23:49:44 287

原创 DOM系列(一)新手小白的第一篇博客

这是我的第一篇博客,由于有一个月没有学习JS了,DOM的很多东西都完了,这就算是一种复习吧DOM概述什么是DOMDOM(Document Object Model–文档对象模型)是用来呈现以及与任意HTML或XML文档交互的APL。DOM是载入到浏览器中的文档模型,以节点数的形式来表示文档,每个节点代表文档的构成部分(例如:页面元素、字符串或注释等等)D表示Document,就是DOM将HTML页面解释为一个文档。同时提供了Document对象。O表示Object,就是DOM将HTML页面中每

2020-10-22 19:06:17 1228

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除