JavaScript基础(学习Java的第不知道多少天,初次前端JS接触)

1.JS概述

是一种解释性脚本语言(代码不进行预编译),由浏览器解释执行,用来向页面添加交互行为
1.JS三大组成部分
在这里插入图片描述JavaScript在互联网中的应用几乎无处不在,为了提升用户体验和数据的操作,常见的适用场景:
1.页面效果(用户体验)
2.表单验证
3.事件监听数据处理
4.页面跳转
5.局部刷新(ajax)

2.JS的三种方式

2.1.行内JS

语法:<a href="javascript:alert('点你就点你');">点我,点我...</a>

2.2.内部JS

语法:
<script type="text/javascript">
	JS代码
</script>
示例代码:
<script type="text/javascript">
	alert(“不点我也来”);
</script>

2.3.外部JS
可以写在页面内的任意位置:

引入外部JS文件:
<script type="text/javascript" src="JS文件位置"></script>

2.4.注意事项
1.script存放位置:除去title标签内部,页面任何位置都可以,但是你得明白,页面加载顺序,至上而下
(1)官方: 推荐head标签内部写js
(2)码农: body标签结束位置写js
2.引入js的script标签内部,不能再写js代码
3.script必须使用双标签
4.行内js标准写法

<!--写法1不推荐的原因,2.它会修改你当前url地址3.它会跳转到当前页面的最顶部-->
<a href="#" onclick="alert(1);">写法1</a>	
<!--href="javascript:void(0);":我当前a标签不再超链接到一个新的界面,而是作为JS触发源而存在;
javascript伪协议-->
<a href="javascript:void(0);" onclick="alert(2);">写法2</a>
<a href="javascript:;" onclick="alert(3);">写法3</a>

3.变量

var关键字,无论是何种数据类型的变量,均可以使用var关键字来进行声明;弱类型
3.1.语法
var 变量名; //声明变量【推荐方式】
var 变量名=值; //声明变量并赋值【推荐方式】
已声明赋值的变量 = 另一种类型值; //【不推荐】
不声明变量 = 值; //不事先声明变量直接使用
3.2.代码

var name=”字符串类型”;
console.debug(name);            //在控制台输出打印name变量
name = 19;
console.dubug(name);

/*不使用var关键字,直接写一个符合命名规范的名字作为变量使用*/
age = 18;
console.debug(age);

5.JavaScript运算符

在JS中同样存在算术运算符、等性运算符、逻辑运算符的操作,这些运算符的操作和JAVA一样,接下来我们演示与JAVA不一样的地方;
5.1.赋值运算符
在这里插入图片描述5.2.算术运算符
在这里插入图片描述

var x=3 + “3”;
console.debug(x);  //33

5.3.比较运算符(关系运算符)
1.比较运算符用于判断两个变量大小关系:>、<、、<=、>=、=、!=、!=,其中:
(1)
:代表相等(它只比较内容,不比较类型)
(2)=:绝对相等(先比较类型,再比较内容)
(3)!
:绝对不等
在这里插入图片描述5.4.逻辑运算符
&& :逻辑AND运算符,一假遍假
|| :逻辑OR运算符 ,一真遍真
! :逻辑NOT运算符,真为假,假为真

var x=0||1;
console.debug(x);  //1

6.JavaScript流程控制

JS中同Java一样存在流程控制语句,用法一样:
1.分支:
(1)if语句
(2)switch语句
2.循环:
(1)while语句
(2)do-while语句
(3)for循环
3.break/continue语句
4.三目表达式

7.JavaScript函数

7.1.语法

function 函数名( [参数列表] ){
JS代码
[return 返回值;]
}
function $action(){
	console.debug(“函数定义测试”);
	}
var x = $action();   //使用函数名完成函数调用,并定义一个变量接收返回值
console.debug(x);    //输出undefined,因为函数中并没有定义返回值

JS中函数的定义使用function关键字,这一点是和Java不一样的地方,同时允许函数具备返回值,返回值采用关键字return,如果函数没有定义返回值,接收到的将是一个undefined;
7.2.全局变量和局部变量

var msg="显示全局变量";
function show(){
	msg="隐式全局变量";
}
show();
console.debug(msg);  //隐式全局变量,需要先调用方法才能访问该变量

var msg2="全局变量";
function show2(){
	var msg2="局部变量";	
}
show2();
console.debug(msg2);//全局变量

7.3.匿名函数语法

function (参数列表){
	JS代码
	[return 返回值;]
}
var action = function(){
	console.debug(“前方高能,请非战斗人员迅速撤离”);
}
action();

8.JavaScript对象

8.1.本地对象
1.本地对象就是 ECMA-262 定义的类(引用类型),相当于Java中类的概念;
2.这些引用类型在运行过程中需要通过new来创建所需的实例;
3.包括: Object、Boolean、Number、Date、String、Array等,重点掌握Date、String和Array对象;
日期对象:Date
详情请见W3CSchool文档(API)

9.BOM

是browser object model的缩写,简称浏览器对象模型
在这里插入图片描述在这里插入图片描述9.1.window
在这里插入图片描述

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值