web 前端开发中必会 JavaScript 属性和常用方法经典版

Web前端入门到精通必会JS的属性和常用方法,应同学留言要求,今天抽时间整理总结了Web前端实际开发中必会的变量、基本数据类型、表达式与操作符、流程控制语句、数组,核心知识点与常用方法,用不到可以直接不用学了,省的浪费时间 !已经做成了网页版,方便查缺补漏,建立属于自己的知识库!

web前端开发中必会JavaScript属性和常用方法

 

对于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()

判断一个数组是否包含指定的值,返回布尔值

  • sort()

用于数组排序(涉及到函数知识,在函数一节再进行详细的讲解)

join()

将数组转成字符串

字符串的常用方法

单词

功能描述

split()

将字符串转成数组

最好的高效学习方法之一,就是要不断地实践+总结+分享,到最后能够融会贯通,运用自如 ,一起加油 !

关注我下篇接着分享以下内容:

  1. JS函数(算法,递归与克隆,作用域和闭包)
  2. DOM(节点操作,事件,定时器,延时器,动画),BOM 相关
  3. 面向对象(上下文规则,构造函数与类,原型原型链,内置对象,设计模式)
  4. 正则表达式相关

【有关HTML/HTML5,CSS/CSS3的总结已经在往期的笔记中已发】

  • 赶紧收藏,头条超详细Web前端入门到精通必学的标签及属性大全
  • Web前端入门到精通必会的CSS样式和属性大全

宠粉福利 做我的粉丝我宠你这期的是JS的基础,下期笔记再总结 JS的高级部分的内容,一个个来梳理,喜欢记得点赞收藏关注了 ️️还需要总结什么?

留言就好 ^_^ 看还能挖出点啥干货不

内容来自:arry 老师博客【艾编程博客】www.arryblog.com 还有更多教程以及新手 30 天免费训练营学习!

posted @ 2022-05-27 11:40  艾编程前端技术  阅读(278)  评论(0编辑  收藏  举报
友情链接: arry老师博客 艾编程教育 艾编程教育 关于我们 web前端学习路线 vscode视频教程全集