来点基础的吧,JavaScript、JSP怎么打印输出,方便调试

这个对初学者肯定有用,自己写了代码,想看看对不对,想打印到页面上看看,都有哪些地方需要打印用哪些方法呢?

一、JavaScript的打印输出

1、console.log()

console.log()是JavaScript中最常用的打印值方法之一。它将指定的值打印到浏览器的控制台。这对于开发人员来说非常有用,因为它可以帮助我们查看变量的值以及程序中的错误。

        	<script type="text/javascript"> 
        	let name="James";
        	let age=40;
        	console.log(name + age);
        	</script>

这个是在浏览器的控制台输出,如下所示:

2、alert()

 它会在浏览器中弹出一个对话框,显示指定的值。这对于在调试过程中查看变量值非常有用,特别是在代码无法访问控制台的情况下

        	<script type="text/javascript"> 
        	let name="James";
        	let age=40;
        	alert(name + age);
        	</script>

运行结果如下:

3、document.write()

document.write()方法将指定的值写入到HTML文档中。这对于快速测试和调试JavaScript代码非常有用。Document对象是JavaScript中代表整个HTML或XML文档的根节点,它是浏览器中内置的一个对象。

        	<script type="text/javascript"> 
        	let name="James";
        	let age=40;
        	document.write(name + age);
        	</script>

运行结果如下所示:

4、debugger

debugger是JavaScript中一个强大的调试工具,可以让你在代码中设置断点,并逐步执行代码。在断点处,你可以查看变量的值以及程序的执行情况。

        	<script type="text/javascript"> 
        	let name="James";
        	let age=40;
        	debugger;
        	document.write(name + ":" + age);
        	</script>

5、JSON.stringify()

JSON.stringify()方法将JavaScript对象转换为一个JSON字符串。这对于查看对象的内容非常有用,尤其是嵌套对象或数组的情况。

<script type="text/javascript">
let person = {
  name: "James",
  age: 40,
  address: {
    street: "123 Main St",
    city: "New York"
  }
};
console.log(JSON.stringify(person));
</script>

二、JSP中的打印输出

1、控制台(后台)输出

这个是指在tomcat控制台,在后端输出,在部署后是tomcat的控制台输出的信息,在调试的时候是在IDE的控制台输出的信息。如下:

这个时候用的是System.out.print()/println();

2、客户端(前台)输出

在这需要注意的就是两个方法,out.print/println和System.out.print/println,的区别。

System.out.println()用的是标准输出流,这个是输出在控制台上的,而JSP不是控制台程序。不管是在JSP还是在JAVA程序中,System.out.println()都是打印在控制台上。
out.println()中,out是response的实例,是以response为对象进行流输出的,即将内容输出到客户端

前面的文章提到jsp的9大内置对象就有out,out对象是jsp的内置对象,所以可以直接使用。
system.out.print是在java代码中实现,输出在控制台。
out.print是在jsp代码中实现,输出在页面,out其实是PrintWrite类的实例。

除了out.print()/println()以外,JSP中要想在前端页面打印显示输出,还有如下几种方法:

假设我们在jsp中定义了具备变量name,<%String name=“James”;%>,那么我们可以通过下面的方法输出到页面上。

<%=name%>

<%out.write(name);%>

<%response.getWriter().write(name);%>

2.1、JSP out.print()和out.write()的区别

JSP中out.print()和out.write()方法都属于抽象类Writer的抽象子类JspWriter的方法;其中out.print()方法属于抽象子类JspWriter中的方法,而out.write()是父类Writer的方法.

区别:

1. print方法是子类JspWriter,write是Writer类中定义的方法;

2. 重载的print方法可将各种类型的数据转换成字符串的形式输出,而重载的write方法只能输出字符、字符数组和字符串等与字符相关的数据;

3. JspWriter类型的out对象使用print方法和write方法都可以输出字符串,但是,如果字符串对象的值为null时,print方法将输出内容为“null”的字符串,而write方法则是抛出NullPointerException异常。

2.2、out.print()和后台response.getWriter().print()

① 这两个对象的类型是完全不同的
内置对象out的类型是JspWriter;response.getWrite()返回的类型是PrintWriter。
② 获取方式不同
JspWriter是JSP的内置对象,直接使用即可,对象名out是保留字,也只能通过out来调用其相关方法。此外还可以通过内置对象pageContext.getOut();获得。PrintWriter则是在用的时候需要通过内置对象response.getWriter()获得。
③ JspWriter的print()方法会抛出IOException而PrintWriter则不会。
④ JspWriter和PrintWriter都继承自Java.io.Writer,但JspWriter是抽象类,而PrintWriter不是抽象类。

三、总结

列了这么多方法,其实就是为了在调试的时候方便,稍微总结一下就是你想看你写的程序的变量执行时的值是多少,那么可以先分清楚是前端还是后端的,是java、jsp还是javascript,如果javascript那就用我们一中列的哪些方法查看就完了,如果是java或者jsp的,那就看是想在前面看还是在后面看,如果是在前台看就用我们2中列的前台看的方法,如果是要在控制台看就用system.out.print/println来打印输出查看。

参考资料:

https://blog.51cto.com/u_16175451/6659217

https://www.cnblogs.com/chendezhen/p/9173222.html

https://blog.csdn.net/qq_51965854/article/details/119112150

http://www.51gjie.com/javaweb/821.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/443011.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

React-router之简单使用

1.概念 说明&#xff1a;页面的跳转 2.安装 说明&#xff1a;路由采用CRA创建项目的方式进行基础环境配置。 npx create-react-app react-router-pro npm i react-router-dom 3.使用 import React from react; import ReactDOM from react-dom/client; import ./index.css;…

嵌入式学习第二十五天!(网络的概念、UDP编程)

网络&#xff1a; 可以用来&#xff1a;数据传输、数据共享 1. 网络协议模型&#xff1a; 1. OSI协议模型&#xff1a; 应用层实际收发的数据表示层发送的数据是否加密会话层是否建立会话连接传输层数据传输的方式&#xff08;数据包&#xff0c;流式&#xff09;网络层数据的…

C#学习:初识各类应用程序

编写我们第一个程序——Hello,World! 1.编程不是“学”出来的&#xff0c;而是“练”出来的 2.在反复应用中积累&#xff0c;忽然有一天就会顿悟 3.学习原则&#xff1a; 3.1从感官到原理 3.2从使用别人的到创建自己的 3.3必需亲自动手 3.4必需学以致用&#xff0c;紧跟实际…

大模型思维链(CoT prompting)

思维链&#xff08;Chain of Thought&#xff0c;CoT&#xff09; **CoT 提示过程是一种大模型提示方法&#xff0c;它鼓励大语言模型解释其推理过程。**思维链的主要思想是通过向大语言模型展示一些少量的 exapmles&#xff0c;在样例中解释推理过程&#xff0c;大语言模型在…

HTML 学习笔记(七)列表

html中的列表分为以下三种&#xff1a;有序列表&#xff0c;无序列表和自定义列表 1.有序列表 有序列表由两个元素组成&#xff1a;元素ol和元素li&#xff0c;此两个元素是父子关系&#xff0c;li必须包裹在ol里使用&#xff0c; ol里直接嵌套的只有li&#xff0c;其嵌套效果…

【亲身经历】linux中使用mv命令之后,文件找不到

先说解决方案&#xff1a;移动过程的目的目录&#xff0c;使用了"/",这个斜杠标识加到目录名前面&#xff0c;表示会移动到根目录下的文件夹&#xff0c;而不是你想移动的那个文件夹&#xff0c;最后导致没找到。 某次升级tomcat的过程中&#xff0c;使用了mv移动文…

ky10 server 银河麒麟服务器主备搭建 (nginx+keepalived)

下载脚本代码 git clone https://gitcode.net/zengliguang/nginx_keepalived_ky10_x.git 进入脚本路径 更新脚本代码 更新完成 执行安装脚本 安装nginx离线编译安装依赖 解压nginx源码 检查环境 编译 nginx安装成功 安装keepalived keepalived安装成功

详解前端登录流程:实现原理与最佳实践

&#x1f90d; 前端开发工程师、技术日更博主、已过CET6 &#x1f368; 阿珊和她的猫_CSDN博客专家、23年度博客之星前端领域TOP1 &#x1f560; 牛客高级专题作者、打造专栏《前端面试必备》 、《2024面试高频手撕题》 &#x1f35a; 蓝桥云课签约作者、上架课程《Vue.js 和 E…

Mysql安装好后my.ini文件在何处

文章目录 报错 Invalid default value for ‘‘begin_time‘‘my.ini文件何在 背景&#xff1a;导入一个sql脚本时执行报错&#xff0c;需要修改my.ini中的一个配置 报错 Invalid default value for ‘‘begin_time‘‘ 需要修改my.ini中的slq-mode配置 参考的这个哥们博客配…

unityplayer.dll是什么,电脑缺少unityplayer.dll的解决方法分享

如何解决“缺失unityplayer.dll”错误&#xff1f;当您尝试启动一个应用程序或游戏时&#xff0c;您可能会看到一个错误消息&#xff0c;显示“找不到unityplayer.dll”或unityplayer.dll丢失。这通常是因为Unity引擎未正确安装或文件已丢失或损坏。这篇文章将向您介绍如何解决…

Redis进阶--一篇文章带你走出Redis

目录 什么是Redis?? Redis有哪些使用场景? Redis是单线程还是多线程? 为什么Redis是单线程速度还是很快?? Redis持久化 RDB机制:(Redis DataBase) [是redis中默认的持久化方式] AOF机制:(Append Only File) Redis和MySQL如何保持数据一致????…

Unity中PICO实现 隔空取物 和 接触抓取物体

文章目录 前言一、隔空取物1、XR Grab Interactable2、调节扔出去时的相关系数3、用手柄射线指向需要抓取的物体后&#xff0c;按下侧边扳机键即可抓取 二、接触抓取物体1、替换手柄上抓取物体的脚本2、在手柄上添加 接触抓取物体的脚本3、在手柄上添加碰撞盒触发器4、在需要抓…

BUUCTF-Misc6

数据包中的线索1 1.打开附件 发现是一个流量包 2.Wireshark 用Wireshark打开 右键属性&#xff0c;追踪tcp流&#xff0c;发现base64编码 3.base64转图片 将base64编码保存为文本文档 Python脚本 import os,base64 with open("/root/桌面/3/1.txt","r"…

安全防御-第七次

在FW5和FW6之间建立一条IPSEC通道保证10.0.2.0/24网段可以正常访问到192.168.1.0/24 NAT&#xff1a; 安全策略&#xff1a; NAT: 安全策略&#xff1a; 修改服务器映射&#xff1a; 配置IPSEC&#xff1a;

SMT32 TIM1 PWM(发送固定脉冲数)步进电机梯形图加速

&#xff08;因为电机的启停惯性和步进电机越慢扭力越大的原因&#xff09;&#xff1b;所以步进电机使用梯形加速&#xff0c;可以实现更小的丢步 思路&#xff1a;在PWM中断中做计数&#xff0c;前20个脉冲和后20个脉冲频率设置一样低&#xff0c;中间的脉冲频率设置快一点

探索数据可视化:Matplotlib 基础指南

图形绘制 import numpy as np import pandas as pd import matplotlib.pyplot as pltx np.linspace(0,2 * np.pi,100)# 说明&#xff1a;正弦波。x&#xff1a;NumPy数组 # 所有的数据&#xff0c;进行正弦计算 y np.sin(x)plt.plot(x,y)# 指定x轴范围 plt.xlim(-1,10) # 指…

深入了解304缓存原理:提升网站性能与加载速度

&#x1f90d; 前端开发工程师、技术日更博主、已过CET6 &#x1f368; 阿珊和她的猫_CSDN博客专家、23年度博客之星前端领域TOP1 &#x1f560; 牛客高级专题作者、打造专栏《前端面试必备》 、《2024面试高频手撕题》 &#x1f35a; 蓝桥云课签约作者、上架课程《Vue.js 和 E…

React改变数据【案例】

State传统方式 <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-width, initial-scale1.0"><title>React Demo</title> <!--…

go语言添加代理

LiteIDE 工具->管理 https://mirrors.aliyun.com/goproxy/或https://goproxy.cn,direct 命令行 go env -w GOPROXYhttps://goproxy.cn,direct

设计模式-行为型设计模式-命令模式

命令模式&#xff08;Command&#xff09;&#xff0c;将一个请求封装为一个对象&#xff0c;从而使你可用不同的请求对客户进行参数化&#xff1b;对请求排队或记录请求日志&#xff0c;以及支持可撤销的操作。[DP] // 命令接口 interface Command {void execute(); }// 具体命…