网页前端培训(JavaScript)
2022/2/11 22:13:25
本文主要是介绍网页前端培训(JavaScript),对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!
1.JavaScript学习的内容
2.JavaScript简介
2.1简介:
2.2组成:
3.JS基本用法
基本使用:
JS的三种使用方式
1.行内JS
在html标签上直接写js代码
2.内部JS
在script标签中写js代码,script标签可以放在head中或者body中(建议放在body标签最后)
3.外部JS
定义JS文件,通过script标签的src属性引入对应的JS文件
注:如果script标签设置了src属性,则在script双标签之间的JS代码不会生效
JS的基础语法
语句:
1.JS代码一行为单位,代码从上往下执行,一行一条语句
2.语句不加分号结尾,如果一行定义多条语句,每句语句必须以分号结尾。(建议都加分号)
3.表达式不需要以分号结尾,如果加了文化则JavaScript引擎会当做语法执行,生成无用的语句
注释:
//单行注释
/* 多行注释 */
标识符:
规则:
由Unicode字母、_、数字组成、中文组成
(1)不能以数字开头
(2)不能是关键字和保留字
(3)严格区分大小写
规范:
(1)见名知意
(2)驼峰命名或下划线规则
关键字(保留字):
声明变量时,不要使用关键字
变量:
JS是一种弱类型语言,在声明变量时不炫耀指明数据类型,直接用var修饰符进行声明
注:也可以不用var修饰符,直接声明并赋值
变量的声明:
1.先声明在赋值
2.声明并赋值
变量的注意点:
1.如果变量只声明而未赋值,则显示undefined
2.如果变量为声明就使用,则会报错
3.可以使用var同时定义多个变量
4.如果重新声明一个已存在的变量,则无效
5.如果重新声明一个已存在的变量并赋值,则会覆盖
6.JS是一种动态的弱类型语言,可以声明任意数据类型的变量
*变量名提升:
JavaScript引擎的工作方式是先解析代码,获取所有被声明的变量,然后再一行行地运行。
这造成的结果就是,所有的变量的声明语句,都会被提升到代码的头部,这就叫做变量名提升
注:变量名提升只对var命令声明的变量有效,如果变量不是用var声明的,就不会发送变量名提升
数据类型:
定义函数使用function
调用方法:方法名(【参数】)
数据类型
JS是弱类型语言,变量没有数据类型,数据有类型
undefined
值不存在
出现的情况:
1.变量只声明未赋值,值为undefined
2.当定义函数需要形参,调用函数未传递实参时,参数的值为undefined
3.当函数没有返回值,接收值为undefined
null类型
表示空值
注意点:
1.使用typeof操作符测试null返回object字符窜
typeof操作符:判断变量的类型
2.undefined派生自null,所以等值比较返回值是true。未初始化的变量和赋值为null
布尔类型
true和false
数值型
数值型包含两种数值:整型和浮点型
1.所以数字(整型和浮点型)都是以64位浮点数形式储存。
2.在储存数值型数据时自动将可以转换为整型的浮点数值转换为整型
字符窜
1.使用''或""引起来
2.可以使用"+"对字符窜进行拼接
对象类型
数组
var 数组名 = []
对象
var 对象名 = {}
函数
function 方法名(){
}
类型转换:
1.自动类型转换
1.转字符窜型:所有的值转字符窜都是加引号
2.转布尔型:有值为true,无值为false(0位false,非0位true)
3.转数值型:空值是0,非空的数值型字符窜能转换,非数值字符窜转换为NaN
2.函数转换
parseInt() 转整数型
parseFloat() 转浮点型
注:转换时会从值的第零个位置开始找有效数字,直到找到无效数字的位置
parseFloat在转换时会比parseInt多识别一个小数点
3.显示转换
toString() 将值转换成字符窜
toFixed() 保留指定小数位
注:值不能为null
JS为number、boolean、string对象提供了构造方法,用于强制转换数据类型,转换的是值的全部,不是部分
注:可以转换null值
代码:
<button onclick="alert('Hello World!')">按钮</button><br /> <!-- 内部JS --> <script type="text/javascript"> //alert("这是一个按钮!") </script> <!-- 引入外部JS文件 --> <script src="js/test.js" type="text/javascript" charset="UTF-8"></script> <script> //单行注释 /* 多行注释 */ console.log("hello"); console.log("haha"); </script> <script type="text/javascript"> /* 变量名提升 */ console.log(flag); console.log(name); /* 变量的声明 */ var a; a=1; console.log(a); var b=2; console.log(b); /* 变量的注意点 */ var c; console.log(c); // console.log(d); var aa,bb,cc=10; console.log(aa); console.log(bb); console.log(cc); var a; console.log(a); var a=10; console.log(a); var str="hello word"; var flag="true"; console.log(str); console.log(flag); console.log("true"); name = "zhangsan"; console.log(name); console.log(parseInt("123abc")); console.log(parseInt("abc123")); console.log(parseInt("123.4abc")); console.log(parseInt("123")); console.log("123"); var a=1; var b="2"; console.log(a+b); console.log(a+parseInt(b)); console.log(parseFloat("123abc")); console.log(parseFloat("abc123")); console.log(parseFloat("123.4abc")); console.log(parseFloat("123")); console.log(parseFloat("123.4.5")); console.log("============="); var aa=10; console.log(aa); console.log(aa.toString()); var bb=null; // console.log(bb.toString()); var cc=1.346; console.log(cc.toFixed(2)); var q= "1"; var w= "a"; var e="123abc"; var r = "123.4"; var t="123.4.5abc"; console.log(Number(q)); console.log(Number(w)); console.log(Number(e)); console.log(Number(r)); console.log(Number(t)); console.log(Boolean("a")); console.log(Boolean(0)); console.log(Boolean("1")); console.log(Boolean(null)); console.log(10); console.log(String(10)); console.log(null); console.log(String("null")); /* undefined */ var a; console.log(a); function fn01(str){ console.log(str); } fn01(); function fn02(){ console.log("fn02..."); } var b=fn02(); console.log(b); console.log("===========") /* null */ var num=1; var flag=true; var str= "hello"; console.log(typeof num) console.log(typeof flag) console.log(typeof str) var aa=null; console.log(typeof aa); console.log(undefined == null); var bb; var cc=null; console.log(bb == cc); console.log("===========") /* 数值型 */ console.log(1==1.0); var n=1+1.0; console.log(n); console.log(1.0); console.log("===========") /* 字符窜 */ var s1="hello"; var s2="world"; console.log(s1,s2); console.log(s1+s2); </script>
实例:
这篇关于网页前端培训(JavaScript)的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!
- 2024-10-01基于Python+Vue开发的医院门诊预约挂号系统
- 2024-10-01基于Python+Vue开发的旅游景区管理系统
- 2024-10-01RestfulAPI入门指南:打造简单易懂的API接口
- 2024-10-01初学者指南:了解和使用Server Action
- 2024-10-01Server Component入门指南:搭建与配置详解
- 2024-10-01React 中使用 useRequest 实现数据请求
- 2024-10-01使用 golang 将ETH账户的资产平均分散到其他账户
- 2024-10-01JWT用户校验课程:从入门到实践
- 2024-10-01Server Component课程入门指南
- 2024-09-30Dnd-Kit学习:新手快速入门指南