本文介绍了编程语言的基本概念，包括编程、计算机语言、编程语言与标记语言的区别。深入讲解了JavaScript的性质、与HTML/CSS的关系以及在浏览器中的执行机制。同时，详细阐述了变量的使用、数据类型的分类及其转换，特别讨论了数字类型和字符串的特点。最后，概述了JavaScript的运算符，包括算数、比较、逻辑和赋值运算符。
目录：
一、编程语言
1.1.编程
编程：就是让计算机为了解决某个问题而使用某种程序设计语言编写程序代码，并最终得到结果的过程。
计算机程序：就是计算机所执行的一系列的指令集合，而程序全部都是用我们所掌握的语言来编写，所以人们要控制计算机一定要通过计算机语言向计算机发出命令。
注意：上面所定义的计算机指的是任何能够执行代码的设备，可能是智能手机、ATM、服务器等等。
1.2.计算机语言
计算机语言指用于人与计算机之间通讯的语言，它是人与计算机之间传递信息的媒介。
计算机语言的种类非常的多，总的来说可以分成机器语言、汇编语言和高级语言三大类。
实际上计算机最终所执行的都是机器语言，它是由"0"和"1"组成的二进制数，二进制是计算机语言的基础。
1.3.编程语言
可以通过类似于人类的语言的"语言"来控制计算机，让计算机为我们做事情，这样的语言就叫做编程语言(Programming Language)。
编程语言是用来控制计算机的一系列指令，它有固定的格式和词汇(不同编程语言的格式和词汇不一样)，必须遵守。
如今通用的编程语言有两种形式：汇编语言和高级语言。
汇编语言和机器语言实质是相同的，都是直接对硬件操作，只不过指令采用了英文缩写的标识符，容易识别和记忆。
高级语言主要是相对于低级语言而言，它并不是特指某一种具体的语言，而是包括了很多编程语言。
1.4.编程语言和标记语言区别
编程语言有很强的逻辑和行为能力。在编程语言里，你会看到很多if else、for、while等具有逻辑性和行为能力的指令，这是主动的。
标记语言(html)不用向计算机发出指令，常用于格式化和链接。标记语言的存在是用来被读取的，它是被动的。
1.5.总结
1. 计算机可以帮助人类解决某些问题
2. 程序员利用编程语言编写程序发出指令控制计算机来实现这些任务
3. 编程语言有机器语言、汇编语言、高级语言
4. 高级语言需要一个翻译器转换为计算机识别的机器语言
5. 编程语言是主动的有很强的逻辑性
二、计算机基础
2.1.计算机组成
硬件：
输入设备：鼠标、键盘、摄像头等
输出设备：显示器、打印机、投影仪等
CPU：负责处理数据与运算
硬盘/内存：负责存在数据，硬盘永久存储数据，内存暂时存储数据
软件：
系统软件：Windows、Linux、macOS
应用软件：浏览器、QQ、VSCode、word
2.2.数据存储
1. 计算机内部使用二进制0和1来表示数据。
2. 所有数据，包括文件、图片等最终都是以二进制数据(0和1)的形式存放在硬盘中的。
3. 所有程序，包括操作系统，本质都是各种数据，也以二进制数据的形式存放在硬盘中。
4. 硬盘、内存都是保存的二进制数据。
2.3.程序运行
1. 打开某个程序时，先从硬盘中把程序的代码加载到内存中。
2. CPU执行内存中的代码。
注意：之所以要内存的一个重要原因，是因为CPU运行太快，如果只从硬盘中读数据，会浪费CPU性能，所以，才使用存取速度更快的内存来保存运行时是数据。(内存是点，硬盘是机器)
三、初识JavaScript
3.1.JavaScript是什么
JavaScript是世界上最流行的语言之一，是一种运行在客户端的脚本语言(Script是脚本的意思)。
脚本语言：不需要编译，运行过程中由js解释器(js引擎)逐行来进行解释并执行。
现在也可以基于Node.js技术进行服务器端编程。
3.2.HTML/CSS/JS的关系
HTML/CSS标记语言--描述类语言
HTML决定网页的结构和内容，相当于人的身体。
CSS决定网页呈现给用户的模样，相当于给人穿衣服、化妆。
JS脚本语言--编程类语言
实现业务逻辑和页面控制(决定功能)，相当于人的各种动作。
3.3.浏览器执行JS简介
浏览器分成两部分：渲染引擎和JS引擎
渲染引擎：用来解析HTML与CSS，俗称内核，比如chrome浏览器的blink，老版本的webkit。
JS引擎：也成为JS解释器。用来读取网页中的JavaScript代码，对其处理后运行，比如chrome浏览器的V8.
浏览器本身并不会执行JS代码，而是通过内置JavaScript引擎(解释器)来执行JS代码。JS引擎执行代码时逐行解释每一句源码(转换为机器语言)，然后由计算机去执行，所以JavaScript语言归为脚本语言，会逐行解释执行。
3.4.JS的组成
1. ECMAScript是由ECMA国际(原欧洲计算机制造商协会)进行标准化的一门编程语言，这种语言在万维网上应用广泛，它往往被称为JavaScript或JScript，但实际上后两者是ECMAScript语言的实现和拓展。
ECMAScript：ECMAScript规定了JS的编程语法和基础核心知识，是所有浏览器厂商共同遵守的一套JS语法工业标准。
2. DOM--文档对象模型(Document Object Model，简称DOM)，是W3C组织推荐的处理可扩展标记语言的标准编程接口。通过DOM提供的接口可以对页面上的各种元素进行操作(大小、位置、颜色等)。
3. BOM--浏览器对象模型(Browser Object Model，简称BOM)是指浏览器对象模型，它提供了独立于内容的、可以与浏览器窗口进行互动的对象结构。通过BOM可以操作浏览器窗口，比如弹出框、控制浏览器跳转、获取分辨率等。
3.5.JS三种书写位置
<!-- 1.行内式的js 直接写到元素的内部 -->
<input type="button" value="唐伯虎" onclick="alert('秋香')">
<!-- 2.内嵌式的js -->
<script>alert('hello world!')</script>
<!-- 3.外部js script双标签 -->
<script src="myjs.js"></script>3.6.JS注释
// 1.单行注释
/* 2.多行注释 */3.7.JavaScript输入输出语句
// 1.警告框 常用于确保用户可以得到某些信息。
alert("sometext");
// 2.确认框 通常用于验证是否接受用户操作。
confirm("sometext");
// 3.提示框 经常用于提示用户在进入页面前输入某个值。
prompt("sometext", "defaultvalue");四、变量
4.1.变量概述
变量：是用于存放数据的容器。我们通过变量名获取数据，甚至数据可以修改。
本质：变量是程序在内存中申请的一块用来存放数据的空间。
4.2.变量的使用
// 1.声明变量
var age;
// 2.赋值 把值存入这个变量中
age = 100;
// 3.输出结果
console.log(age);
// 4.变量的初始化
var myname = '千岁忧';
console.log(myname);
// 5.变量案例
var Name = prompt("请输入您的名字：");
alert("您的名字叫：" + Name);4.3.变量的命名规范
1. 由字母(A-Za-z)、数字(0-9)、下划线(_)、美元符号($)组成，如：usrAge,num01,_name
2. 严格区分大小写，var app;和var App;是两个变量
3. 不能以数字开头，1age是错误的
4. 不能是关键字、保留字，例如：var,for,while
5. 变量名必须有意义
6. 遵守驼峰命名法，首字母小写，后面单词的首字母需要大写，myFirstName
4.4.变量小结
为什么需要变量？
因为我们一些数据需要保存，所以需要变量
变量是什么？
变量就是一个容器，用来存放数据的，方便我们以后使用里面的数据
变量的本质是什么？
变量是内存里的一块空间，用来存储数据
变量怎么使用的？
我们使用变量的时候，一定要声明变量，然后赋值
声明变量本质是去内存申请空间
什么是变量的初始化？
声明变量并赋值我们称之为变量的初始化
变量命名规范有那些？
由字母(A-Za-z)、数字(0-9)、下划线(_)、美元符号($)组成
五、数据类型
5.1.数据类型简介
变量是用来存储值的所在处，它们有名字和类型。变量的数据类型决定了如何将代表这些值的位存储到计算机的内存中。JavaScript是一种弱类型或者说动态语言。这意味着不用提前声明变量的类型，在程序运行过程中，类型会被自动确定。
var age = 10; // 这是一个数字型
var myname = '千岁忧'; // 这是一个字符串
在代码运行时，变量的数据类型是由JS引擎根据 = 右边变量值的数据类型来判断的，运行完毕之后，变量就确定了数据类型。
JavaScript拥有动态类型，同时也意味着相同的变量可用作不同的类型。
5.2.简单数据类型(基本数据类型)
Number：默认值0，数字型包含整形和浮点型值，如21、0.21。
Boolean：默认值false，布尔值类型，如true、false，等价于1和0。
String：默认值""，字符串类型，如"张三"，字符串都带引号。
Undefined：默认值undefined，var a;声明了变量a但是没有给值，此时a = undefined。
Null：默认值null，var a = null;声明了变量a为空值。
5.3.数字类型Number
5.3.1.数字型进制
var num = 10; // num数字型
var PI = 3.14; // PI数字型
// 1.八进制0-7 程序里面数字前面加0 表示八进制
var num1 = 010; // 8
console.log(num1); // 010八进制转换为10进制就是8
// 2.十六进制0-9 a-f 数字的前面加0x表示十六进制
var num2 = 0xa;
console.log(num2); // 10
// 3.二进制0-1 数字的前面加0b 表示二进制
var num3 = 0b1111;
console.log(num3); // 155.3.2.数字型最大/小值
// 1.数字型最大值
console.log(Number.MAX_VALUE); // 1.7976931348623157e+308
// 2.数字型最小值
console.log(Number.MIN_VALUE); // 5e-324
5.3.3.数字类型三个特殊值
console.log(Infinity); // Infinity，代表无穷大，大于任何数值
console.log(-Infinity); // -Infinity，代表无穷小，小于任何数值
console.log(NaN); // NaN，Not a number，代表一个非数值
5.3.4.isNaN()
isNaN()：用来判断一个变量是否为非数字的类型，返回true或者false。
var userAge = 21;
console.log(isNaN(userAge)); // false，21不是一个非数字
var userName = "千岁忧";
console.log(isNaN(userName)); // true，"千岁忧"是一个非数字
5.4.字符串型String
字符串型可以是引号中的任意文本，其语法为双引号""和单引号''
js可以用单引号嵌套双引号，或者用双引号嵌套单引号(外双内单，外单内双)
var strMsg1 = '对酒当歌'; // 使用单引号表示字符串
var strMsg2 = "人生几何"; // 使用双引号表示字符串
// 常见错误
var strMsg1 = 短歌行; // 报错，没使用引号，会被认为是js代码，但js没有这些语法
5.4.1.字符串转义符
类似HTML里面的特殊字符，字符串中也有特殊字符，我们称之为转义符。
转义符都是\开头的，常用的转义符及其说明如下：
转义符 解释说明 \n 换行符，n是newline的意思 \\ 斜杠\ \' '单引号 \" "双引号 \t tab缩进 \b 空格，b是blank的意思
5.4.2.字符串长度及拼接
// 1.检测获取字符串的长度length
var msg = 'my name is zs.';
console.log(msg.length); // 14
// 2.字符串的拼接 +，数值相加 字符相连
console.log('沙漠' + '骆驼'); // 字符串的 沙漠骆驼5.5.布尔型Boolean
布尔类型有两个值：true和false，其中true表示真(对)，而false表示假(错)。
typeof：可以用来获取检测变量的数据类型。
console.log(typeof msg); // string
5.6.数据类型转换
5.6.1.什么是数据类型转换
使用表单、prompt获取过来的数据默认是字符串类型的，此时就不能直接简单的进行加法运算，而需要转换变量的数据类型。通俗来说，就是把一种数据类型的变量转换成另外一种数据类型。
我们通常会实现3种方式的转换：转换为字符串类型、转换为数字型、转换为布尔型。
5.6.2.转换为字符串
// 1.把数字类型转换为字符串型 变量.toString()
var num = 10;
var str = num.toString();
console.log(str);
console.log(typeof str);
// 2.我们利用String()
console.log(String(num));
// 3.利用 + 拼接字符串的方法实现转换效果 隐式转换
console.log(num + '');5.6.3.转换为数字型
parseInt(string)函数：将string类型转换成整数数值型。
parseFloat(string)函数：将string类型转成浮点数数值型。
Number()强制转换函数：将string类型转换为数值型。
js隐式转换(- * /)：利用算数运算隐式转换为数值型。
5.6.4.转换为布尔型
Boolean()函数：其他类型转换成布尔值。
代表空、否定的值会被转换为false，如：''、0、NaN、null、undefined.
其余值都会被转换为true。
5.7.拓展
5.7.1.解释性语言和编译型语言
计算机不能直接理解任何除机器语言以外的语言，所以必须要把程序员所写的程序语言翻译成机器语言才能执行程序。程序语言翻译成机器语言的工具，被称为翻译器。
翻译器翻译的方式有两种：一个是编译，另外一个是解释。两种方式之间的区别在于翻译的时间点不同。
编译器是在代码执行之前进行编译，生成中间代码文件。
执行过程：
5.7.2.标识符、关键字、保留字
标识符：就是指开发人员为变量、属性、函数、参数取的名字。
标识符不能是关键字或保留字。
关键字：是指JS本身已经使用了的字，不能再用它们充当变量名、方法名。
保留字：实际上就是预留的"关键字"，意思是现在虽然还不是关键字，但是未来可能会成为关键字，同样不能使用它们当变量名或方法名。
六、JavaScript运算符
6.1.运算符
运算符(operator)也被称为操作符，是用于实现赋值、比较和执行算数运算等功能的符号。
JavaScript中常用的运算符有：算数运算符、递增和递减运算符、比较运算符、逻辑运算符、赋值运算符。
6.2.算数运算符
6.2.1.算数运算符概述
概念：算数运算符使用的符号，用于执行两个变量或值的算数运算。
运算符 描述 实例 + 加 10 + 20 = 30 - 减 10 - 20 = -10 * 乘 10 * 20 = 200 / 除 10 / 20 = 0.5 % 取余数(取模) 返回除法的余数9 % 2 = 1
6.2.2.浮点数的精度问题
浮点数值的最高精度是17位小数，但在进行算数计算时其精确度远远不如整数。
console.log(0.1 + 0.2); // 结果不是0.3，而是：0.30000000000000004
console.log(0.07 * 100); // 结果不是7，而是：7.000000000000001
所以：不要直接判断两个浮点数是否相等。
6.2.3.表达式和返回值
表达式：是由数字、运算符、变量等组成的式子。
表达式最终都会有一个结果，返回给我们，我们称为返回值。
6.3.递增和递减运算符
6.3.1.递增和递减运算符概述
如果需要反复给数字变量添加或减去1，可以使用递增(++)和递减(--)运算符来完成。
在JavaScript中，递增(++)和递减(--)既可以放在变量前面，也可以放在变量后面。放在变量前面时，我们可以称为前置递增(递减)运算符，放在变量后面时，我们可以称为后置递增(递减)运算符。
6.3.2.递增/递减运算符
++num前置递增，就是自加1，类似于num = num + 1，但是++num写起来更简单。
使用口诀：先自加，后返回值。
num++后置递增，就是自加1，类似于num = num + 1，但是num++写起来更简单。
使用口诀：先返回原值，后自加。
6.4.比较运算符
概念：比较运算符(关系运算符)是两个数据进行比较时所使用的运算符，比较运算后，会返回一个布尔值(true/false)作为比较运算的结果。
运算符名称 说明 案例 结果 < 小于号 1 < 2 true > 大于号 1 > 2 false >= 大于等于号 2 >= 2 true <= 小于等于号 3 <= 2 false == 判等号 37 == 37 true != 不等号 37 != 37 false === !== 全等要求值和数据类型都一致 37 === '37' false
6.5.逻辑运算符
6.5.1.逻辑运算符概述
概念：逻辑运算符是用来进行布尔值运算的运算符，其返回值也是布尔值。
逻辑与(&&)：两边都是true才返回true，否则返回false。
逻辑或(||)：两边都为false才返回false，否则都为true。
逻辑非(!)：也叫做取反符，用来取一个布尔值相反的值，如rue的相反值是false。
逻辑运算符 说明 案例 && "逻辑与"，简称"与" and true && false || "逻辑或"，简称"或" or true || false ! "逻辑非"，简称"非" not !true
6.5.2.断路运算(逻辑中断)
短路运算的原理：当有多个表达式(值)时，左边的表达式值可以确定结果时，就不再继续运算右边的表达式的值。
逻辑与：
语法：表达式1 && 表达式2
如果第一个表达式的值为真，则返回表达式2。
如果第一个表达式的值为假，则返回表达式1。
逻辑或：
语法：表达式1 || 表达式2
如果第一个表达式的值为真，则返回表达式1。
如果第一个表达式的值为假，则返回表达式2。
6.6.赋值运算符
概念：用来把数据赋值给变量的运算符。
赋值运算符 说明 案例 = 直接赋值 var age = 100; +=、-= 加、减一个数后在赋值 var age = 10; age += 5; // 15 *=、/=、%= 乘、除、取模后在赋值 var age = 2; age *= 5; // 10
6.7.运算符优先级
优先级 运算符 顺序 1 小括号 () 2 一元运算符 ++、--、！ 3 算数运算符 先*、/、%，后+、- 4 关系运算符 >、>=、<、<= 5 相等运算符 ==、!=、===、!== 6 逻辑运算符 先&&，后|| 7 赋值运算符 = 8 逗号运算符 ,
扫一扫
3011
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
