JavaScript | 易学教程

1.JavaScript历史

布兰登.艾奇在1995年利用10天完成JavaScript设计。最开始在网景工作，网景最初命名为LiveScript,后来在与Sun合作之后将其改名为JavaScript，因为sun公司的主打是java，所以为了蹭javascript的热度，但内部实现原理与Java不同。

2.JavaScript是什么

JavaScript是世界上最流行的语言之一，是一种运行在客户端（自己的电脑）的脚本语言（Script是脚本的意思）
脚本语言：不需要编译，运行过程中有js解释器(js引擎)逐行来进行解释并执行
现在也可以基于Node.js技术进行服务器端编程。

3.JS的用处

最开始的作用是表单动态验证，在没有JS之前，要经过后台验证表单，给服务器带来很大压力。
网页特效
服务端开发(Node.js)
桌面程序（Electron）
APP（Cordova）
控制硬件-物联网（Ruff）
游戏开发（cocos2d-js）

4.HTML/CSS/JS的关系

HTML决定看到什么
CSS决定好不好看
JS决定功能
在这里插入图片描述

5.浏览器执行JS简介

浏览器分成两部分渲染引擎和JS引擎
渲染引擎：用来解析HTML与CSS，俗称内核，比如chrome浏览器的blink，老版本的webkit
JS引擎：也称为JS解释器。用来读取网页中的JavaScript代码，对其处理后运行，比如chrome浏览器的V8

浏览器本身并不会执行JS代码，而是通过内置JS引擎（解释器）来执行JS代码。JS引擎执行代码时逐行解释每一句源码转化为二进制机器语言，然后由计算机去执行。

6.JS组成

ECMAScript DOM BOM
ECMAScript是由ECMA国际(原欧洲计算机制造商协会)进行标准化的一门编程语言，这种语言在万维网上应用广泛。
在这里插入图片描述
Jscript与JavaScript的本质是一样的。现在最流行的是JavaScript。ECMAScript规定了JS的编程语法和基础核心知识，是所有浏览器厂商共同遵循的一套JS语法工业标准。
DOM——文档对象模型，是由W3C组织推荐的处理看扩展标记语言的标准编程接口。通过DOM提供的接口可以对页面上的各种元素进行操作
BOM——浏览器对象模型

7.JS分类

行内式的js
内嵌式的js
外部js k

8.JS输入输出语句

alert(msg) 浏览器弹出警示框
console.log(msg) 浏览器控制台打印输出信息
prompt(info) 浏览器弹出输入框，用户可以输入

9.变量

变量概述
变量是程序在内存中申请的一块用来存放数据的空间
变量使用
变量在使用时分为两步：1.声明变量 2.赋值
声明变量：var age; var 是一个关键字，是variable变量的意思
语法扩展
更新变量，一个变量被重新赋值后，它原有的数据就会被替换。
命名规范
驼峰命名法。首字母小写，后面单子首字母大写
尽量不要使用name作为变量名，因为有的浏览器是有含义的
小结

数据类型

变量是用来存储值的所在处，他们有名字和数据类型。变量的数据类型决定 如何将代表这些值的位村存储到计算机的内存中。JS是一种**弱类型或者说动态语言**。这意味着不用提前声明变量的类型，在程序运行过程中，类型会被自动确定。
js是动态语言 变量的数据类型是可以变化的。

js的变量数据类型是只有程序在运行过程中，根据等号右边的值来确定的
JS把数据类型分为两类：简单数据类型(Number,String,Boolean,Undefined,Bull)；复杂数据类型(object)
在JS中八进制前面加0，十六进制前面加0x
数字型的特殊值
isNAN()用来判断非数字，并且返回一个值，如果是数字返回的是false 如果不是数字返回的是true。判断是否是非数字
String字符串型
只要是字符串类型一定要加引号，最好是单引号
字符串转义字符
都是用\开头但要写到引号里面
字符串长度
字符串是由若干字符组成的，这些字符的数量就是字符串的长度。通过字符串的length属性可以获取整个字符串的长度。
字符串拼接只要有字符串类型的和其他类型相拼接，最终的结果是字符串类型
数值想加，字符相连

变量和字符串相连的口诀

 // 变量不要写在字符串里面
        var age = 16;
        console.log('今年' + age + '岁');

布尔型

var flag = true;
        var flag1 = false;
        console.log(flag + 1);
        console.log(flag1 + 1);
        var str;
        console.log(str);
        var variable = undefined;
        console.log(variable + 'pink');

在这里插入图片描述
任何数据类型和字符串相连最后结果都是字符串
undefined 和数字想加最后的结果是NaN、null和数字想加最后的结果是数字。因为undefined是未定义的，null是空值。

typeof variable
prompt取过来的值是字符型的
字面量
是在源代码中一个固定值的表示法。
数字字面量、字符串字面量、布尔字面量
数据类型转化：
使用表单、prompt获取过来的数据默认是字符串类型的，此时就不能直接简单的进行加法运算，而需要转换变量的数据类型。通俗来说就是把一种数据类型的变量转换成另外一种数据类型。

 var num = 10;
        // 1.变量.toString
        var str = num.toString();
        console.log(typeof str);
        // 2.String(变量)
        console.log(String(num));
        // 3.利用加号品拼接字符串的方法,隐式转换
        console.log(num + '');

转换为数字型

大小写敏感

var age = prompt('请输入');
        // 1.parseInt(变量); 可以把字符型的转换为数字型 得到的是整数
        console.log(parseInt(age));
        console.log(parseInt('120px')); //120会去掉单位
        // 2.parseFloat(变量)
        console.log(parseFloat('3.14'));
        console.log(parseFloat('rem2.12px')); //NaN 从左开始往右检查，当碰到 r 时发现不是数字，直接输出NaN.

an 在这里插入图片描述
案例

 var age = prompt('请输入你的出生年份');
        console.log(age);
        var now = 2020 - parseInt(age);
        // alert(now);
        var now1 = 2020 - age;
        // alert(now1);
        var now2 = 2020 - Number(age);
        alert(now2);

案例2 两个数字相加

var num = prompt('第一个数字');
        var num2 = prompt('第二个数字');
        var total = parseFloat(num) + parseFloat(num2);
        var total2 = Number(num) + Number(num2);
        alert('您输入的数字是' + total2);

转换为布尔型
除了 ‘’,0,NanN,null,undefined之外都为true。
解释型语言、编译型语言
标示符、关键字、保留字

来源：CSDN

作者：Zmongo

链接：https://blog.csdn.net/Zmongo/article/details/104370216

标签

javascript