首页 > 编程语言 >JavaScript学习笔记(1)

JavaScript学习笔记(1)

时间:2025-01-21 21:28:02浏览次数:3  
标签:运算符 JavaScript 数据类型 笔记 JS 学习 write document 赋值

html 完成了架子, css 做了美化,但是网页是死的,我们需要给他注入灵魂,所以接下来我们需要学习 JavaScript,这门语言会让我们的页面能够和用户进行交互。

一、引入方式

1.内部脚本

将 JS 代码定义在 HTML 页面中 JavaScript 代码必须位于 <script></script> 标签之间 在 HTML 文档中,可以在任意地方,放置任意数量的 <script> 一般会把脚本置于 <body> 元素的底部,可改善显示速度
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        alert("hello world");
    </script>
</body>
</html>

2.外部脚本

JS 代码定义在外部 JS 文件中,然后引入到 HTML 页面中 外部 JS 文件中,只包含 JS 代码,不包含 <script> 标签 引入外部 js 的 <script> 标签,必须是双标签
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!-- <script>
        alert("hello world");
    </script> -->
    <script src="js/demo.js"></script>
</body>
</html>

二、输出语句

1.警告框

alert('This is an alert message.');

2.在HTML 输出内容

document.write('This is some text written to the document.');

3.写入浏览器控制台

console.log('Hello, World!');
API功能描述
window.alert()弹出一个带有指定消息的警告框,用户需点击“确定”关闭,用于向用户显示简单提示信息
document.write()在HTML文档中输出内容,注意在文档加载后使用可能会覆盖整个页面内容
console.log()将内容写入浏览器控制台,可输出多种数据类型,如字符串、数字、对象、数组等

三、变量

在JavaScript中,可以使用varletconst关键字来声明变量。

特性varletconst
作用域函数级或全局级块级块级
变量提升有,可在声明前使用(值为undefined)无,在声明前使用报错无,在声明前使用报错
重复声明允许不允许,同一作用域内重复声明报错不允许,同一作用域内重复声明报错
重新赋值可以可以不可以(对于基本数据类型),复杂数据类型(如对象、数组)可修改内部属性或元素

四、数据类型

数据类型描述
number包含整数、小数以及特殊值NaN(Not a Number)
string字符串,可以使用单引号或双引号括起来
boolean仅有两个值,true或者false
null表示对象为空
undefined当变量声明但未初始化时的默认值
<script>
        document.write(typeof 10+"<br>");
        document.write(typeof "10"+ "<br>");
        document.write(typeof true+ "<br>");
        document.write(typeof null+ "<br>");
        document.write(typeof a+ "<br>");


    </script>

五、运算符

运算规则运算符描述
算术运算符+, -, *, /, %, ++, --+:加法运算;-:减法运算;*:乘法运算;/:除法运算;%:取模(余数)运算;++:自增1;--:自减1
赋值运算符=, +=, -=, *=, /=, %==:简单赋值;+=:加后赋值;-=:减后赋值;*=:乘后赋值;/=:除后赋值;%=:取模后赋值
比较运算符>, <, >=, <=,!=, ==, ===>:大于;<:小于;>=:大于等于;<=:小于等于;!=:不等于(不严格比较,会进行类型转换);==:等于(不严格比较,会进行类型转换);===:全等(严格比较,不会进行类型转换)
逻辑运算符&&,|| , !
三元运算符条件表达式? true_value : false_value根据条件表达式的结果返回true_value或者false_value
在 js 中,绝大多数的运算规则和 java 中是保持一致的,但是 js 中的 == 和 === 是有区别的。 == :只比较值是否相等,不区分数据类型,哪怕类型不一致, == 也会自动转换类型进行值得比较 === :不光比较值,还要比较类型,如果类型不一致,直接返回 false

标签:运算符,JavaScript,数据类型,笔记,JS,学习,write,document,赋值
From: https://blog.csdn.net/m0_74370400/article/details/145270429

相关文章

  • 神级STL结构-rope大法(学习笔记)
    简介:他是一个\(STL\)中自带的一种数据结构,是pb_ds(Policy-BasedDataStructures)库的一个分支,由于他的底层是可持久化平衡树——红黑树,或块状链表。所以他的操作的复杂度几乎约等于\(O(logn)\)或\(\sqrtn\)。它可支持操作较多,完全可以理解成加强版的\(vector\)。最为抽......
  • MySQL基础知识学习指南
    一、MySQL-DDL(DataDefinitionLanguage)在数据库管理领域,MySQL是广泛应用的关系型数据库管理系统。其中,数据定义语言(DataDefinitionLanguage,简称DDL)起着至关重要的作用,它主要用于对数据库内部对象进行创建、删除、修改等操作。本文将深入且系统地介绍MySQL中的DDL相关......
  • 【超详细】深度学习三杰:CNN、RNN、GNN 全面对比与应用场景详解
    以下是一篇尽可能全面而详尽的博客,围绕卷积神经网络(CNN)、循环神经网络(RNN)、图神经网络(GNN)三大常见深度学习模型进行对比。希望兼顾深度与易读性,同时通过适当的关键词优化来吸引更多流量。深度学习三杰:CNN、RNN、GNN全面对比与应用场景详解导语:在深度学习领域,神经网络种......
  • Redis数据库笔记——ZSet的底层实现(跳表)
    大家好,这里是GoodNote,关注公主号:Goodnote,专栏文章私信限时Free。本文详细介绍ZSet数据类型中跳表的底层实现,包括基本特点和常用操作。文章目录ZSet(有序集合)概述基本特点底层实现Skiplist跳表概述结构跳表的基本操作1.查找操作:`Search`2.插入操作:`Insert`3.删......
  • 爬虫学习笔记
    ------------------------------------------------------------------------------------------------------------------------谷歌浏览器的开发者工具(DevTools)中,搜索功能允许你查找HTML、CSS、文本内容等内容,具体操作步骤如下:1.打开开发者工具快捷键:Windows/Linux:Ct......
  • [超表面论文快讯-34] Light: Science & Applications-电磁超材料强化学习智能体-北京
    栏目介绍:“论文快讯”栏目旨在精简地分享一周内发表在高水平期刊上的Metasurface领域研究成果,帮助读者及时了解领域前沿动态,如果对专栏的写法或内容有什么建议欢迎留言,后续会陆续开启其他专栏,敬请期待。论文基本信息标题:Electromagneticmetamaterialagent作者:......
  • Java学习7
    一、异常概念、异常分类ArrayIndexOutofBoundsException数组下标越界异常NullPointerException空指针异常StringIndexOutofBoundsException字符串下标越界异常CharcharAt(intindex)ArithmeticException算数异常ClassCastExceptionpublicclassThrowable异常的......
  • 为什么要学习C++?
            在编程语言的广阔天地中,C++以其独特的魅力和强大的功能占据着重要的一席之地。尽管它并非新兴的热门语言,学习曲线也相对陡峭,但这丝毫没有阻挡开发者们对它的热情。那么,究竟为什么要学习C++呢?接下来,我们将深入探讨其中的缘由。一、卓越的性能表现    ......
  • 强化学习
    一.简介    深度学习、强化学习和深度强化学习是机器学习的三个重要子领域。它们有着各自独特的应用场景和研究目标,虽然都属于机器学习的范畴,但各自的实现方式和侧重点有所不同。1.1   深度学习与强化学习1.1.1深度学习    深度学习是一种基于神经网络的......
  • 寒假集训笔记 | | 第一课
    C++STL--第一课C标准库常用函数<cstring>memset()暴力清空charstr[10];memset(str,0,sizeof(str));<cmath>三角函数、指数函数、浮点取整函数<cstdlib>qsort()C语言快排rand()随机数malloc()free()C语言动态内存分配<cctype>isdigit()isalpha()......