JavaScript—基础Day1

青青子77z

已于 2022-08-21 11:24:21 修改

阅读量226

点赞数 3

分类专栏： JavaScript基础文章标签： javascript 前端 html

于 2022-08-21 11:21:36 首次发布

本文链接：https://blog.csdn.net/weixin_48898881/article/details/126448824

版权

JavaScript基础专栏收录该内容

3 篇文章 0 订阅

订阅专栏

JavaScript—基础Day1

一、JavaScript介绍

1. 输入和输出语法

1.1 输出语法：
alert() 函数来弹出提示框；

alert() 中只能输出文本内容，但不能理解为innerText
全称： **window.**alert() ，属于BOM
confirm() 函数来弹出一个对话框；
如果点击“确定”按钮，那么 confirm() 函数会返回布尔值 true；如果点击“取消”按钮，那么 confirm() 函数会返回布尔值 false；

全称： **window.**confirm() ，属于BOM
<script type="text/javascript">
        var res = window.confirm("这里是要显示的内容");
        if(res == true){
            alert("你点击了“确定”按钮");
        }else{
            alert("你点击了“取消”按钮");
        }
</script>
document.write() 方法将内容写入到 HTML 文档中；

可以向 HTML 文档中写入 HTML 或者 JavaScript 代码

innerHTML 将内容写入到 HTML 标签中；

innerHTML 是一个属性;
通过它可以设置或者获取指定 HTML 标签中的内容;

console.log() 在浏览器的控制台输出内容;

可以是字符串或者对象类型;
属于DOM
1.2 输入语句

prompt()方法，会弹出一个允许输入值的对话框，提供了确定和取消两个按钮，提供预期输入值；
comfirm()方法，弹出一个确认消息对话框，可以获取true或false值。

2. 字面量

**在计算机科学中，**字面量（literal）是在计算机中描述事/物;

除去表达式，给变量赋值时，等号右边都可以认为是字面量。

字面量分为字符串字面量、数组字面量和对象字面量，函数字面量;
let test="hello world!";
"hello world!"就是字符串字面量,test是变量名;

二、变量

1. 变量定义

变量是计算机存储数据的“容器”;

2. 变量本质

**内存：**计算机中存储数据的地方，相当于一个空间
**变量本质：**是程序在内存中申请的一块用来存放数据的小空间

3. JS变量提升

JavaScript中奇怪的一点是你可以在变量和函数声明之前使用它们。就好像是变量声明和函数声明被**提升**了代码的顶部一样。

JavaScript是单线程语言，所以是按顺序执行。是一段一段地分析执行，先进行编译阶段然后是执行阶段；

在编译阶段阶段，代码真正执行前的几毫秒，会检测到所有的变量和函数声明，所有这些函数和变量声明都被添加到名为Lexical Environment（词法环境）的JavaScript数据结构的内存中。所以，使得这些变量和函数能在它们真正被声明之前使用。

3.1 函数提升

sayHi() // Hi there!
function sayHi() {
    console.log('Hi there!')
}

因为函数声明在编译阶段会被添加到词法环境中，当JavaScript引擎遇到sayHi()函数时，它会从词法环境中找到这个函数并执行它。

3.2 var变量提升

console.log(name)   // 'undefined'
var name = 'John Doe'
console.log(name)   // John Doe

当JavaScript在编译阶段会找到var关键字声明的变量会添加到词法环境中，并初始化一个值undefined，在之后执行代码到赋值语句时，会把值赋值到这个变量。

事实上所有的声明（function, var, let, const, class）都会被“提升”。但是只有使用var关键字声明的变量才会被初始化undefined值，而let和const声明的变量则不会被初始化值。
在执行阶段，JavaScript引擎在遇到他们赋值时，他们才会被初始化。这意味着在JavaScript引擎在声明变量之前，无法访问该变量，无法访问变量创建和初始化之间的时间跨度。
如果在let和const变量被声明的地方还找不到值的话，就会被赋值为undefined或者返回一个错误(const的情况下)。

4. var，let，const三者的特点和区别

1. var

用var声明的变量既是全局变量也是顶层变量（在浏览器环境顶层对象指的是window对象）
存在变量提升；
一个变量可多次声明，后面的声明会覆盖前面的声明；
在函数中使用var声明变量的时候，该变量是局部的；而如果在函数内不使用var，该变量是全局的；

2. let

不存在变量提升，let声明变量前，该变量不能使用；
let命令所在的代码块内有效，在块级作用域内有效；
let不允许在相同作用域中重复声明，注意是相同作用域，不同作用域有重复声明不会报错；

3. const

const声明一个只读的变量，声明后，值就不能改变；
const必须初始化；
const并不是变量的值不能改动，而是变量指向的内存地址所保存的数据不得改动；

三、数据类型

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

在存储时变量中存储的是值本身
number 数字型 \ string 字符串型 \ boolean 布尔型 \ undefined 未定义型 \ null 空类型

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

在存储时变量中存储的是地址（引用），通过 new 关键字创建的对象（系统对象、自定义对象）
如 Object对象、Array对象、Date对象……；

3. JS堆栈

栈：由操作系统自动分配释放存放函数的参数值、局部变量的值等；

简单数据类型：值类型变量的数据直接存放在变量（栈空间）中

堆：存储复杂数据类型(对象)，由程序员分配释放，若程序员不释放，由垃圾回收机制回收；

复杂数据类型：引用类型变量（栈空间）里存放的是地址，真正的对象实例存放在堆空间中

4. undefined与null的区别

undefined代表未定义类型出现在只声明不赋值的变量默认就是undefined
null代表的就是空声明了变量并且赋值为空 一般作为后期给一个对象准备的初始值

5. JS弱类型语言

JS弱类型是指数据类型可以被忽略，一个变量可以赋不同数据类型的值。javascript是一种弱类型语言，它允许变量类型的隐式转换，允许强制类型转换等，如字符串和数值可以自动转化；

而强类型语言一般不允许这么做。

6. 模板字符串

document.write(`我今年${num}岁了`);

`` (反引号)
内容拼接变量时，用 ${ } 包住变量

7.typeof数据判断经典案例

let age = 19;
let str = '11';
  console.log(typeof str + age); //string19
  console.log(typeof age + str); // number11
  console.log(typeof(age + str)); // string
  console.log(typeof(age + +str)); // number

  console.log(age - str); // 8
  console.log(typeof(age - str)); // number
  console.log(typeof(str - age)); // number

四、类型转换

1. 隐式转换

+号两边只要有一个是字符串，都会把另外一个转成字符串
除了+以外的算术运算符，- * / 等都会把数据转成数字类型
+号作为正号解析可以转换成数字型
任何数据和字符串相加结果都是字符串

2. 显式转换

1. 转换为数字型

Number(数据)

如果字符串内容里有非数字，转换失败时结果为 NaN

但是！NaN是number类型的数据，代表非数字

parseInt(数据)

parseFloat(数据)

2. 转换为字符型

String(数据)
变量.toString(进制)