Ajax介绍和Axios基本使用

article/2025/9/20 19:45:49

Ajax介绍

Ajax本身就是Asynchronous JavaScript And XML的缩写,直译为:异步JavaScriptXML

在实际应用中Ajax指的是:不刷新浏览器窗口,不做页面跳转,局部更新页面内容的技术。

『同步』和『异步』是一对相对的概念,那么什么是同步,什么是异步呢?

1. 同步和异步

1.1. 同步

多个操作按顺序执行,前面的操作没有完成,后面的操作就必须等待。所以同步操作通常是串行的。

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-sftZmFtT-1639187663687)(imgs/image1.png)]

1.2. 异步

多个操作相继开始并发执行,即使开始的先后顺序不同,但是由于它们各自是在自己独立的进程或线程中完成,所以互不干扰谁也不用等谁

2. 服务器渲染和Ajax渲染

2.1. 服务器渲染(整体渲染)

2.2. Ajax渲染(局部渲染)

在这里数据是通过Ajax方式以JSON格式来传递(Ajax渲染),可以实现页面无刷新地更新页面信息。


更多关于Ajax的基础知识参考链接:

原生Ajax:

  • 菜鸟教程原生Ajax介绍和使用

基于JQuery的Ajax:

  • W3school基于JQuery的Ajax介绍和使用
  • Ajax与后台交互的几种方式
  • Jquery ajax全解析
  • Jquery Ajax总结

基于Axios的Ajax:

  • Axios中文官网

与Ajax相关的前置知识博文:

  • 前端传递数据的四种编码格式区别

JSON

什么是JSON?

  • JSON(JavaScript Object Notation,JS对象标记)是一种前后端数据交换格式,其不是一种新的语言!
  • 其采用完全独立于编程语言的文本格式来存储和表示数据!
  • 其具有简洁性和层次性,使得JSON成为理想的数据交换格式!
  • 其易于人阅读和编写,同时也易于机器解析和生成,能有效提升网络传输效率!

JavaScript语言中,一切都是对象。因此,任何JavaScript支持的类型都可以通过JSON来表示,

例如: 字符串, 数字, 对象, 数组等!


Json要求的语法格式?

  • 对象表示为键值对,数据由逗号分割。
  • 花括号【大括号】保存对象
  • 方括号【中括号】保存数组

JSON键值对是用来保存JavaScript对象的一种方式,其和JavaScript对象的写法也大同小异.

键/值对组合中的键名写在前面并用双引号 ""包裹,键值之间用:分隔,然后紧接着值,值也要用""进行包裹!!

示例JSON

{"name":"Carson"}
{"age":"3"}
{"sex":"男"}

JSON和JavaScript对象的关系?

  • JSONJavaScript对象的字符串表示法,它使用文本表示一个JS对象的信息,本质是一个字符串
//这是一个JS对象,注意其键名也是可以使用双引号包裹的就变成了JSON对象
var obj = {a:"hello",b:"world"};
var json = '{"a":"hello","b":"world"}';//这是一个json字符串,本质就是一个字符串

JSON对象和JSON字符串的对比

  • JSON对象是直接可以使用JQuery操作的格式,如C#中可以用对象(类名)点出属性(方法)一样
  • JSON字符串仅仅只是一个字符串,一个整体,不截取的话没办法取出其中存储的数据,不能直接使用

JSON对象:

var str2 = { "name": carson", "sex": "man" };

JSON字符串:

var str1 = '{ "name": "deyuyi", "sex": "man" }';

JSON字符串和JavaScript对象转换

  • 要实现JSON字符串转换为JavaScript对象,使用:JSON.parse()方法

    var obj = JSON.parse('{"a":"hello","b":"world"}');
    //结果是: {a:"hello",b:"world"};
    
  • 要实现从JavaScript对象转换为JSON字符串,使用JSON.stringify()方法

    var json = JSON.stringify({a:"hello",b:"world"});
    //结果是: '{"a":"hello","b":"world"}'
    
  • JSON类是JavaScript中自带的类!


Axios

1. Axios的简介

为什么不使用JQuery框架实现AJax?

  • jQuery操作Dom太频繁,所以少用JQuery。

为什么使用Axios?

  • 使用原生的JavaScript程序执行Ajax极其繁琐,所以一定要使用框架来完成。

  • Vue.js并不包含AJAX的通信功能, 为了解决通信问题, 作者推荐使用Axios框架解决通信问题。

  • 而Axios就是目前最流行的前端Ajax框架。

Axios官网:http://www.axios-js.com/

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-oHyAfvIf-1639189167918)(imgs/image5.png)]

想要使用Axios,需要先有相应的axios库,有两种引用axios库的方式:

  1. 导入对应的js文件: 官方提供的script标签引入方式为:
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
  1. 或者我们也可以把这个axios.min.js文件下载下来保存到本地使用。

2. Axios的基本用法(以Maven示例)

2.1. 在前端页面引入开发环境

  1. 可以直接在web资源包中新建一个static包,并导入axios和vue库在本地使用。
    在这里插入图片描述

​ 接着在相应的html页面中,引入axios和vue库。

<script type="text/javascript" src="/web应用名/static/vue.js"></script>
<script type="text/javascript" src="/web应用名/static/axios.min.js"></script>
  1. 也可以使用script标签+链接方式,直接引入axios库和vue库。

直接在相应的html页面中直接引入:

<!--引入vue和 axios框架-->
<script src="https://cdn.jsdelivr.net/npm/vue@2.5.21/dist/vue.min.js"></script>
<script src="https://unpkg.com/axios/dist/axios.min.js"> </script>

2.2. 发送普通的异步请求(不使用JSON格式)

前端:
前端代码(Vue+axios结合)

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head><!--Axios是一个开源的可以用在浏览器和NodeJS的异步通信框架,-->
<!--其主要作用就是实现Ajax的异步通信--><body><div id="app"><!--@click是vue绑定dom事件的简写形式,对应的属性名是处理dom事件的事件处理函数,这里的函数加不加()都可以--><button @click="commonParam">普通异步请求</button><!--v-text是vue中用于操作纯文本的指令,它会替代显示对应的数据对象上的值。--><span v-text="message"></span></div><!--引入vue和 axios框架--><script src="https://cdn.jsdelivr.net/npm/vue@2.5.21/dist/vue.min.js"></script><script src="https://unpkg.com/axios/dist/axios.min.js"> </script><script>var app = new Vue({el:"#app",data:{"message":""},methods:{commonParam:function () {//使用axios发起异步请求axios({//使用post请求method:"post",//url前面需要加web应用名,这里是axios_servleturl:"/axios_servlet/servletDemo01",//携带普通请求参数//这里是post请求的特殊用法使用了params参数传递,post请求有params参数传递和data参数传递//params是会将请求参数添加到url中且参数以字符串形式进行传参,一般用于get请求(且get请求中只有param选项,不存在data这个选项)。params:{username:"Carson",password:"123456"}}).then(response=>{//then里面是处理请求成功的响应数据//response就是服务器端的响应数据,是json类型的//response里面的data就是响应体的数据this.message = response.data}).catch(error=>{//error是请求失败的错误描述//error.response就是请求失败时候的响应信息console.log(error.response)})}}})</script></body>
</html>

Axios程序接收到的响应数据的对象结构

即响应数据对象response的属性。

属性名作用
config调用axios(config对象)方法时传入的JSON对象
data服务器端返回的响应体数据
headers响应消息头
request原生JavaScript执行Ajax操作时使用的XMLHttpRequest
status响应状态码
statusText响应状态码的说明文本

后端:

pom.xml中加入servlet依赖

<!--servlet依赖--><dependency><groupId>javax.servlet</groupId><artifactId>javax.servlet-api</artifactId><version>4.0.1</version></dependency>

后端servlet代码:

package com.carson.servlet;import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;public class ServletDemo01 extends HttpServlet {@Overrideprotected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {//防止乱码request.setCharacterEncoding("UTF-8");response.setContentType("text/html;charset=UTF-8");//接收请求参数的username和passwordString username = request.getParameter("username");String password = request.getParameter("password");System.out.println("异步接收到的username是:"+username+" password是:"+password);//向浏览器响应数据response.getWriter().write("hello,axios的普通字符串参数的异步请求!!");//测试异常//int num = 10/0;}@Overrideprotected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {doGet(request, response);}
}

配置tomcat和tomcat启动路径:
在这里插入图片描述

web.xml中注册servlet和配置servlet映射路径:

 <!--注册servlet--><servlet><servlet-name>servletDemo01</servlet-name><servlet-class>com.carson.servlet.ServletDemo01</servlet-class></servlet><servlet-mapping><servlet-name>servletDemo01</servlet-name><url-pattern>/servletDemo01</url-pattern></servlet-mapping>

效果:
在这里插入图片描述
可以看到,哪怕我们现在用的是POST请求方式,所有请求参数都被放到URL地址后面了。

正常的话请求参数是位于请求体中的,但这里是Post请求的特殊用法,在使用axios时使用了param参数定义请求参数,即:
在这里插入图片描述

而如果还想保留原来的将请求参数保留在请求体中而不是url中,使用axios时需要使用data选项来定义请求参数即可,即:
在这里插入图片描述

2.3. 发送JSON异步请求(使用JSON格式)

前端
前端代码(vue和axios的结合)

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head><!--Axios是一个开源的可以用在浏览器和NodeJS的异步通信框架,-->
<!--其主要作用就是实现Ajax的异步通信--><body>
<div id="app"><!--@click是vue绑定dom事件的简写形式,对应的属性名是处理dom事件的事件处理函数,这里的函数加不加()都可以--><button @click="sendJsonBody()">Json数据的异步请求</button><!--v-text是vue中用于操作纯文本的指令,它会替代显示对应的数据对象上的值。--><span v-text="message"></span></div><!--引入vue和 axios框架-->
<script src="https://cdn.jsdelivr.net/npm/vue@2.5.21/dist/vue.min.js"></script>
<script src="https://unpkg.com/axios/dist/axios.min.js"> </script><script>var app = new Vue({el:"#app",data:{"message":""},methods:{sendJsonBody:function () {//使用axios发送异步请求,要携带Json请求体的参数axios({//使用post请求method:"post",//url前面需要加web应用名,这里是axios_servleturl:"/axios_servlet/servletDemo02",//携带Json请求体参数//data是将请求参数添加到请求体(body)中且参数以json格式传参,用于post请求。data:{userName:"Carson",userPwd:"88888888"}}).then(response=>{this.message = response.data}).catch(error=>{//error是请求失败的错误描述//error.response就是请求失败时候的响应信息console.log(error.response)})}}})
</script></body>
</html>

后端:

1.pom.xml加入GSON依赖。

Gson是Google研发的一款非常优秀的JSON数据解析和生成工具,它可以帮助我们将数据在JSON字符串和Java对象之间互相转换。

<!-- 谷歌的json解析和生成依赖 --><dependency><groupId>com.google.code.gson</groupId><artifactId>gson</artifactId><version>2.2.4</version></dependency>

使用maven为开发环境时,由于GSON依赖的特殊性,即使pom.xml中已经配置了GSON依赖,但是在tomcat的lib目录中也要加入GSON依赖,否则启动tomcat时会找不到这个依赖:
在这里插入图片描述

2.测试用的实体类User.java

package com.carson.pojo;public class User {private String userName;private String userPwd;public User() {}public User(String userName, String userPwd) {this.userName = userName;this.userPwd = userPwd;}public String getUserName() {return userName;}public void setUserName(String userName) {this.userName = userName;}public String getUserPwd() {return userPwd;}public void setUserPwd(String userPwd) {this.userPwd = userPwd;}@Overridepublic String toString() {return "User{" +"userName='" + userName + '\'' +", userPwd='" + userPwd + '\'' +'}';}
}

3:后端servlet代码:

package com.carson.servlet;import com.carson.pojo.User;
import com.google.gson.Gson;import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.BufferedReader;
import java.io.IOException;public class ServletDemo02 extends HttpServlet {@Overrideprotected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {try{//防止乱码request.setCharacterEncoding("UTF-8");response.setContentType("text/html;charset=UTF-8");//我们要获取json请求体的参数,其实就是将json请求体的参数封装到User对象中//1. 获取Json请求体的内容(获取请求体的参数需要使用getReader()方法,其是对getInputStream()方法的二次封装,便于读取字符)BufferedReader requestReader = request.getReader();//2. 从requestReader中循环读取拼接字符串StringBuilder stringBuilder = new StringBuilder();String buffer = "";while((buffer=requestReader.readLine())!=null){stringBuilder.append(buffer);}//3. 将stringBuilder转成String字符串,这个字符串就是Json请求体String jsonBody = stringBuilder.toString();//4. 将jsonBody通过Gson解析转成User对象Gson gson = new Gson();User user = gson.fromJson(jsonBody,User.class);System.out.println("user是:"+user);System.out.println("客户端传入的参数userName的值为:" + user.getUserName() + ",传入的userPwd的值为:" + user.getUserPwd());//在实际开发中服务器端向客户端响应的99%都会是Json字符串User responseUser = new User("Jay Chow","ggggggg");//将responseUser转成json字符串String responseJson = gson.toJson(responseUser);//向浏览器响应数据response.getWriter().write(responseJson);}catch (Exception e){e.printStackTrace();}}@Overrideprotected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {doGet(request,response);}
}

3: tomcat的启动路径不变,这里仍然为上面配置的: /axios_servlet.

4: web.xml中注册servlet和配置servlet映射路径:

<servlet><servlet-name>servletDemo02</servlet-name><servlet-class>com.carson.servlet.ServletDemo02</servlet-class>
</servlet>
<servlet-mapping><servlet-name>servletDemo02</servlet-name><url-pattern>/servletDemo02</url-pattern>
</servlet-mapping>

效果:

可以看到,由于使用axios时使用data选项定义请求参数:
在这里插入图片描述
请求参数不再位于url中,而是位于请求体中。
在这里插入图片描述
在这里插入图片描述

3. . 封装Json工具类简化Axios异步交互

3.1. jackson的使用介绍

3.1.1. jackson的简介

jackson是Java中比较常用的JSON解析的工具包,SpringMVCSpringBoot中默认支持的就是jackson.

Jackson应该是目前比较好的json解析工具了, 当然工具不止这一个,比如还有阿里巴巴的 fastjson 等等

3.1.2. jackson的使用

第一步: 引入jar包

pom.xml中加入依赖:

<!-- https://mvnrepository.com/artifact/com.fasterxml.jackson.core/jackson-annotations -->
<dependency><groupId>com.fasterxml.jackson.core</groupId><artifactId>jackson-annotations</artifactId><version>2.9.8</version>
</dependency>
<!-- https://mvnrepository.com/artifact/com.fasterxml.jackson.core/jackson-core -->
<dependency><groupId>com.fasterxml.jackson.core</groupId><artifactId>jackson-core</artifactId><version>2.9.8</version>
</dependency>
<!-- https://mvnrepository.com/artifact/com.fasterxml.jackson.core/jackson-databind -->
<dependency><groupId>com.fasterxml.jackson.core</groupId><artifactId>jackson-databind</artifactId><version>2.9.8</version>
</dependency>

同样,由于这几个依赖的特殊性,也需要在tomcat的lib目录中加入。
在这里插入图片描述
在这里插入图片描述

第二步: API介绍
  1. 创建ObjectMapper对象 ObjectMapper objectMapper = new ObjectMapper();

  2. 调用objectMapper.writeValueAsString(obj)方法将java对象转成json字符串

  3. 调用objectMapper.readValue(text, Class);将json字符串转成java对象

  4. json数组转成List<Bean>

    //1.创建ObjectMapper对象
    ObjectMapper objectMapper = new ObjectMapper();//2.调用readValue()
    TypeReference<List<Bean>> ref = new TypeReference<List<Bean>>(){};
    List<Bean> list = objectMapper.readValue(jsonStr, ref);
    

3.2. 封装Json工具类用于获取json格式的请求参数以及向客户端响应json字符串

3.2.1. JsonUtils工具类

package com.carson.utils;import com.fasterxml.jackson.databind.ObjectMapper;import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.BufferedReader;public class JsonUtils {/*** 获取Json请求体的参数,并且返回封装了参数的JavaBean对象* @param request* @param clazz* @return*/public static Object parseJsonToBean(HttpServletRequest request, Class clazz){try {BufferedReader reader = request.getReader();StringBuffer stringBuffer = new StringBuffer("");String line = "";while ((line=reader.readLine()) != null){stringBuffer.append(line);}//此时拿到的还只是那个Json字符串String jsonBody = stringBuffer.toString();//我们还需要从Json字符串中解析出每一个key对应的值//其实就是将Json字符串转换成JavaBean对象,然后Json字符串中的数据就存储到了JavaBean对象中,然后就能从JavaBean对象中获取数据//使用jacksonreturn new ObjectMapper().readValue(jsonBody, clazz);} catch (Exception e) {e.printStackTrace();throw new RuntimeException(e.getMessage());}}/*** 将对象转成Json字符串响应给前端* @param response* @param object*/public static void parseObjectToJson(HttpServletResponse response, Object object){try {//将对象转成Json字符串String jsonStr = new ObjectMapper().writeValueAsString(object);//再将Json字符串响应给前端response.getWriter().write(jsonStr);} catch (Exception e) {e.printStackTrace();throw new RuntimeException(e.getMessage());}}
}

3.2.2. 利用JsonUtils获取json格式的请求参数以及向客户端响应json字符串

前端:
前端代码:(vue和axios的结合)

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head><!--Axios是一个开源的可以用在浏览器和NodeJS的异步通信框架,-->
<!--其主要作用就是实现Ajax的异步通信--><body>
<div id="app"><button @click="sendJsonBody()">使用JsonUtils的异步请求</button><span v-text="message"></span></div><!--引入vue和 axios框架-->
<script src="https://cdn.jsdelivr.net/npm/vue@2.5.21/dist/vue.min.js"></script>
<script src="https://unpkg.com/axios/dist/axios.min.js"> </script><script>var vue = new Vue({el:"#app",data:{"message":""},methods:{sendJsonBody(){//使用axios发送异步请求,要携带Json请求体的参数axios({method:"post",url:"/axios_servlet/servletDemo03",//携带Json请求体参数data:{"userName":"aobama","userPwd":"999999"}}).then(response => {console.log(response.data.resultFlag)console.log(response.data.resultData)console.log(response.data.msg)this.message = response.data.resultData})}}})
</script>
</body>
</html>

后端
后端servlet代码:

package com.carson.servlet;import com.carson.pojo.User;
import com.carson.utils.JsonUtils;import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.util.HashMap;
import java.util.Map;public class ServletDemo03 extends HttpServlet {@Overrideprotected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {try {//防止乱码request.setCharacterEncoding("UTF-8");response.setContentType("text/html;charset=UTF-8");//获取Json请求体的参数,并且封装到User对象中User user = (User) JsonUtils.parseJsonToBean(request, User.class);System.out.println("userName=" + user.getUserName() + ", userPwd=" + user.getUserPwd());//封装需要响应给客户端的数据Map responseMap = new HashMap();responseMap.put("resultFlag", true);responseMap.put("resultData","hello from ServletDemo03!");responseMap.put("msg", "hello world!");//将响应数据转为Json,并向浏览器响应数据JsonUtils.parseObjectToJson(response, responseMap);} catch (Exception e) {e.printStackTrace();}}@Overrideprotected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {doGet(request, response);}
}

tomcat的启动路径不变,这里仍然为上面配置的: /axios_servlet.

web.xml中注册servlet和配置servlet映射路径:

<servlet><servlet-name>servletDemo03</servlet-name>
<servlet-class>com.carson.servlet.ServletDemo03</servlet-class></servlet>
<servlet-mapping><servlet-name>servletDemo03</servlet-name><url-pattern>/servletDemo03</url-pattern>
</servlet-mapping>

效果:
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述


创作不易!!欢迎关注个人公众号!!获取更多知识内容!!

在这里插入图片描述


http://chatgpt.dhexx.cn/article/ytPWOy1L.shtml

相关文章

Axios使用详解

文章目录 一、Promise的使用1. 基本语法2. Promise三种状态3. Promise链式调用1. 基本写法2. 使用静态方法3. 直接返回 4. Promise.all5. Promise.race 二、Axios使用1. 安装并引入2. 发送请求3. config配置4. 响应结构5. 并发请求6. 全局配置6. 创建实例7. 实例方法8. 拦截器请…

Uncaught (in promise) Error: Network Error at e.exports (axios.js:8:6410) at d.onerror (axio

axios报错&#xff1a; 原因&#xff1a; 后端没有给跨域权限&#xff0c;后端需要设置允许跨域的响应头&#xff0c;即可解决。 解决&#xff1a; node端设置响应头&#xff0c;解决跨域问题 。

axios封装

不要过度封装&#xff01;封装一个最简单的Axios&#xff01; - 掘金 (juejin.cn) 1 初始化 axios 实例 通过 create 方法我们得到了一个 axios 的实例&#xff0c;该实例上有很多方法&#xff0c;比如拦截器等等。我们创建实例的时候可以配置一些基础设置&#xff0c;比如基础…

axios学习

文章目录 前言一、axios的理解和使用axios的特点axios的安装方式axios的基本配置 二、axios的基本使用1.axios四种常用请求方式2.四种方式的基本使用基本架构代码示例&#xff1a;1. GET请求2. POST请求3. PUT请求4. DELETE请求 3.axios的别名方式请求使用 前言 axios是一个基…

vue封装axios

(4条消息) Vue——axios的二次封装_前端杂货铺的博客-CSDN博客 1.下载axios依赖包 npm install axios2.在src目录下新建utils文件夹&#xff0c;在utils文件夹下新建request.js文件 3.request.js import axios from axios import { Message, MessageBox } from element-ui …

axios

SegmentFault 头条问答专栏讲堂职位活动 消息注册 登录 home javascriptphppythonjavamysqliosandroidnode.jshtml5linuxccss3gitgolangrubyvimdockermongodb 文 axios 中文文档 翻译 axiosjavascript farmerz 2月24日发布 2 推荐 45 收藏&#xff0c;3.2k 浏览 axios 版…

Axios介绍

Axios是专注于网络数据请求的库&#xff0c;相比于XMLHttpRequest对象。axios简单易用&#xff0c;相比于jQuery&#xff0c;axios更加轻量化&#xff0c;只专注于网络数据请求 引入外部js文件 <script src"https://unpkg.com/axios/dist/axios.min.js"><…

VUE的axios的详细介绍和用法

Vue中发送网络请求有非常多的方式, 那么, 在开发中, 我们该如何选择呢? 选择一: 传统的Ajax是基于XMLHttpRequest(XHR) 为什么不用它呢? 非常好解释, 配置和调用方式等非常混乱.编码起来看起来就非常蛋疼. 所以真实开发中很少直接使用, 而是使用jQuery-Ajax 选择二: 在前…

AJAX,Axio异步框架(对原生AJAX封装)。web分区

1.Ajax的理解 以前服务器里的数据&#xff0c;都是存在Servlet域里&#xff0c;然后发给JSP&#xff0c;来进行显示。 有了AJAX&#xff0c;可以和服务器通信。不需要JSP作页面。 可以在Servlet把数据发给浏览器&#xff0c;然后在HTML页面显示。 1.1 以前的方法 1.2 现在的方…

类方法和对象方法的区别

类方法和对象方法 1.类方法属于本类的方法&#xff0c;不会因创建对象的不同而改变&#xff0c;类方法随着类的字节码文件加载而加载&#xff1b; 2.对象方法属于当前类创建的某个对象&#xff0c;会随着创建对象的不同而改变。如下图所示代码&#xff1a;

python中什么叫类、什么叫对象_Python中的类和对象是什么

一、面向过程和面向对象 面向过程:根据业务逻辑从上到下写代码。 面向对象:将数据与函数绑定到一起,进行封装,这样能够更快速的开发程序,减少了重复代码的重写过程。 二、类和对象 1、类的概念 面向对象编程的2个非常重要的概念:类和对象是面向对象编程的核心。 在使用对…

类与对象的区别?

对于初学者来说&#xff0c;类与对象之间的关系的非常模糊不清的&#xff0c;在这里跟大家分享一下&#xff0c;让初学者有所帮助。 一、类的概念&#xff1a; 类是具有相同属性和服务的一组对象的集合。它为属于该类的所有对象提供了统一的抽象描述&#xff0c;其内部包括属性…

Java类和对象 详解(一)

一、面向对象简述 面向对象是一种现在最为流行的程序设计方法&#xff0c;几乎现在的所有应用都以面向对象为主了&#xff0c;最早的面向对象的概念实际上是由IBM提出的&#xff0c;在70年代的Smaltalk语言之中进行了应用&#xff0c;后来根据面向对象的设计思路&#xff0c;才…

C++类和对象详细总结

目录 目录 类与对象概念 什么是对象 什么是类 什么是方法&#xff1a; 自定义类型&#xff08;类的关键字&#xff1a;class&#xff09; 定义类的格式 封装 类的特性 访问权限以及访问限定符 struct 定义的类和class定义的类的区别&#xff1a; 小结 对象中包含了…

C++类和对象详解

类与对象上篇&#xff1a; 主要内容&#xff1a; 1.类和对象的区别。 2.类的定义。 3.类的访问限定符和封装 4.类的作用域 5.类的实例化&#xff08;用类类型创建对象&#xff09; 6.计算类对象的大小 7.this指针 C语言是面向过程的&#xff0c;关注的是过程&#xff0c;分析…

面向过程和面向对象区别

&#xff08;1&#xff09;从设计思路来看。 面向过程&#xff1a;程序设计的重点是分析解决问题的步骤&#xff0c;以及完成步骤的流程&#xff0c;是一种结构化自上而下的程序设计方法。面向对象&#xff1a;程序设计的重点是把构成问题的事物分解成对象&#xff0c;从局部着…

Java基础——类和对象

目录 一、类和对象的基本概念 二、类与对象的定义与使用 1.创建类的语法&#xff1a; 2. 创建具体的对象&#xff1a; 3.范例&#xff08;创建一个Person 类的对象&#xff09; 三、static关键字 &#xff08;一&#xff09;static修饰属性&#xff08;类属性、类变量&a…

类,对象,方法与函数的区别

面向对象&#xff08;Object oriented Programming&#xff0c;OOP)编程 的思想主要是针对大型软件设计而来的。面向对象编程将数据和操作数据相关的方法封装到对象中&#xff0c;组织代码和数据的方式更加接近人的思维&#xff0c;使程序的扩展性更强、可读性更好&#xff0c;…

C++的类和对象

目录 C面向对象的三大特性&#xff1a;封装、继承、多态 封装 构造函数和析构函数 构造函数的分类与调用 深拷贝与浅拷贝 类对象作为类成员 静态成员 成员变量和成员函数是分开存储的 const修饰成员函数 友元 运算符重载 继承 多态 C面向对象的三大特性&#xff1…

java实例和对象对象的区别_java中实例与对象的区别和联系

对象是抽象的说法&#xff0c;你可以把它看作一个符合它自身定义的所有实例的代表&#xff0c;而实例则是对象的现实体现。 你可以说一个实例是一个对象&#xff0c;但你不能说一个对象是一个实例。因为定义对象时只是把自身的规则和逻辑定义好&#xff0c;实例可以通过输入不同…