Web前端入门到精通必会JS的属性和常用方法，应同学留言要求，今天抽时间整理总结了Web前端实际开发中必会的变量、基本数据类型、表达式与操作符、流程控制语句、数组，核心知识点与常用方法，用不到可以直接不用学了，省的浪费时间 ！已经做成了网页版，方便查缺补漏，建立属于自己的知识库！
对于web前端最难的JS部分，我们要做一次瘦身但又不失重点难点，不论是对于初学者还是已经工作的同学来说都能用得上，毕竟开发中不是时时刻刻都会用到所有的属性和方法，很容易就忘记了 ！记得收藏起来!!
总结：JS语法与变量、基本数据类型、表达式与操作符、流程控制语句、数组，核心知识点与常用方法，经典版
JavaScript书写位置
|
单词 |
功能描述 |
|
script |
将JavaScript代码写在html文件中，例如： <body> <script> //此处写JavaScript代码 </script> </body> |
|
引入.js格式的文件，例如： <script src="此处写js文件所在的路径"></script> |
输出语句
|
单词 |
功能描述 |
|
alert() |
弹出警告框 |
|
console.log() |
控制台输出 |
变量
|
单词 |
功能描述 |
|
var |
使用var可以声明变量，例如：var num = 1;表示声明一个名称为num，值为1的变量 变量的合法命名： 1、只能由数字、字母、下划线和$组成，但不能以数字开头 2、不建议使用关键字和保留字 3、严格区分大小写，A和a是两个不同的变量 |
检测数据类型
|
单词 |
功能描述 |
|
typeof |
检测值或者变量的数据类型 |
NaN相关知识
|
单词 |
功能描述 |
|
NaN |
表示非数字，是一个特殊的数值 |
|
isNaN() |
用来检测一个值是否为NaN ，是的话返回true，否则返回false |
数据类型
|
单词 |
功能描述 |
|
Number |
数值类型，所有的数字不分大小、不分正负、不分正负，都是数值类型 |
|
String |
字符串类型，使用双引号或者单引号包裹的值 |
|
Boolean |
布尔类型，true表示真，false表示假 |
|
Undefined |
1、变量没有赋值，默认为undefined 2、变量声明提升时，变量的值也为undefined undefined的类型也为undefined |
|
Null |
null表示空，用typeof检测null，结果为object |
字符串的常用属性
|
单词 |
功能描述 |
|
length |
表示字符串的长度 |
字符串的常用方法
|
单词 |
功能描述 |
|
charAt() |
获取指定位置的字符 |
|
substring() |
提取字符串中，介于两个指定下标之间的字符 |
|
substr() |
在字符串中指定的位置处，提取指定数目的字符 |
|
slice() |
提取字符串的某个部分，类似于substring() ，不同之处： 1、substring() 可以自动交换参数的位置，而slice()不行。 2、slice()的第一个参数可以是负数，而substring()不行 |
|
toUpperCase() |
把字符串转换为大写 |
|
toLowerCase() |
把字符串转换为小写 |
|
indexOf |
返回字符串中指定字符首次出现的索引 |
数据类型转换
|
单词 |
功能描述 |
|
Number() |
将其他类型的值转换为数字 |
|
parseInt() |
可以将参数转成整数 |
|
parseFloat() |
可以将参数转成浮点数 |
|
String() |
将其他类型的值转换成字符串，例如：String(123) |
|
toString() |
将其他类型的值转换成字符串，例如：(6).toString() 和String()的区别： 1、toString()无法转换null和undefined，String()可以转换null和undefined 2、toString()可增加进制参数，将字符串进行进制转换，String()不能转换进制 3、写法不同，可参考上述例子 |
|
Boolean() |
将其他类型的值转换为布尔值 |
window下的方法
|
单词 |
功能描述 |
|
prompt() |
弹出输入框 |
复杂数据类型
|
单词 |
功能描述 |
|
Array、Object、Function |
数组、对象、函数 |
算术运算符
|
单词 |
功能描述 |
|
+ |
加法运算符。加号有两种作用，分别是加法和连字符 1、加号两边的操作数都是数字，则为加法 2、有一个操作数为字符串，则为连字符 |
|
- |
减法运算符 |
|
* |
乘法运算符 |
|
/ |
除法运算符 |
|
% |
取余运算符。例如：a%b代表a除以b的余数，8 %5 = 3 |
Number下的方法
|
单词 |
功能描述 |
|
toFixed() |
指定小数点后面的位数 |
Math方法
|
单词 |
功能描述 |
|
Math.pow(x,y) |
返回x的y次幂（不常用，了解即可） |
|
Math.sqrt() |
返回一个数的平方根（不常用，了解即可） |
|
Math.ceil() |
向上取整 |
|
Math.floor() |
向下取整 |
关系运算符
|
单词 |
功能描述 |
|
> |
大于 |
|
< |
小于 |
|
>= |
大于等于 |
|
<= |
小于等于 |
|
== |
等于 |
|
!= |
不等于 |
|
=== |
全等于 |
|
!== |
不全等于 |
逻辑运算符
|
单词 |
功能描述 |
|
! |
非 |
|
&& |
与 |
|
|| |
或 |
赋值运算符
|
单词 |
功能描述 |
|
= |
赋值 |
|
+= |
快捷赋值，例如： a+=1等价与a=a+1 |
|
-= |
快捷赋值，例如： a-=1等价与a=a-1 |
|
*= |
快捷赋值，例如： a*=1等价与a=a*1 |
|
/= |
快捷赋值，例如： a/=1等价与a=a/1 |
|
%= |
快捷赋值，例如： a%=1等价与a=a%1 |
|
++ |
自增运算 ，例如： var num1 = 3; num1++ console.log(num1)//num的值为4 |
|
-- |
自减运算，例如： var num2 = 3; num2-- console.log(num2)//num2的值为2 |
条件语句
|
单词 |
功能描述 |
|
if |
当指定条件为 true 时，执行if语句对应的代码 |
|
if...else |
当条件为 true 时，执行if语句对应的代码 当条件为 false 时，执行else语句对应的代码 |
|
if...else if... |
满足条件时，执行它所对应的代码 |
|
case |
在switch中使用，表示要匹配的每一种情况 |
|
default |
在switch中使用，表示默认情况，当不满足所有的case条件时，会执行默认情况 |
|
switch |
根据不同的条件来执行不同的动作。示例： switch (month) { case 1: alert("这个月有31天") break; case 4: alert("这个月有30天") break; default: alert("请输入正确的月份！！") } |
|
boolean_expression ? true_value : false_value |
三元运算符，当条件表达式boolean_expression为真，执行表达式true_value，为假时执行表达式false_value |
循环语句
|
单词 |
功能描述 |
|
for |
循环执行一段代码 示例： for(var i = 0; i <10;i++) { console.log(i); } |
|
while |
条件为真时循环执行代码块 |
|
do-while |
while 循环的变体，语法： do{ 循环体 }while(循环执行条件) 注意事项： 1、do-while循环在检查条件之前一定会执行一次循环体 2、如果条件为真，就会继续执行循环体 3、如果条件为假，则会终止循环 |
break和continue语句
|
单词 |
功能描述 |
|
break |
用于退出循环 1、在switch中使用，用于跳出switch语句 2、在循环for、while中使用，直接跳出循环 |
|
continue |
跳出当前循环，继续执行下一次循环 |
数组的定义
|
单词 |
功能描述 |
|
Array |
数组， 用来存储一组值 |
|
new |
与Array结合使用，创建数组，示例：new Array() （new是JavaScript中的一个关键字，用来实例化对象的，后面的面向对象章节中会有详细的讲解，目前了解即可） |
数组类型的判断
|
单词 |
功能描述 |
|
Array.isArray() |
检测数据是否是一个数组，返回布尔值 |
数组常用的属性
|
单词 |
功能描述 |
|
length |
返回数组长度 |
数组的常用方法
|
单词 |
功能描述 |
|
push() |
在尾部插入新项 |
|
pop() |
删除数组的最后一项 |
|
unshift() |
在头部插入新项 |
|
shift() |
删除数组的第一项 |
|
splice() |
用于添加或删除数组的元素 |
|
slice() |
从已有的数组中返回选定的元素 |
|
concat() |
合并多个数组 |
|
reverse() |
颠倒数组中元素的顺序 |
|
indexOf() |
返回指定元素的索引值，如果不存在返回-1 |
|
includes() |
判断一个数组是否包含指定的值，返回布尔值 |
|
用于数组排序（涉及到函数知识，在函数一节再进行详细的讲解） |
|
join() |
将数组转成字符串 |
字符串的常用方法
|
单词 |
功能描述 |
|
split() |
将字符串转成数组 |
最好的高效学习方法之一，就是要不断地实践+总结+分享，到最后能够融会贯通，运用自如 ，一起加油 ！
关注我下篇接着分享以下内容：
- JS函数（算法，递归与克隆，作用域和闭包）
- DOM（节点操作，事件，定时器，延时器，动画），BOM 相关
- 面向对象（上下文规则，构造函数与类，原型原型链，内置对象，设计模式）
- 正则表达式相关
【有关HTML/HTML5，CSS/CSS3的总结已经在往期的笔记中已发】
- 赶紧收藏，头条超详细Web前端入门到精通必学的标签及属性大全
- Web前端入门到精通必会的CSS样式和属性大全
宠粉福利 做我的粉丝我宠你这期的是JS的基础，下期笔记再总结 JS的高级部分的内容，一个个来梳理，喜欢记得点赞收藏关注了 ️️还需要总结什么？
留言就好 ^_^ 看还能挖出点啥干货不
内容来自：arry 老师博客【艾编程博客】www.arryblog.com 还有更多教程以及新手 30 天免费训练营学习！