关键词：
目录
一、JavaScript简单入门
1.1.一门客户端脚本语言
运行在客户端浏览器中的。每一个浏览器都有JavaScript的解析引擎
脚本语言：不需要编译，直接就可以被浏览器解析执行了
功能：可以来增强用户和html页面的交互过程，可以来控制html元素，让页面有一些动态的效果，增强用户的体验
1.2.JavaScript发展史
1992年，Nombase公司，开发出第一门客户端脚本语言，专门用于表单的校验。命名为 ： C-- ，后来更名为：ScriptEase
1995年，Netscape(网景)公司，开发了一门客户端脚本语言：LiveScript。后来，请来SUN公司的专家，修改LiveScript，命名为JavaScript
1996年，微软抄袭JavaScript开发出JScript语言
1997年，ECMA(欧洲计算机制造商协会)，制定出客户端脚本语言的标准：ECMAScript，就是统一了所有客户端脚本语言的编码方式。
JavaScript = ECMAScript + JavaScript自己特有的东西(BOM+DOM)
1.3.JavaScript优势
a.解释性语言
b.基于对象
c.事件驱动
d.弱类型
e.安全性高
f.跨平台
1.4.JavaScript引用
如需在 HTML 页面中插入 JavaScript，请使用 <script> 标签。
<script> 和 </script> 会告诉 JavaScript 在何处开始和结束。
<script> 和 </script> 之间的代码行包含了 JavaScript
<script type="text/javascript" src="$request.contextPath/static/js/homepage.js"></script>
1.5.JavaScript输出的几种方式
window.alert()
document.write()
innerHTML
console.log()
就个人使用来看 console.log()在编程中使用是较多切方便的 直接F12控制台即可查看输出内容
1.6.JavaScript有哪些关键字
1.7.JavaScript注释
// 这是代码：单句注释，在编辑器一般是ctrl + L键。
/* 这是代码 */：多行注释，在编辑器一般是ctrl + shift + L键。
1.8.JavaScript常见标识符有哪些
1.9.JavaScript常见HTML事件有哪些
1.10.JavaScript常见运算符
1.11.JavaScript常见赋值运算符
1.12.JavaScript常见比较运算符
1.13.JavaScript常见逻辑运算符
二、细讲JavaScript基础语法
2.1.变量
2.1.1.定义一个变量
// 声明一个变量名为test的变量。
var test;
var age, name, sex;//声明age、name、sex三个变量
//同时声明变量并赋值
var age = 10, name = "小强", sex = "1";
2.1.2.变量命名规则及规范
1、由字母、数字、下划线、💲符号组成，不能以数字开头
2、不能使用关键字，例如：while
3、区分大小写
规范：约定俗成的写法
1、变量名要有意义.
2、遵守驼峰命名法，驼峰命名法：首字母小写，后面单词首字母大写，例如userName.
2.2.数据类型
其中数据类型有:Number类型、String类型、Boolean类型、Undefined类型、Null类型、Object类型
2.2.1.Number
Number数字类型：包含整数和小数
可以表示：十进制、八进制、十六进制
如:
var num = 10; //十进制
var num1 = 012; //八进制
var num2 = ox123; //十六进制
数值范围:
console.log(Number.MAX_VALUE); //最大值 值为5e-324
console.log(Number.MIN_VALUE); // 最小值 值为1.7976931348623157e+308
无穷大：Infinity
无穷小：-Infinity
数值判断不可以用小数验证小数以及不要用NaN验证是不是NaN (NaN----not a number) 但是可以用isNaN— is not a number结果是不是NaN
如:
var num; //声明一个变量，未赋值
console.log(isNaN(num)); // true 不是一个数字吗？ 结果是true
2.2.2.String
字符串转义符:
| 转义序列 | 字符 |
|---|---|
| \\b | 退格 |
| \\f | 走纸换页 |
| \\n | 换行 |
| \\r | 回车 |
| \\t | 横向跳格(Ctrl-I) |
| \\‘ | 单引号 |
| \\“ | 双引号 |
| \\ | 双斜杠 |
eg:
var str = "iam a pm\\\\"
console.log(str); // iam a pm\\
字符串拼接:
var str1 = "先生";
var str2 = "您好";
console.log(str1+str2); // 先生您好
若是字符串和数字拼接 结果也是字符串 拼接效果如上所示
2.2.3.Boolean
布尔类型的话两个属性 true/false
2.2.4.Undefined
undefined表示一个声明了没有赋值的变量，变量只声明的时候值默认是undefined
如:
var num;
console.log(num); // undefined
2.2.5.Null
Null表示一个空，变量的值如果想为null，必须手动设置
2.2.6.Object
2.3.数据类型的转换
2.3.1.转换成数值类型
(1)、Number()可以把任意值转换成数值，如果要转换的字符串中有一个不是数值的字符，返回NaN
如：
var num1 = Number("10");
console.log(num1); // 10
var num2 = Number('10adbdn');
console.log(num2); //NaN
var num3 = Number("10.78");
console.log(num3); //10.78
var num4 = Number('10.65dd');
console.log(num4); //NaN
var num5 = Number("a10");
console.log(num5); //NaN
(2)、parseInt()转整数
如：
var num1 = parseInt("10");
console.log(num1); // 10
var num2 = parseInt('10adbdn');
console.log(num2); //10
var num3 = parseInt("10.78");
console.log(num3); //10
var num4 = parseInt('10.65dd');
console.log(num4); //10
var num5 =parseInt("a10");
console.log(num5); //NaN
(3)、parseFloat()转小数
如：
var num1 = parseFloat("10");
console.log(num1); // 10
var num2 = parseFloat('10adbdn');
console.log(num2); //10
var num3 = parseFloat("10.78");
console.log(num3); //10
var num4 = parseFloat('10.65dd');
console.log(num4); //10
var num5 = parseFloat("a10");
console.log(num5);
(4)、Number()、parseInt()、parseFloat()三者的区别
Number()要比parseInt()和parseFloat()严格.
parseInt()和parseFloat()相似，parseFloat会解析第一个. 遇到第二个.或者非数字结束
2.3.2.转换成字符串类型
(1)、toString()
如：
var num = 10;
console.log(num.toString()); // 字符串 10
(2)、String()
如：
var num1 =5;
console.log(String(num1)); // 字符串 5
(2)、JSON.stringfy()
2.3.3.转换成布尔类型
0、空字符串、null 、undefined 、NaN 会转换成false 其它都会转换成true
如:
var num1 = Boolean(0);
console.log(num1); // false
var num2 = Boolean("");
console.log(num2); // false
var num3 = Boolean(null);
console.log(num3); // false
var num4 = Boolean(undefined);
console.log(num4); // false
var num5 = 10;
var num6;
console.log(Boolean(num5+num6)); // false
2.4.运算符
运算符种类：算数运算符、复合运算符、关系运算符、逻辑运算符
(1)、算数运算符：“+”“-”“*”“/”“%”
算数运算表达式：由算数运算符连接起来的表达式 复合运
(2)、复合运算符：“+=”“-=”“*=”“/=”“%=”
复合运算运算表达式：由复合运算符连接起来的表达式
(3)、关系运算符：“>”“<”“>=”“<=”“”“=”“!=”“!==”
关系运算表达式：由关系运算符连接起来的表达式
(4)、逻辑运算符：“&&”“||”“！”
逻辑运算表达式：由逻辑运算符连接起来的表达式
表达式1 && 表达式2
如果有一个为false,整个的结果就是false
表达式1 || 表达式2
如果有一个为true,整个的结果就是false
! 表达式
表达式的结果是true,整个的结果为false
表达式的结果是false,整个的结果为true
2.5.运算符的优先级
由高到低:
() 优先级最高
一元运算符 ++ – !
算数运算符 先* / % 后 + -
关系运算符 > >= < <=
相等运算符 == != === !==
逻辑运算符 先&& 后||
赋值运算符
2.6.函数
2.6.1.简介
JavaScript中的函数就是对象。对象是“名/值”对的集合并拥有一个连到原型对象的隐藏连接。对象字面量产生的对象连接到Object.prototype。函数对象连接到Function.prototype（该原型对象本身连接到Object.prototype）。每个函数在创建时会附加两个隐藏属性：函数的上下文和实现函数行为的代码
2.6.2.函数使用
function functionname()
这里是要执行的代码
语法:
圆括号可包括由逗号分隔的参数：
(参数 1, 参数 2, …)
由函数执行的代码被放置在花括号中：
function name(参数 1, 参数 2, 参数 3)
要执行的代码
函数参数（Function parameters）是在函数定义中所列的名称。
函数参数（Function arguments）是当调用函数时由函数接收的真实的值
函数的调用:
//此处创建一个函数sum
function sum(num1, num2)
var result = num1 + num2;
console.log("num1 + num2 = " + result);
// 函数调用
sum(10, 20);
立即执行函数:
$(function()
//不只有函数 所有变量输出等等在这里写都是页面加载直接运行
sum()
)
2.7.JavaScript正则表达式
2.7.1.创建正则表达式
字面量。语法：Reg = /pattern/modifiers; 字面量的正则由两个正斜杆组成//，第一个正斜杆后面写规则：/pattern[规则可以写各式各样的元字符|量词|字集|断言…]。第二个正斜杆后面写标识符/modifiers[g全局匹配 | i忽略大小写 | m换行匹配 | ^起始位置 | $结束位置] 标识符。
var Reg = /box/gi;
构造函数。语法 Reg = new RegExp( pattern , modifiers ); pattern ，modifiers此时是字符串。何种方法创建都是一样的，pattern 模式 模板，要匹配的内容，modifiers 修饰符。
var Reg = new RegExp("box","gi");
2.7.2.String中正则表达式方法
| 方法 | 描述 |
|---|---|
| String.match(Reg) | 返回RegExp匹配的包含全部字符串的数组或null |
| String.search(Reg) | 返回RegExp匹配字符串首次出现的位置 |
| String.replace(Reg, newStr) | 用newStr替换RegExp匹配结果，并返回新字符串 |
| String.split(Reg) | 返回字符串按指定RegExp拆分的数组 |
var str = 'a1b2c3a4a5',
reg = /a/g;
console.log(str.match(reg)); //["a", "a", "a"]
var str = 'a1b2c3a4a5',
reg = /a/;
console.log(str.search(reg)); //0
var str = 'a1b2c3a4a5',
reg = /a/g;
console.log(str.replace(reg,function()
console.log(arguments);
return 5555;
));
var str = 'a,b,c,d',
reg = /,/g;
//console.log(str.split(',')); //["a", "b", "c", "d"]
console.log(str.split(reg)) //["a", "b", "c", "d"]
2.7.3.RegExp对象的方法
| 方法 | 描述 |
|---|---|
| RegExp.exec(String) | 在字符串中执行匹配搜索，返回首次匹配结果数组 |
| RegExp.test(String) | 在字符串中测试模式匹配，返回true或false |
2.7.4.修饰符
修饰符也称作标识符，可指定匹配的模式，修饰符用于执行区分大小写和全局匹配。
i忽略大小写匹配。
g全局匹配，没有g只匹配第一个元素，就不在进行匹配。
m执行多行匹配
var patt = /pattern/i; //忽略大小写匹配
var patt = /pattern/g; //全局匹配
var patt = /pattern/m; //执行多行匹配
2.7.5.元字符
在正则表达式中具有特殊意义的专用字符。
特殊的转译字符. \\ /。
. 单个任意字符，除了换行符\\n与制表符\\r
\\ 转义字符，将具有特殊意义的符号转义成普通符号: \\.
\\d 数字[0~9]
\\D 非数字
\\s 空格
\\S 非空格
\\w 字符[字母|数字|下划线]
\\W 非字符
\\b 单词边界( 除了 （字)字母 数字_ 都算单词边界)
\\B 非单词边界
var reg = /\\./;//匹配.
var reg = /\\\\/;//匹配\\
var reg = /\\//;//匹配/
var str = '\\\\';
var reg = /\\\\/g;
console.log(reg.test(str)); //true
2.8.JavaScript常用对象
2.8.1.Date对象
Date对象是一个有关日期和时间的对象。它具有动态性，必须试用new关键字创建一个实例，如：
var Mydata=new Date（）；
Date对象没有提供直接访问的属性，只有获取和设置日期的方法，如下表
2.8.2.String对象
String对象是JavaScript提供的字符串处理对象，创建对象实例后才能引用，它提供了对字符串进行处理的属性和方法（类似java一样）具体如下表：
属性 length —返回字符串中字符的个数。
注意：一个汉字也是一个字符！！
2.8.3.Math对象
属性:
Math对象方法:
三角函数（sin(), cos(), tan(),asin(), acos(), atan(), atan2()）是以弧度返回值的。可以通过除法Math.PI / 180把弧度转换为角度，也可以通过其他方法来转换。
| 方法 | 说明 |
|---|---|
| Math.abs(x) | 返回x的绝对值. |
| Math.acos(x) | 返回x的反余弦值. |
| Math.acosh(x) | 返回x的反双曲余弦值. |
| Math.asin(x) | 返回x的反正弦值. |
| Math.asinh(x) | 返回x的反双曲正弦值. |
| Math.atan(x) | 以介于 -PI/2 与 PI/2 弧度之间的数值来返回 x 的反正切值. |
| Math.atanh(x) | 返回 x 的反双曲正切值. |
| Math.atan2(x, y) | 返回 y/x 的反正切值. |
| Math.cbrt(x) | 返回x的立方根. |
| Math.ceil(x) | 返回x向上取整后的值. |
| Math.clz32(x) | Returns the number of leading zeroes of a 32-bit integer. |
| Math.cos(x) | 返回x的余弦值. |
| Math.cosh(x) | 返回x的双曲余弦值. |
| Math.exp(x) | 返回 Ex, 当x为参数, E 是欧拉常数 (2.718…), 自然对数的底. |
| Math.expm1(x) | 返回 exp(x)-1 的值. |
| Math.floor(x) | 返回小于x的最大整数。 |
| Math.fround(x) | Returns the nearest single precision float representation of a number. |
| Math.hypot([x[,y[,…]]]) | Returns the square root of the sum of squares of its arguments. |
| Math.imul(x) | Returns the result of a 32-bit integer multiplication. |
| Math.log(x) | Returns the natural logarithm (loge, also ln) of a number. |
| Math.log1p(x) | Returns the natural logarithm of 1 + x (loge, also ln) of a number. |
| Math.log10(x) | Returns the base 10 logarithm of x. |
| Math.log2(x) | Returns the base 2 logarithm of x. |
| Math.max([x[,y[,…]]]) | 返回0个到多个数值中最大值. |
| Math.min([x[,y[,…]]]) | 返回0个到多个数值中最小值. |
| Math.pow(x,y) | 返回x的y次幂. |
| Math.random() | 返回0到1之间的伪随机数. 可能等于0，但是一定小于1 |
| Math.round(x) | 返回四舍五入后的整数.但是Math.round(-4.40)值为-4 |
| Math.sign(x) | 返回x的符号函数, 判定x是正数,负数还是0. |
| Math.sin(x) | 返回正弦值. |
| Math.sinh(x) | 返回x的双曲正弦值. |
| Math.sqrt(x) | 返回x的平方根. |
| Math.tan(x) | 返回x的正切值. |
| Math.tanh(x) | 返回x的双曲正切值. |
| Math.toSource() | 返回字符串 “Math”. |
| Math.trunc(x) | 返回x的整数部分,去除小数. |
例子1:写一个函数，返回从min到max之间的随机整数，包括min不包括max
function getRandomArbitrary(min, max)
return min + Math.random() * (max - min);
例子2:写一个函数，生成一个长度为 n 的随机字符串，字符串字符的取值范围包括0到9，a到 z，A到Z
function getRandomInt(min, max)
return min + Math.floor(Math.random() * (max - min + 1));
function randomStr(n)
var dict = '1234567890abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ';
var str = '';
for(i = 0; i < n;i++)
str += dict[getRandomInt(0,62)];
return str;
var str = getRandStr(10);
console.log(str);
2.8.4.数组对象
数组的分类**
1、二维数组，二维数组的本质是数组中的元素又是数组。
var arr = [[1,2],[a,b]];
alert(arr[1][0]); //a 第2列第1行所在的元素
2、稀疏数组
稀疏数组是包含从0开始的不连续索引的数组。在稀疏数组中一般length属性值比实际元素个数大（不常见）
举例
var a=["a",,"b",,,,"c",,];
数组对象属性
| 属性 | 作用 |
|---|---|
| length 属性 | 表示数组的长度，即其中元素的个数 |
| prototype 属性 | 返回对象类型原型的引用 |
| constructor 属性 | 表示创建对象的函数 |
1.length属性:
alert(arr.length); //显示数组的长度10
arr.length=15; //增大数组的长度,length属性是可变的
alert(arr.length); //显示数组的长度已经变为15
2.prototype 属性
prototype 属性返回对象类型原型的引用。prototype 属性是object共有的。
objectName.prototype
objectName 参数是object对象的名称。
说明：用 prototype 属性提供对象的类的一组基本功能。 对象的新实例“继承”赋予该对象原型的操作。
对于数组对象，用以下例子说明prototype 属性的用途。
给数组对象添加返回数组中最大元素值的方法。要完成这一点，声明一个函数，将它加入 Array.prototype， 并使用它。
function array_max( )
var i, max = this[0];
for (i = 1; i < this.length; i++)
if (max < this[i])
max = this[i];
return max;
Array.prototype.max = array_max;
var x = new Array(1, 2, 3, 4, 5, 6);
var y = x.max( );
3.constructor 属性
constructor 属性表示创建对象的函数。
object.constructor //object是对象或函数的名称。
说明&#x熬夜爆肝！c++核心进阶知识点汇总整理万字干货预警建议收藏(代码片段)
...+基础入门知识点，没看过的可以看看喔！熬夜爆肝！C++基础入门大合集【万字干货预警建议收藏】今天继续整 查看详情
深夜爆肝：万字长文3种语言实现huffman树（强烈建议三连）(代码片段)
...示Huffman树4.输入任意一组数据，完成构造Huffman树三、JavaScript语言不爱听了1.JavaScript下Huffman类的设计2.把权重数据显示在一个表格里3.为表格添加命令 查看详情
深夜爆肝：万字长文3种语言实现huffman树（强烈建议三连）(代码片段)
...示Huffman树4.输入任意一组数据，完成构造Huffman树三、JavaScript语言不爱听了1.JavaScript下Huffman类的设计2.把权重数据显示在一个表格里3.为表格添加命令 查看详情
万字长文超硬核详细学习系列——深入浅出linux基础篇的知识点，值得你收藏学习必备(代码片段)
茫茫人海千千万万，感谢这一秒你看到这里。希望我的文章对你的有所帮助！愿你在未来的日子，保持热爱，奔赴山海！Linux基础篇目录1.Linux系统介绍1.1linux的概述1.2linux的优势1.3linux的分类1.4常见的发行版linux... 查看详情
万字长文超硬核详细学习系列——深入浅出linux高级篇的知识点，值得你收藏学习必备(代码片段)
茫茫人海千千万万，感谢这一秒你看到这里。希望我的文章对你的有所帮助！愿你在未来的日子，保持热爱，奔赴山海！Linux高级篇目录1.Linux的用户管理1.1添加用户1.2删除用户1.3查询用户信息1.4切换用户1.5对... 查看详情
爆肝了13万字后，又录了169集配套保姆级c语言视频！（建议收藏）
...WebApp开发有着独到的见解和深入的研究,除此之外还精通JavaScript、AngularJS、NodeJS、Ajax、jQuery、Cordova、ReactNa 查看详情
爆肝了13万字后，又录了169集配套保姆级c语言视频！（建议收藏）
...WebApp开发有着独到的见解和深入的研究,除此之外还精通JavaScript、AngularJS、NodeJS、Ajax、jQuery、Cordova、ReactNa 查看详情
❤万字长文js全网最细笔记①（全网最强，建议收藏）❤(代码片段)
...aoLin。遇事先百度，学习关注我，今天我们来学学JavaScript一、编程语言1.1、编程 编程本质上就是让计算机为解决某个问题而使用某种程序设计语言编写程序代码，并最终得到结果的过程。 计算机程序就是... 查看详情
javascript保姆级教程———重难点详细解析（万字长文，建议收藏）(代码片段)
JavaScript保姆级教程———重难点详细解析（建议收藏）1.JS函数2.JS事件3.JavaScript对象4.JavaScriptprototype（原型对象）5.call和apply及bind三者的区别（面试重点）6.Javascript的事件流模型（面试重点）7.防抖... 查看详情
收藏|五万字长文总结c/c++(代码片段)
...程序员链接：https://github.com/huihut/interview这是一篇五万字的C/C++知识点总结，长文预警。能滑到留 查看详情
熬夜爆肝万字c#基础入门大总结建议收藏(代码片段)
往期文章分享点击跳转=>熬夜再战Android从青铜到王者-UI组件快速搭建App界面点击跳转=>熬夜再战Android从青铜到王者-几个适配方案点击跳转=>熬夜再战Android从青铜到王者-开发效率插件篇点击跳转=>Unity粒子特... 查看详情
❤万字长文js全网最细笔记2️⃣（全网最强，建议收藏）❤(代码片段)
...aoLin。遇事先百度，学习关注我，今天我们来学学JavaScript💦往期回顾女朋友七夕节鸽我只为偷偷在家准备秋招简历？我一怒之下手把手教她写满分简历秋招提前批专场面试官：没了解过索引的原则，回去... 查看详情
golang✔️实战✔️10种加密方法实现☢️万字长文建议手收藏☢️(代码片段)
【Golang】✔️实战✔️10种加密方法实现☢️万字长文建议手收藏☢️概述md5SHA-2sha256sha512计算文件哈希base64AESDESDES3DESRSA函数详解GenerateKey()MarshalPKCS1PrivateKey()pem编码生成公钥私钥实现加密概述今天来带大家实现以下最常用的10中... 查看详情
golang✔️实战✔️10种加密方法实现☢️万字长文建议手收藏☢️(代码片段)
【Golang】✔️实战✔️10种加密方法实现☢️万字长文建议手收藏☢️概述md5SHA-2sha256sha512计算文件哈希base64AESDESDES3DESRSA函数详解GenerateKey()MarshalPKCS1PrivateKey()pem编码生成公钥私钥实现加密概述今天来带大家实现以下最常用的10中... 查看详情
❤️熬夜爆肝3万字！史上最硬核的linux命令大全，还不收藏？❤️通俗易懂，小白一看就会(代码片段)
目录🌲前言🏆命令汇总🍇文件管理1️⃣ls命令–显示指定工作目录下的内容及属性信息2️⃣cp命令–复制文件或目录3️⃣mkdir命令–创建目录4️⃣mv命令–移动或改名文件5️⃣pwd命令–显示当前路径🍉文档编... 查看详情
❤️熬夜爆肝3万字！史上最硬核的linux命令大全，还不收藏？❤️通俗易懂，小白一看就会(代码片段)
目录🌲前言🏆命令汇总🍇文件管理1️⃣ls命令–显示指定工作目录下的内容及属性信息2️⃣cp命令–复制文件或目录3️⃣mkdir命令–创建目录4️⃣mv命令–移动或改名文件5️⃣pwd命令–显示当前路径🍉文档编... 查看详情
万字长文！全网最全最细mysqlsql语句大全（建议收藏）
关注我，每天分享软件测试技术干货、面试经验，想要领取测试资料、进入软件测试学习交流群的可以直接加群644956177~~这篇文章主要向大家介绍MySQLsql语句大全,主要内容包括基础应用、实用技巧、原理机制等方面，... 查看详情
一文终结mysql（万字长文，建议收藏）(代码片段)
MySQL架构MySQL可分为Server和存储引擎两部分，如图1所示。Server层：包括客户端连接器、查询缓存、解析/预处理器、优化器、执行器等，以及MySQL内置函数和所有跨引擎的功能都在这一层实现，比如存储过程、触发... 查看详情