JavaScript基础___作用&变量&数据类型与转换

---

---

JavaScript基础

javascript的作用

• 表单动态校验（密码强度检测)( JS 产生最初的目的)
• 网页特效
• 服务端开发(Node.js)
• 桌面程序(Electron)
• App(Cordova)
• 控制硬件-物联网(Ruff)
• 游戏开发(cocos2d-js)

HTML/CSS/JS的关系

HTML/CSS标记语言–描述类语言

• HTML决定网页的结构和内容(决定看到什么)，相当于人的身体

• CSS决定网页呈现给用户的摸样，相当于给人穿衣服、化妆

JS脚本语言–编程类语言

• 实现业务逻辑和页面控制(决定功能)，相当于人的各种动作

JS的组成

1. **ECMAScript**

   (ECMAScript 是由ECMA 国际（ 原欧洲计算机制造商协会）进行标准化的一门编程语言，这种语言在万维网上应用广泛，它往往被称为 JavaScript或 JScript，但实际上后两者是 ECMAScript 语言的实现和扩展。)
   

2. **DOM——文档对象模型**

   **文档对象模型**（DocumentObject Model，简称DOM），是W3C组织推荐的处理可扩展标记语言的标准编程接口。通过 DOM 提供的接口可以对页面上的各种元素进行操作（大小、位置、颜色等）
   

3. **BOM——浏览器对象模型**

   **浏览器对象模型**(Browser Object Model，简称BOM) 是指浏览器对象模型，它提供了独立于内容的、可以与浏览器窗口进行互动的对象结构。通过BOM可以操作浏览器窗口，比如弹出框、控制浏览器跳转、获取分辨率等。
   

JS书写位置

三种：行内，内嵌，外部。

JavaScript注释

单行注释

// 用来注释单行文字（  快捷键   ctrl  +  /   ）

多行注释

/*
  获取用户年龄和姓名
  并通过提示框显示出来
*/                 （ 默认快捷键  alt +  shift  + a ） 

JavaScript输出语句

1、alert()：弹窗输出
2、prompt()：弹窗输入接受两部分参数：① 输入提示内容；② 输入框的默认文本。（两部分都可以省略）输入的内容默认都是字符串。
3、document.write("<h1>{{12345:0}}</h1> <h6>hahaha</h6>");在浏览器屏幕上面打印。
4、console.log("hahaha");浏览器控制台打印。 

• 注意：alert() 主要用来显示消息给用户，console.log() 用来给程序员自己看运行时的消息。

变量

什么是变量

JavaScript 变量是存储数据值的容器。

变量命名规范

规则：

• - 由字母(A-Za-z)、数字(0-9)、下划线(_)、美元符号( $ )组成，如：usrAge, num01, _name
  - 严格区分大小写。var app; 和 var App; 是两个变量
  - 不能 以数字开头。 18age 是错误的
  - 不能 是关键字、保留字。例如：var、for、while
  - 变量名必须有意义。 MMD BBD nl → age
  - 遵守驼峰命名法。首字母小写，后面单词的首字母需要大写。myFirstName
  - 变量必须以字母开头
  - 变量也能以 $ 和 _ 符号开头（不过我们不推荐这么做）
  - 变量名称对大小写敏感（y 和 Y 是不同的变量）
  

变量拓展

• 更新变量

  一个变量被重新复赋值后，它原有的值就会被覆盖，变量值将以最后一次赋的值为准。

• 同时声明多个变量

  同时声明多个变量时，只需要写一个 var， 多个变量名之间使用英文逗号隔开。

• 声明变量特殊情况

情况	说明	结果
var age ; console.log (age);	只声明 不赋值	undefined
console.log(age)	不声明 不赋值 直接使用	报错
age = 10; console.log (age);	不声明 只赋值	10

数据类型

值类型(基本类型)：字符串（String）、数字(Number)、布尔(Boolean)、对空（Null）、未定义（Undefined）、Symbol。

引用数据类型：对象(Object)、数组(Array)、函数(Function)。

JavaScript 拥有动态类型。这意味着相同的变量可用作不同的类型：

简单数据类型	说明
Number	数字型，包含整型值和浮点值	0
Boolena	布尔型，ture、false，等价1，0	false
String	字符串类型，js里字符串都带引号	“”
Undefined	声明一个变量不给值那么这个变量的值=undefined	undefined
Null	var a = null；声明了变量a为空值	null

01.数字型Number

JS里数字类型即可以保存整数，也可以保存小数

isNaN(比较特殊的数字类型)：用来判断一个变量是否为非数字的类型是数字返回false，不是数字返回true

02.字符串型String

字符串是存储字符（比如 “Bill Gates”）的变量。

字符串可以是引号中的任意文本。可以使用单引号或双引

• 字符串的长度

  字符串是由若干字符组成的，通过字符串的 length 属性可以获取整个字符串的长度。

• 字符串的拼接

  多个字符串之间可以使用 + 进行拼接，其拼接方式为 字符串 + 任何类型 = 拼接之后的新字符串

03.布尔型Boolean

布尔类型有两个值：true 和 false ，其中 true 表示真（对），而 false 表示假（错）。

布尔型和数字型相加的时候， true 的值为 1 ，false 的值为 0。

04.Undefine和Null

一个声明后没有被赋值的变量会有一个默认值undefined ( 如果进行相连或者相加时，注意结果）

一个声明变量给 null 值，里面存的值为空

获取变量的数据类型

typeof 可用来获取检测变量的数据类型

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-wk8aByyt-1631933712868)(https://z3.ax1x.com/2021/09/18/4Qlgvd.png)]

数据类型的转换

就是把一种数据类型的变量转换成另一种数据类型，通常会实现3种方式的转换：·

转换为字符串类型
转换为数字型
转换为布尔型

01转为字符串

02转为数字型

方式	说明
parselent(string)函数	将string类型转为整数型
parseFlost(string)函数	将string类型转为浮点型
Number()强制转换函数	将string类型转为数值型
js隐式转换(- * /)	利用算术运算隐式转换为数值型

03转换为布尔型

方式	说明
Boolean()函数	其他类型转换为布尔值

• 代表空、否定的值会被转换为 false ，如

   ''、0、NaN、null、undefined"
  

隐式转换为数值型 |

03转换为布尔型

方式	说明
Boolean()函数	其他类型转换为布尔值

• 代表空、否定的值会被转换为 false ，如

   ''、0、NaN、null、undefined"
  

• 其余值都会被转换为 true