JavaScript书写基础和基本数据类型

@jarringslee

js书写基础和规范

js是一种在客户端(浏览器)运行的编程语言,可实现人机交互的效果。


js组成:

js由两部分组成:

  1. ECMAScript:js的语言基础,js遵循其语言逻辑。它规定了js的基础语法核心知识,如变量、分支、循环等;
  2. Web APIs:分为DOM(页面文档对象型:操作文档,比如对页面元素进行移动、大小、添加删除等操作)和BOM(浏览器对象型:操作浏览器,比如页面弹窗、检测窗口宽度、存储数据到浏览器等)。

js书写位置:

  • 行内js

  • 内部js直接写在html文件中(通常写在</body>标签上面),用<script>标签包裹住

  • 外部js通过link链接

    <body><script src="js文件地址"></script>
    </body>
    

js结束符:

可以用分号结尾,也可以不写,统一格式即可。

输入和输出语法:

  • 输出语法

    1. 向body内输出内容:

      document是文档的意思,输出内容也可以用标签包裹。

      document.write('输出内容')
      document.write('<h1>我是标题</h1>')
      
    2. 页面弹出警示框:

      alert('输出内容')
      
    3. 控制台输出(用户无法看到,在控制到console中):

      console.log('控制台输出')  //简写为log
      
  • 输入语法

    1. 显示对话框和文字信息

      promot('请输入姓名')
      

被引号包裹的内容可以用单引号’’、双引号""或反引号``


执行顺序:

  1. 按文档流顺序执行代码;
  2. alert()和promot()会跳过页面渲染先被执行

js字面量

字面量literal在计算机中描述事/物

  • 月薪是30000 此时30000是数字变量
  • ‘泥嚎’ 泥嚎是字符串字面量
  • [] 是数组字面量 {} 是对象字面量

变量、常量、数据类型

变量 let

变量是计算机中用来存储数据的容器,并不是数据本身。

变量的声明/定义/创建: 声明关键字 变量名 let age = 18

**变量的本质:**是程序在内存中申请的一块用来存放数据的小空间

存储输入的数据:

        let uname =prompt('请输入姓名')document.write('姓名:', uname, '。')//或者const age = prompt('请输入您的年龄')document.write('年龄:${age}<br>')

**数组变量:**直接声明,等号后写中括号,元素间用逗号隔开。

数组长度:变量名+点+length(最大元素的下标+1)

        let uname = [111, 222, 'num', 231]document.write('姓名:', uname[2], '。')document.write('数组长度:', uname.length, '。')

常量 const

声明时必须赋值,且不允许再次赋值,无法被修改。 const PI = 3.14


数据类型

基本数据类型:

  • **数字类型Number:**变量声明后直接创建。可以是整数、小数、正数、负数。

    js、Python是弱数据类型的语言:一个关键字可以声明任意类型的数字(整数、小数…)。

    而c、java就是强数据类型的语言:int整数、float或者double为浮点数。

    数字的运算符:算术运算符:

    • 优先级最大的是括号中或者次方(**:4**2表示4的4次方
    • 乘 除 取余
    • 加 减

    如果碰到非数字进行了算术运算,则会输出:NaN。

    NaN代表一个计算错误。它是粘性的:任何和其有关的操作都会返回NaN。“NaN==NaN”的命题也是错的。

  • **字符串类型string:**变量声明后用引号(单引号、双引号、反引号)包裹创建内容。注意若数字被引号包裹了,那它也是字符串类型。

    空字符串:let str = '' console'log('')

    字符串拼接:加号+ 可以把相邻的两个字符串或相邻的字符串和数字相连在一起。

    document.write('我今年' + 19 + '岁了')
    //等价于
    document.write('我今年', 19, '岁了')
    //或者
    let age = 19
    document.write('我今年' + age + '岁了')
    //或者
    let age = 19
    let aa = '我今年'
    let bb = '岁了'
    document.write(aa + age + bb)
    

    直接在字符串的引号中书写变量名:模版字符串

    字符串用反引号包裹,引号中的变量名用**${}**包裹

    document.write(`我今年${age}岁了`)
    
  • **布尔类型boolean:**判断真假的数据类型,有true(真)和false(假)两个数据类型

    let mybool = true
    document.write(mybool)
    

    若直接在输出内容中放一个判断问题(不加引号),也可以直接输出true或false

    document.write(99 < 1000)
    
  • 未定义类型undefined: 值直接为undefined。在不声明变量、不赋值的情况下默认值为undefined。一般不直接把某个变量赋值为undefined。

    let buy
    document.write(buy) //输出值为undefined
    

    **使用场景:**若后端有一个变量传过来,可以通过判断这个值是不是undefined来确定这个值是否有效。

  • 空类型null: null是对象数据类型(object),表示创建了变量但是没有赋值,代表“无”“空”“未知”的一个特殊值

    let obj = null
    

    undefined是没有赋值(什么也不是,不能参与运算),null表示赋值了但是内容为空(没有值,参与运算时默认为0)

    document.write(undefined + 1) //输出NaN
    document.write(null + 1) //输出值为1
    

    **使用场景:**如果一个变量中确定存放的是对象,但还没有准备好该对象,可以先放null

检测数据类型 typeof

在输出中使用,可以直接输出变量类型名

书写方法:

  • typeof + 空格 + 变量名(常用)
  • typeof + (变量名)
        let num = 10console.log(typeof num)  //输出numberlet str = 'pink'console.log(typeof str)  //输出stringlet no = ''console.log(typeof no)  //输出stringlet flag = falseconsole.log(typeof flag)  //输出booleanlet unconsole.log(typeof un)  //输出undefinedlet obj = nullconsole.log(typeof obj)  //输出object

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如若转载,请注明出处:http://www.pswp.cn/news/914559.shtml
繁体地址,请注明出处:http://hk.pswp.cn/news/914559.shtml
英文地址,请注明出处:http://en.pswp.cn/news/914559.shtml

如若内容造成侵权/违法违规/事实不符,请联系英文站点网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

CSS个人笔记分享【仅供学习交流】

1、调整透明度 .text{ background-color: rgba(0, 0, 0, 0.08); }解释&#xff1a;rgba&#xff08;rgb三元素&#xff0c;透明度取值从0~1&#xff09; 2、文字和图片对齐方式 长用于头像旁边的昵称居中显示<img src"img/hua" alt"">华仔</img&g…

24.找到列表中最大或最小值的索引

找到列表中最大或最小值的索引 在 Python 中,如果你想找出某个列表中最小或最大值的位置(索引),你可以通过两步快速实现: 使用 min() 或 max() 获取目标值使用 .index() 获取目标值在列表中的索引位置✅ 基础实现 def min_element_index(arr):return arr.index(min(arr)

如何解决pip安装报错ModuleNotFoundError: No module named ‘pandas’问题

【Python系列Bug修复PyCharm控制台pip install报错】如何解决pip安装报错ModuleNotFoundError: No module named ‘pandas’问题 摘要 在使用 PyCharm 的 Python 控制台或终端执行 pip install pandas 后&#xff0c;仍然出现 ModuleNotFoundError: No module named ‘pandas…

【env环境】rtthread5.1.0使用fal组件

配置 board/Kconfigconfig BSP_USING_ON_CHIP_FLASHbool "Enable On Chip Flash"default ncp rt-thread/components/fal/samples/porting/fal_cfg.h board/fal_cfg.h /** Copyright (c) 2006-2018, RT-Thread Development Team** SPDX-License-Identifier: Apache-2.…

C++20 协程参考手册详解 - 源自 cppreference.com

C20 协程参考手册详解 - 源自 cppreference.com 人话版 先说“人说”&#xff0c;简化版本&#xff0c;更易理解。 宏观概念&#xff1a;协程是一个可以暂定和恢复执行的函数。&#xff08;普通函数是线程相关的&#xff0c;函数的调用依赖于线程栈&#xff0c;而协程的运行…

AI大模型训练的云原生实践:如何用Kubernetes指挥千卡集群?

当你的团队还在手动拼装显卡集群时&#xff0c;聪明人早已教会Kubernetes自动调度千卡。就像交响乐团需要指挥家&#xff0c;万级GPU需要云原生调度艺术。深夜的机房&#xff0c;硬件工程师老张盯着监控屏上跳动的红色警报——手工组装的千卡集群再次因单点故障崩溃。而隔壁团队…

java 在k8s中的部署流程

1.写Docker文件FROM ubuntu:22.04ENV LANGC.UTF-8 LC_ALLC.UTF-8RUN apt-get update \&& DEBIAN_FRONTENDnoninteractive apt-get install -y --no-install-recommends tzdata curl ca-certificates fontconfig locales binutils \&& echo "C.UTF-8 UTF-8…

静电式 vs UV 光解:哪种油烟净化技术更适合你的餐厅?

在餐饮行业&#xff0c;油烟净化是维持厨房环境、保障周边空气质量的关键环节。静电式与 UV 光解作为两种主流净化技术&#xff0c;各有其适用范围与局限性。选择时需结合餐厅的烹饪类型、油烟特点及环保要求&#xff0c;而非盲目追求技术先进或价格高低。一、技术原理&#xf…

Java全栈工程师面试实录:从电商系统到AIGC的层层递进

场景&#xff1a;互联网大厂Java面试官 vs 搞笑程序员小曾 第一轮提问 面试官&#xff1a;小曾&#xff0c;我们公司正在重构一个高并发的电商系统&#xff0c;需要使用Spring Cloud Alibaba进行服务拆分。你能描述一下如何用Nacos进行服务注册与发现&#xff0c;并解决服务雪崩…

C++ CRTP

C CRTP&#xff08;奇异递归模板模式&#xff09;CRTP 是什么&#xff1f; 一句话总结&#xff1a;CRTP 就是让子类把自己作为模板参数传递给父类。 听起来有点绕&#xff0c;直接上代码就明白了&#xff1a; template <typename Derived> class Base {// ... };class De…

21.映射字典的值

有时候你会希望保留字典的键不变,但将每个键对应的值应用一个函数进行转换,比如提取字段、做数学运算、格式化等。 ✅ 基本用法 你可以使用 dict.items() 搭配字典推导式或生成器表达式来实现。 def map_values(obj, fn):return dict((k, fn(v)

【算法】贪心算法:摆动序列C++

文章目录前言题目解析算法原理代码示例策略证明前言 题目的链接&#xff0c;大家可以先试着去做一下再来看一下思路。376. 摆动序列 - 力扣&#xff08;LeetCode&#xff09; 题目解析 将题目有用的信息划出来&#xff0c;结合示例认真阅读&#xff0c;去理解题目。 我们的摆…

【DOCKER】-6 docker的资源限制与监控

文章目录1、docker的资源限制1.1 容器资源限制的介绍1.2 OOM1.3 容器的内存限制1.3.1 内存限制的相关选项1.4 容器的CPU限制介绍2、docker的监控插件2.1 cadvisor2.2 portainer1、docker的资源限制 1.1 容器资源限制的介绍 默认情况下&#xff0c;容器没有资源的使用限制&…

gcc 源码分析--gimple 关键数据结构

gimple 操作码&#xff0c;支持这些&#xff1a;DEFGSCODE(GIMPLE_symbol, printable name, GSS_symbol). */ DEFGSCODE(GIMPLE_ERROR_MARK, "gimple_error_mark", GSS_BASE) DEFGSCODE(GIMPLE_COND, "gimple_cond", GSS_WITH_OPS) DEFGSCODE(GIMPLE_DEBU…

TDengine GREATEST 和 LEAST 函数用户手册

TDengine GREATEST 和 LEAST 函数用户手册 1. 需求背景 1.1 问题描述 在实际生产过程中&#xff0c;客户经常需要计算三相电流、电压的最大值和最小值。传统的实现方式需要使用复杂的 CASE WHEN 语句&#xff0c;例如&#xff1a; -- 传统方式&#xff1a;计算三相电流最大…

Redis 与数据库不一致问题及解决方案

一、不一致的原因分析 1. 缓存更新策略不当 先更新数据库后删除缓存:删除缓存失败会导致不一致 先删除缓存后更新数据库:并发请求可能导致不一致 缓存穿透:大量请求直接打到数据库,绕过缓存 2. 并发操作问题 读写并发:读请求获取旧缓存时,写请求更新了数据库但未更新缓存…

iOS 加固工具使用经验与 App 安全交付流程的实战分享

在实际开发中&#xff0c;iOS App不仅要安全&#xff0c;还要能被稳定、快速、无误地交付。这在外包、B端项目、渠道分发、企业自用系统等场景中尤为常见。 然而&#xff0c;许多开发者在引入加固工具后会遇到以下困扰&#xff1a; 混淆后App运行异常、不稳定&#xff1b;资源路…

Windows 下 Visual Studio 开发 C++ 项目的部署流程

在Windows环境中使用Visual Studio&#xff08;以下简称VS&#xff09;开发C项目时&#xff0c;“部署”是确保程序能在目标设备上正常运行的关键环节。部署的核心目标是&#xff1a;将编译生成的可执行文件&#xff08;.exe&#xff09;、依赖的动态链接库&#xff08;.dll&am…

yolo8+声纹识别(实时字幕)

现在已经完成了人脸识别跟踪 ✅&#xff0c;接下来要&#xff1a; ✅ 加入「声纹识别&#xff08;说话人识别&#xff09;」功能&#xff0c;识别谁在讲话&#xff0c;并在视频中“这个人”的名字旁边加上「正在讲话」。 这属于多模态识别&#xff08;视觉 音频&#xff09;&a…

DH(Denavit–Hartenberg)矩阵

DH 矩阵&#xff08;Denavit-Hartenberg 矩阵&#xff09;是 1955 年由 Denavit 和 Hartenberg 提出的一种机器人运动学建模方法&#xff0c;用于描述机器人连杆和关节之间的关系。该方法通过在机器人每个连杆上建立坐标系&#xff0c;并用 44 的齐次变换矩阵&#xff08;DH 矩…