ECMAScript5-P1（基础部分：数据类型+流程控制……）

最新推荐文章于 2024-06-16 18:09:06 发布

今天你四百冷了吗

最新推荐文章于 2024-06-16 18:09:06 发布

阅读量343

点赞数

文章标签： javascript 前端 html

本文链接：https://blog.csdn.net/weixin_48931100/article/details/126253628

版权

提示：以下代码均是在node环境下运行

文章目录

什么是Javascript
js组成部分
js运行环境
js语言特点
使用方式
js注释
标识符规范
变量
- 声明变量
- - var声明提前
数据类型
操作符
类型转换
流程控制

什么是Javascript

在前端三大剑客中，js是最重要的一门语言，是一门轻量级脚本语言，使用户能够与网页、浏览器进行交互。

js组成部分

ECMAScript（js标准、制定了基础语法）
DOM（文档对象模型，与网页进行交互）
BOM（浏览器对象模型，与浏览器进行交互）

js运行环境

含有js解析器的浏览器中
node.js环境中

js语言特点

解释型语言
弱类型语言
js代码从上至下顺序执行
区分大小写

使用方式

写在head标签中，引用外部js文件
写在body所有html代码后面，使用script标签
区别：
①代码是从上至下顺序执行的，当执行到head标签中的js文件时，此时html结构并未执行完，js中的值会返回空值；
②在body后面执行js代码：这时已经执行完html结构，js中的值不会为空；
解决办法：
在js外部文件中：在所有js代码外边添加监听，表示当页面加载完之后再执行js代码

windows.onload = function(){
   
	// 这里放执行的代码
}

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <!-- 原生项目的开发模式 -->
  <!-- 引入css -->
  <!-- 引入js -->
  <script src="./01-main.js"></script>
  <!-- head标签内 编写或引入js代码 -->
  <script>
    // 编写js代码
      console.log(this);
  </script>
</head>
<body>
  <div></div>
  <!-- body标签内 编写或引入js代码 -->
  <script>
    // 编写js代码
    alert('Hello JS2')
  </script>
</body>
</html>

js注释

//
/* */

标识符规范

以字母、数字、下划线和美元符号$组成
不能以数字开头

变量

声明变量

使用var关键字声明变量，变量的类型在赋值结束时决定，可以进行多次声明赋值

//使用var声明变量并赋值
//声明变量的名称
var a;
//给变量赋值 变量的数据类型与赋值的类型决定
a = 3;
console.log(a);//3

var声明提前

console.log(a);//undefined
var a = 123
console.log(a);//123

代码实际如下：即为变量声明提前

var a; //声明提前
console.log(a);//undefined
a = 123
console.log(a);//123

数据类型

基本数据类型（简单数据类型）

String（字符串）

通过单引号或者双引号包裹的字符即为字符串
字符串的字符长度可以通过属性length获取

var str1 = '123'
var str2 = "hello"

Number（数字）

var num1 = 12
var num2 = 23.45
var num2 = 010;//8
var num3 = 0x10;//16

Boolean（布尔型）

只有两种值：true、false

var real = true
var fake = false

null

var a = null

undefined

声明但未赋值，值就是undefined

var a

symbol

var s = Symbol('我是独一无二的symbol')

引用数据类型（复杂数据类型）

Object（对象）

，用来保存多个数据的容器，由大括号包裹键值对组成

var obj = {
   
	name:'spylent',
	age:20
}

Array（数组）

数组是一个特殊的对象，包含了多个值，值与值之间使用逗号分隔开，所有的值通过中括号括起来。
值可以是任意类型

var arr =[1,2,'string',[12,2],true]

Function（函数）

函数中包含多条代码，通过（）执行函数实现功能

function fun(){
   
	console.log("我是一个函数")
}
fun()

基本数据类型与引用数据类型在内存的存储

在这里插入图片描述

undefined和null的关系

undefined派生于null

console.log(undefined == null)//true
// ==：等同的意思， 两边值类型不同的时候，要先进行类型转换为同一类型后，再比较值是否相等。

undefined指声明但未赋值
null指声明且赋值为null，表示空对象

类型判断

typeof

使用typeof判断数据类型：返回值是字符串
typeof能够准确判断 string、number、boolean、undefined、symbol、function
不能准确判断 null和Object、array和Object

typeof 123 //'number'
typeof 'str' //'string'
typeof true//'boolean'
typeof Symbol() //'symbol'
var a
typeof a//'undefined'
var fun = function(){
   }
typeof fun //'function'

typeof null //Object
typeof [] //Object

不能准确判断原因：
因为javascript历史遗留问题，js中判断类型是以二进制前三位数以此判断是什么类型，null、array的前三位二进制数与Object前三位二进制数都一致，所以不能准确判断；

isNaN

判断是否不是一个数字

var b = 10/'a'
console.log(isNaN(b))//true 不是一个数字

isFinite

判断是否是一个有效值
由于内存的限制，ECMAScript不能保存世界上所有的数值。果某次计算的结果超过了JavaScript数值范围，将会返回Infinity(正无穷)或者-Infinity(负无穷)；

var a = 9/0;   // Infinity
Number.MIN_VALUE    5e-324
Number.MAX_VALUE   1.7976931348623157e+308

操作符

算数运算符

进行数据运算时，除'+'外，其他运算符可以自动将字符串数字隐形转成数字

var num1 = 2
var num2 = 8
console.log(num1 + num2)//10
console.log(num1 -

最低0.47元/天解锁文章