JavaScript入门基础之概述变量数据类型运算符

Posted 2021-06-10 YuLong~W

文章目录

• JavaScript 概述
• • JS 简介
  • 常见浏览器
  • JS 特点和组成
  • JS 使用方法及语法规则
  • 输入和输出
• 变量
• • 什么是变量
  • 变量的使用
  • 命名规范
• 数据类型
• • 数据类型的分类
  • 数据类型的转换
• 运算符
• • 常用运算符
  • 运算符优先级

javascript 概述

JS 简介

JavaScript： 是Web开发领域中的一种功能强大的编程语言，主要用于开发交互式的Web页面。在计算机、手机等设备上浏览的网页，其大多数的交互逻辑几乎都是由JavaScript实现的。

JavaScript内嵌于html网页中，通过浏览器内置的JavaScript引擎进行解释执行，把一个原本只用来显示的页面转变成支持用户交互的页面程序。

常见浏览器

浏览器是访问互联网中各种网站所必备的工具，JavaScript主要就是运行在浏览器中的。

常见浏览器及特点：

浏览器内核的分类：

• 渲染引擎（也称为排版引擎）：负责解析HTML与CSS，如Chrome浏览器的Blink。
• JavaScript引擎：是JavaScript语言的解释器，用于读取网页中的JavaScript代码，对其处理后执行，如Chrome浏览器的V8引擎

JS 特点和组成

特点：

• 脚本语言，特点是简单、易学、易用，语法规则松散
• 可以跨平台，不依赖操作系统
• 支持面向对象，开发快捷和高效，降低开发成本

组成：

• ECMAScript：是JavaScript的核心。它规定了JavaScript的编程语法和基础核心内容，是所有浏览器厂商共同遵守的一套JavaScript语法工业标准
• DOM：文档对象模型，是W3C组织推荐的处理可扩展标记语言的标准编程接口，通过DOM提供的接口，可以对页面上的各种元素进行操作
• BOM：浏览器对象模型，它提供了独立于内容的、可以与浏览器窗口进行互动的对象结构。通过BOM，可以对浏览器窗口进行操作

JS 使用方法及语法规则

• 行内嵌入式： 事件名=“JavaScript代码”

 <input type="button" value="确定" onclick="alert('我是行内嵌入的')">

• 页内嵌入式：

<script>
    alert('我是页面内部嵌入的')
</script>

• 外部链接式：
  先创建.js文件
  通过<script src="js文件名"> </script>标签将外部js文件链接到页面中

语法规则：

• 严格区分大小写
• 对空格、换行、缩进不敏感，一条语句可分多行写
• 一条语句结束写下一条语句，中间分号可省略
• 单行注释：’// ’                   ctrl+/
  多行注释：’ /* ’ ’ */ ’           shift+alt+/
  多行注释中可以嵌套单行注释，反之不行

输入和输出

• 消息框：alert(字符串)
• 确认消息框：confirm（字符串）
• 控制台输出：console.log(字符串)
• 输入消息框：prompt（字符串）

变量

什么是变量

变量是用于存放数据的容器。 我们通过变量名 获取数据，甚至数据可以修改

本质： 程序在内存中的一块用来存放数据的空间

变量的使用

• 声明变量：var 变量名 （ 在内存中分配一个存储区 ）
• 变量赋值：变量名=数据
• 变量初始化：var 变量名=数据 （声明变量同时赋值）

注意：

• 可同时声明多个变量
• 只声明变量，未对变量赋值会输出undefined
• 直接赋值一个未声明的变量，也可正确输出变量的值

命名规范

• 由字母(A-Za-z)、数字(0-9)、下划线(_)、美元符号( $ )组成
• 严格区分大小写
• 不能以数字开头
• 不能是关键字、保留字
• 变量名必须有意义。
• 遵守驼峰命名法。首字母小写，后面单词的首字母需要大写

数据类型

JavaScript是一种弱类型语言。在声明变量时不用指定数据类型，在程序运行过程中通过赋值来确定变量的数据类型

强类型语言：如：Java、C等
弱类型语言：如：JavaScript、Python等

数据类型的分类

JavaScript中的数据类型分为两大类，基本数据类型和复杂数据类型（也称为引用数据类型）。

数据类型的转换

转换为字符串型：

• 利用“+”拼接字符串（最常用的一种方式）
• 利用toString()转换成字符串
• 利用String()转换成字符串

注意： null和undefined无法使用toSting()方式进行转换；对于数字型的变量，可以在toString()的小括号中传入参数，来进行进制转换。

转换为数字型：

• 使用parseInt()将字符串转为整数
• 使用parseFloat()将字符串转为浮点数
• 使用Number()将字符串转为数字型
• 利用算术运算符（-、*、/）隐式转换

转换为布尔型：

使用Boolean（），在转换时，代表空、否定的值会被转换为false，如空字符串、0、NaN、null和undefined，其余的值转换为true。

注意：

• 非数字：NaN —> Not a Number
• isNan(参数)：判断参数是否为数字
• 单引号和双引号嵌套时，不能同时出现一个语句中
• 字符串转换为整数：parseInt（字符串）
• 字符串转换为浮点数：parseFloat（字符串）

运算符

常用运算符

JavaScript中常用的运算符有：

算数运算符

递增和递减运算符

递增（++）、递减（–） 运算符可以快速地对变量的值进行递增和递减操作，它属于一元运算符，只对一个表达式进行操作。

• 前置递增（递减）运算符：递增和递减运算符写在变量前面，返回的是计算后的结果
• 后置递增（递减）运算符：递增和递减运算符写在变量后面，返回的是计算前的结果
• 递增和递减运算符的优先级高于“+”“-”等运算符

比较运算符

注意：

• == ：等于             判断值是否相等
• ===：全等于        先判断类型再判断值

逻辑运算符

短路运算（逻辑中断）：

原理：当有多个表达式（值）时,左边的表达式值可以确定结果时,就不再继续运算右边的表达式的值

• &&的短路：当第一个表达式为false时，不运算第二个表达式
• ||的短路：当第一个表达式为true时，不运算第二个表达式

赋值运算符

三元运算符

条件表达式 ? 表达式1 : 表达式2

语法说明： 先求条件表达式的值，如果为true，则返回表达式1的执行结果；如果条件表达式的值为false，则返回表达式2的执行结果。

例子：求三个数最大的那个数
a>b? (a>c ? a : c) : (b>c ? b : c)

运算符优先级