JavaScript—数据类型转换

news2025/1/17 15:41:22

目录

 1、起  源 

 理 念 

 2、特 点 

 框 架 

 书 写 位 置 

 注 释 

 浏览器调试js代码 

 3、变量 

 ① 全局变量 

 ② 局部变量 

 ③ 常量 

 4、数据类型 

 严格检查数据类型-use strict 

 ① 数 组 

 ② 字符串 

 6、类型转换 

① 字符串转数字

② 字符串转bool值

③ 能力判断

 7、编码方式 

 js三元表达式的简写 

 js与CSS的区别 


结构层:HTML 决定网页内容

表现层:CSS 提供样式

行为层:javascript 网页动起来

 1、起  源 

处理网页中的前端验证(指检查用户输入的内容是否符合一定规则)

 理 念 

这些验证过于简单,放在服务器没必要,因此把它放在浏览器。

 2、特 点 

 框 架 

  1. AngularJS框架

  1. WebSocket协议

 书 写 位 置 

1. 在head标签中添加<script>标签

<script type="text/javascript">

    alert("第一行js代码哟");   //弹出提示框

</script>

2. 写在标签的属性中(结构与行为耦合,不方便维护)

<body>

    <!--点击按钮,执行js代码-->

    <button onclick="alert('不许点');">点我一下</button>

</body>

3. 写在超链接href属性中

<a href="javascript:alert('还点');">我是超链接</a>

4. 写在外部js文件中,通过script标签引入(一旦被引用,再修改js文件的代码也没用了)

<script type="text/javascript" scr="js/script.js">

</script>

 注 释 

  1. 多行/**/
  2. 单行//

 浏览器调试js代码 

  1. 按F12找到脚本代码
  2. 设置断点
  3. IE:刷新后按F11调试
  4. 谷歌:F10调试
  5. 在控制台打印变量值

 3、变量 

  1. 在函数体声明的,函数外不能用
  2. 函数内可以访问函数外的成员
  3. 内外函数重名,就近原则

 ① 全局变量 

js只有一个全局变量——window,很容易发生重名的冲突,所以可以自己绑定一个全局变量。

//自己写的全局变量

var quanju={};

//把函数和字段绑定在这个全局变量中

quanju.name='lala';

quanju.add=function(a,b){

    return a+b;

}

 ② 局部变量 

建议使用let,不用var

 ③ 常量 

所有字母大写

const IP='不能变了';

 4、数据类型 

  1. 基本类型:数字类型(数字是浮点类型,不精确)、布尔类型、字符串类型(单、双引号都行,视情况而定,一般双引号里嵌套单引号)
  2. 引用类型:对象类型(用new生成的对象就是)、函数类型
  3. 空类型:unll、undefined
  4. 包装类型(Number、String、Boolean)(首字母大写)

        基本类型不是对象,不具备方法,只是一个简单的数据。在执行诸如“num.toString()”的时候,编译器会自动根据num生成一个Number类型的对象,并调用toString方法将结果返回,然后释放Number对象,等待垃圾回收。

        NaN与自己不相等

 严格检查数据类型-use strict 

i=1; //不写类型时是全局变量

var i=1;//局部

let i=1; //局部,建议使用

const i=1;//常量

因为js的数据类型非常灵活,为了防止出错,有了严格检查模式‘use strict

'use strict'   //必须写在script的第一行,有格式不严谨的就会报错

let i=1;

 ① 数 组 

① 数组的字面值、直接量(js里就大量使用字面值)

var arr=[1,2,2,true,'hello'];     //直接直观,什么类型都能放

② 构造方法创建数组(①②是一样的)

var arr=new Array(1,2,2,true,'hello');  //对象是(),数组是[]

取数组下标,如果越界了会报undefind

给arr.length赋值,数据长度就会变化(慎用)

 ② 字符串 

不可变

1.正常字符串使用单引号 或双引号包裹

2.注意转义字符\

\n  换行

\r

3.多行字符串编写(esc下边,tab上边)

var msg=

`hello

woed`

4.模板字符串

let name="xiaxia";

let msg='你好呀,${name}'

 6、类型转换 

//数字转字符串

String(数字)

数字+""

数字.toString()

① 字符串转数字

//字符串转数字

字符串-0

Number(字符串)

parseInt()

parseFloat()

② 字符串转bool值

加两个!!(意思是否定一次再否定一次)

if(!!val){

}

③ 能力判断

(判断对象里是否有某个函数)

//判断o里是否有函数foo,没有就添加

if(!o.foo){

    o.off=function(){};

}



//典型:JQuery中trim方法(不做赘述)

剩下的好好看图,图上都有:

 7、编码方式 

  1. 无论是js还是css都可以写在页面中
  2. <script>、<style>可以放在页面中的任何一个地方,可写一个或多个
  3. 为了页面流畅,一般将<style>和<link>放在前面,<script>放在后面

 js三元表达式的简写 

        对于js中的逻辑或运算,如果参与运算的数据不是布尔类型,看第一个操作数是否为真,如果是,整个表达式的返回值就是第一个操作数(可以是函数、字符串等等)

//f=f ? f:function(a,b) {return a-b;};

//下面是三元表达式的简写,f为真,返回值就是f函数本身,否则就是第二个函数

f=f || function(a,b) {return a-b;};

 js与CSS的区别 

Css:有background-color 这种写法

js:使用小驼峰命名规则,或者使用关联数组(把一个对象当数组来用),js不支持重载

<head>

<meta charset="utf-8" />

<title></title>

<script type="text/javascript">

                  onload=function(){

                         var p=document.getElementsByTagName("p")[0];

                         //backgroundColor就是小驼峰命名

                         p.style.backgroundColor="pink";

                         p.style.borderTopColor="blue";

                         p.style.borderTopStyle="dashed";

                           //关联数组,数组内是css的写法,真灵活

                         p.style["border-top-widrh"]="1px";

                  };    

</script>

</head>

<body>

<p>我是一个段落</p>

</body>

效果如下:

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

自动控制原理笔记-频率响应法-稳定裕度

目录 一、增益裕度h&#xff08;幅值裕度, gain margin&#xff09; 二、相角裕度g (phase margin) 三、根据Bode图确定稳定裕度 相角裕度 一、增益裕度h&#xff08;幅值裕度, gain margin&#xff09; 开环幅相特性曲线&#xff08;奈氏曲线&#xff09;G(jw)与负实轴…

教你一招在VMware的NAT模式下,两台电脑如何互相访问对方的虚拟机

目录 一. 准备工作二. 开始2.1 设置NAT模式2.2 进行NAT模式设置2.3 XShell访问对方虚拟机 一. 准备工作 需要两台电脑&#xff08;我准备了两台win10&#xff09; VMware虚拟机&#xff1a;【官网下载】两台win10电脑上都安装好centos 7系统&#xff08;我这里是centos 7版本…

3.Java线程

Java线程 3.1 创建和运行线程 方法一&#xff0c;直接使用Thread import lombok.extern.slf4j.Slf4j;/*** 使用匿名内部类创建线程* author xc* date 2023/4/30 16:19*/ Slf4j public class Test1 {public static void main(String[] args) {Thread thread new Thread(){Ov…

OpenCV-Python图像几何变换

概念&#xff1a;几何变换是指将一幅图像映射到另外一幅图像内的操作。OpenCV提供了多个与映射有关的函数&#xff0c;这些函数使用起来方便灵活&#xff0c;能够高效地完成图像的映射。 缩放 cv2.resize()函数用于缩放图像 det cv2.resize(src, dsize[,dst[,fx[,fy[,interp…

入门级BP神经网络实现回归预测的原理与python代码

文章目录 一、BP神经网络是什么&#xff1f;二、BP神经网络的原理&#xff1f;三、BP神经网络预测过程如下1.初始化参数&#xff1a;2.前向传播&#xff1a;3.反向传播&#xff1a;4.更新参数&#xff1a;5.重复上述过程&#xff0c;直到满足收敛条件或达到最大迭代轮次。 四、…

【Liunx】进程地址空间

文章目录 &#x1f4d6; 前言1. 环境变量收尾1.1 认识bash进程&#xff1a;1.2 环境变量具有全局属性&#xff1a;1.3 内建命令&#xff1a; 2. 进程地址空间2.1 Liunx — 地址空间验证&#xff1a;2.2 感知地址空间的存在&#xff1a;2.3 认识地址空间&#xff1a;2.3 - 1&…

C++右值引用(左值表达式、右值表达式)(移动语义、完美转发(右值引用+std::forward))(有问题悬而未决)

文章目录 什么是右值&#xff1f;是什么是右值引用&#xff1f;什么是移动语义&#xff1f;什么是完美转发&#xff1f;&#xff08;右值引用std::forward&#xff09; 什么是右值&#xff1f; 在 C 中&#xff0c;表达式可以分为左值表达式和右值表达式。左值表达式指的是可以…

《常规脉搏传输时间作为人体血压变化标志》阅读笔记

目录 一、论文摘要 二、论文十问 Q1: 论文试图解决什么问题&#xff1f; Q2: 这是否是一个新的问题&#xff1f; Q3: 这篇文章要验证一个什么科学假设&#xff1f; Q4: 有哪些相关研究&#xff1f;如何归类&#xff1f;谁是这一课题在领域内值得关注的研究员&#xff1f; …

OpenCV教程——加载、修改、保存图像

1.颜色空间 颜色空间&#xff1a;也称彩色模型&#xff08;又称彩色空间或彩色系统&#xff09;。本质上&#xff0c;彩色模型是坐标系统和子空间的阐述。位于系统的每种颜色都有单个点表示。RGB&#xff08;红绿蓝&#xff09;是依据人眼识别的颜色定义出的空间&#xff0c;可…

「二线豪华」或成历史,理想反超沃尔沃再树「里程碑」

今年的上海车展&#xff0c;除了占据C位的新能源汽车&#xff0c;还有传统车企。 上海车展开幕前&#xff0c;沃尔沃汽车大中华区销售公司总裁钦培吉在新车发布会上直言&#xff1a;“新势力会的&#xff0c;我们三年就学会了&#xff1b;我们会的&#xff0c;新势力十年都学不…

SQL事务与存储引擎

索引回顾&#xff1a; 索引是一个排序的列表&#xff0c;包含字段的值和值所在行数据的物理地址 事务是一个机制&#xff0c;一个操作序列&#xff08;一组操作命令&#xff09;&#xff0c;事务会把所有命令当做一个整体向系统提交或撤销操作&#xff0c;要么都执行&#xf…

MySQL中的Join 的算法(NLJ、BNL、BKA)

本文已收录至Github&#xff0c;推荐阅读 &#x1f449; Java随想录 文章目录 摘要什么是JoinIndex Nested-Loop JoinBlock Nested-Loop JoinMRR & BKA总结 摘要 Join是MySQL中最常见的查询操作之一&#xff0c;用于从多个表中获取数据并将它们组合在一起。Join算法通常使…

【概念大全(关系,码,选择,投影,连接,运算)】第二章 关系数据库

第二章 关系数据库 1. 关系的基本概念1. 什么是域2. 笛卡尔积3. 笛卡尔积中 有意义的子集 就是关系4. 候选码 &#xff08;是唯一标识符 并不是用 只有一个进行判断&#xff09;5. 全码&#xff08;一行中都不重复&#xff09;6. 主码&#xff08;候选码选一个就是主码&#xf…

手术麻醉临床信息系统源码,实时自动采集麻醉和监护设备的数据

手术麻醉临床信息系统源码 手术麻醉临床信息系统实时采集麻醉和监护设备的数据&#xff0c;实现术前、术中、术后全手术过程的数字化管理&#xff0c;为手术室提供全数字化的业务管理、临床管理、费用管理、材料管理等。同时通过与 HIS、EMR、PACS、LIS 等系统无缝集成&#x…

Linux中信号的基础知识

信号的概念 Linux操作系统中&#xff0c;信号是一种进程间通信&#xff08;Inter-Process Communication, IPC&#xff09;机制&#xff0c;用于向其他进程发送通知或指示&#xff0c;通常是为了通知特定事件的发生&#xff0c;如程序终止、用户按下特定按键等。信号提供了一种…

java获取输入内容的方法

Java中的对象类型可以有多种&#xff0c;比如 Object、 StringBuilder等&#xff0c;其中 Object和 String是最常用的对象类型&#xff0c;而 StringBuilder类是一种特殊的类&#xff0c;它能通过继承来创建其他的对象。 我们在平时的工作中经常会遇到需要获取输入内容的情况&a…

界面控件DevExpress Blazor UI v22.2亮点:全新的Window组件

DevExpress拥有.NET开发需要的所有平台控件&#xff0c;包含600多个UI控件、报表平台、DevExpress Dashboard eXpressApp 框架、适用于 Visual Studio的CodeRush等一系列辅助工具&#xff0c;该组件拥有众多新产品和数十个具有高影响力的功能&#xff0c;可为桌面、Web和移动应…

详解async 与 await,带您理解Playwright使用异步方法的正确姿势!

大家在使用python做playwright自动化测试的过程中&#xff0c;一定会发现下面这种异步用法 async def func():await apiawait api 很多同学可能只是按照这种写法来编写项目的自动化测试代码&#xff0c;对于具体细节可能并不了解&#xff0c;今天我就来讲一下playwright异步用…

基于fNIRS的脑功能连接分析:图论方法

导读 背景&#xff1a;fNIRS是一种利用近红外光谱进行功能神经成像的光学脑监测技术。它使用近红外光来测量大脑活动&#xff0c;并估计由于运动活动而引起的大脑皮层血流动力学活动。fNIRS通过光学吸收来测量含氧和脱氧血红蛋白中氧水平的变化。多源噪声和伪影干扰导致的信号…

【P6】JMeter HTTP Cookie管理器

文章目录 一、测试网站二、Cookie 设置规则2.1、无配置元件时&#xff0c;Cookie 不会自动设置&#xff08;与线程组设置无关&#xff09;2.2、有配置元件&#xff0c;不选任何参数时&#xff0c;Cookie 自动设置&#xff08;与线程组设置无关&#xff09;2.3、有配置元件&…