JavaScript-变量、数据类型(基本、复杂、数据类型转换)、运算符(算术、递增/减、比较、逻辑、赋值、优先级)

文章目录

  • 1. JavaScript中的变量
    • 1.1 变量的本质
    • 1.2 变量的使用
    • 1.3 变量的语法拓展
    • 1.4 变量的命名规范
  • 2. JavaScript的数据类型
    • 2.1 弱类型
    • 2.2 基本数据类型
    • 2.3 引用数据类型(复杂/合数据类型)
    • 2.4 常见的数制转换
    • 2.5 数据类型转换
  • 3. JavaScript运算符
    • 3.1 算术运算符
    • 3.2 递增和递减运算符
    • 3.3 比较运算符
    • 3.4 逻辑运算符
    • 3.5 赋值运算符
    • 3.6 运算符优先级

1. JavaScript中的变量

1.1 变量的本质

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

1.2 变量的使用

变量在使用中分为两步:声明变量赋值

  1. 声明变量:
var age;   //声明一个名称为age的变量(在内存中分配一块存储区)
  1. 变量赋值
age = 10;  // 给age这个变量赋值为10          
  1. 声明变量的同时赋值(变量的初始化)
var age = 18,name = "刘备"
  1. 注意:’+'的作用
    i. 算术运算的加法:运算对象必须是数值型数据
    ii. 连接符:可以将变量和字符串进行连接,连接的结果是一个字符串
    例:
var age = 25
var str = "年龄:"+age

iii. 不声明变量,只进行赋值。在JS中,直接赋值一个未声明的变量,也可输出正确的值

1.3 变量的语法拓展

  1. 更新变量
    一个变量被重新复赋值后,它原有的值就会被覆盖,变量值将以最后一次赋的值为准。
var age = 18;
age = 81;   // 最后的结果就是81因为18 被覆盖掉了          
  1. 同时声明多个变量
    只需要写一个 var, 多个变量名之间使用英文逗号隔开。
var age = 19,  name = 'wj', sex = 2;       
  1. 声明变量特殊情况
情况 说明 结果
var age;console.log(age); 只声明 不赋值 undefuned
console.log(age) 不声明 不赋值 直接使用 报错
age = 10;console.log(age); 不声明 只赋值 10

1.4 变量的命名规范

  • 由字母、数字、下划线和美元符号($)组成
  • 严格区分大小写
  • 不能以数字开头
  • 不能是关键字、保留字
  • 要尽量做到“见其名知其意”
  • 建议遵循驼峰命名法,首字母小写,后面的单词首字母大写
    JavaScript-变量、数据类型(基本、复杂、数据类型转换)、运算符(算术、递增/减、比较、逻辑、赋值、优先级)_第1张图片

2. JavaScript的数据类型

在计算机中,不同的数据所需占用的存储空间是不同的,为了便于把数据分成所需内存大小不同的数据,充分利用存储空间,于是定义了不同的数据类型。
简单来说,数据类型就是数据的类别型号。比如姓名“张三”,年龄18,这些数据的类型是不一样的。
JavaScript 是一种弱类型或者说动态语言。这意味着不用提前声明变量的类型,在程序运行过程中,类型会被自动确定。

var age = 10;        // 这是一个数字型
var areYouOk = '是的';   // 这是一个字符串     

JavaScript 拥有动态类型,同时也意味着相同的变量可用作不同的类型

var x = 6;           // x 为数字
var x = "Bill";      // x 为字符串    

2.1 弱类型

在声明变量时不用指定数据类型,在程序运行过程中通过赋值来指定数据类型

2.2 基本数据类型

简单数据类型 说明 默认值
Number 数字型,包含 整型值和浮点型值,如21、0.21 0
Boolean 布尔值类型,如true、false,等价于1和0 false
String 字符串类型,如“张三” 注意js中,字符串都带引号 “ ”
Undefined 未定义类型,var a;声明了变量a但是没有给值,此时 a = undefined undefined
Null 空型,var a = null;声明了变量a为空值 null

数字型的3个特殊值:

  • Infinity(无穷大):如Number.MAX_VALUE*2
  • -Infinity(无穷小):如-Number.MAX_VALUE*2
  • NaN(非数值,Not a Number):如’abc’-100
  • isNaN:判断"参数"是否是非数字,返回值为true表示非数字,false表示是数字

字符串转义符
JavaScript-变量、数据类型(基本、复杂、数据类型转换)、运算符(算术、递增/减、比较、逻辑、赋值、优先级)_第2张图片

2.3 引用数据类型(复杂/合数据类型)

object

2.4 常见的数制转换

  • 十进制:逢十进一
  • 二进制
  • 八进制
  • 十六进制

2.5 数据类型转换

  1. 转换成字符串
    JavaScript-变量、数据类型(基本、复杂、数据类型转换)、运算符(算术、递增/减、比较、逻辑、赋值、优先级)_第3张图片
    更常用第三种加号拼接字符串转换方式,也称为隐式转换
  2. 转换为数字型(重点)
    JavaScript-变量、数据类型(基本、复杂、数据类型转换)、运算符(算术、递增/减、比较、逻辑、赋值、优先级)_第4张图片
    注意单词的大小写
    隐式转换是在进行算数运算的时候,JS自动转换了数据类型
  3. 转换为布尔型
    在这里插入图片描述
    代表空、否定的值会被转换为 false ,如 ‘’、0、NaN、null、undefined
    其余值都会被转换为 true
console.log(Boolean('')); // false
console.log(Boolean(0)); // false
console.log(Boolean(NaN)); // false
console.log(Boolean(null)); // false
console.log(Boolean(undefined)); // false
console.log(Boolean('小白')); // true
console.log(Boolean(12)); // true

3. JavaScript运算符

3.1 算术运算符

JavaScript-变量、数据类型(基本、复杂、数据类型转换)、运算符(算术、递增/减、比较、逻辑、赋值、优先级)_第5张图片
浮点数值的最高精度是17位小数,但在进行算数运算时其精度远远不如整数

var result = 0.1 + 0.2;    // 结果不是 0.3,而是:0.30000000000000004
console.log(0.07 * 100);   // 结果不是 7,  而是:7.000000000000001

不能直接判断两个浮点数是否相等

3.2 递增和递减运算符

  1. 前置递增运算符
    ++num 前置递增,就是自加1,类似于 num = num + 1, ++num 写起来更简单。
    使用口诀:先自加,后返回值(先己后人)
  2. 后置递增运算符
    num++ 后置递增,就是自加1,类似于 num = num + 1 ,num++ 写起来更简单。
    使用口诀:先返回原值,后自加 (先人后己)

3.3 比较运算符

两个数据进行比较时所使用的运算符,会返回一个布尔值(true / false)
JavaScript-变量、数据类型(基本、复杂、数据类型转换)、运算符(算术、递增/减、比较、逻辑、赋值、优先级)_第6张图片
JavaScript-变量、数据类型(基本、复杂、数据类型转换)、运算符(算术、递增/减、比较、逻辑、赋值、优先级)_第7张图片

3.4 逻辑运算符

JavaScript-变量、数据类型(基本、复杂、数据类型转换)、运算符(算术、递增/减、比较、逻辑、赋值、优先级)_第8张图片

  1. 逻辑与 &&
    JavaScript-变量、数据类型(基本、复杂、数据类型转换)、运算符(算术、递增/减、比较、逻辑、赋值、优先级)_第9张图片
  2. 逻辑或 ||
    JavaScript-变量、数据类型(基本、复杂、数据类型转换)、运算符(算术、递增/减、比较、逻辑、赋值、优先级)_第10张图片
  3. 逻辑非 !
    也叫取反符,用来取一个布尔值相反的值,如 true 的相反值是 false
var isOk = !true;
console.log(isOk);  // false
  1. 短路运算(逻辑中断)
    原理:当有多个表达式(值)时,左边的表达式值可以确定结果时,就不再继续运算右边的表达式的值

3.5 赋值运算符

用来把数据赋值给变量的运算符
JavaScript-变量、数据类型(基本、复杂、数据类型转换)、运算符(算术、递增/减、比较、逻辑、赋值、优先级)_第11张图片

3.6 运算符优先级

JavaScript-变量、数据类型(基本、复杂、数据类型转换)、运算符(算术、递增/减、比较、逻辑、赋值、优先级)_第12张图片

  • 一元运算符中逻辑非优先级很高
  • 逻辑与比逻辑或优先级高

你可能感兴趣的:(JavaScript,javascript,前端,数据类型,js对象赋值,html)