认识js
☞ 概念
Js是一门运行在浏览器客户端的脚本编程语言。
-------------------------------------------------------------------------------------------------------------------
☞ 组成部分
◆ ecmascript js标准
◆ dom 通过js操作网页元素
◆ bom 通过调用api操作浏览器
-------------------------------------------------------------------------------------------------------------------
☞ 特点
◆ 简单易用
◆ 基于对象
编程中万事万物皆对象
相对的是:基于过程
◆ 解释执行(js属于解释执行的语言)
js源代码直接通过js引擎执行
编译执行:
Java,c# 源代码------->计算机可执行文件.dll------->计算机最后执行的是源代码的可执行文件.dll
-------------------------------------------------------------------------------------------------------------------
☞ 使用范围
◆ 表单验证
◆ 轮播特效
◆ 游戏开发
-------------------------------------------------------------------------------------------------------------------
JS书写位置
☞内嵌式写法
<span style="font-size:24px;"><head>
<meta charset="utf-8">
<script type="text/javascript"></span>
<span style="font-size:24px;"> js代码。。。。
</script>
</head></span>
☞ 外链式写法
外部js文件的引用:
<span style="font-size:24px;"><script type="text/javascript" scr="1.js"></script></span>
◆ 新建一个js文件
◆ 通过script标签中的src属性将外部js引入到html页面中
-------------------------------------------------------------------------------------------------------------------
☞ 补充内嵌式写法位置问题:
☞ 推荐将script标签放到body标签后面。
☞ 补充外链式写法问题:
☞ 推荐将多个js文件合并成一个js文件去加载。
-------------------------------------------------------------------------------------------------------------------
☞ js初体验
☞ 在页面中输入消息的几种方法
◆在页面中以弹窗的形式输出消息
alert(" ");
早期用来配合js代码调试
◆页面输出消息显示 确定和取消按钮
confirm("消息");
一般和条件判断配合使用
<span style="font-size:24px;">confirm("输入卡号");</span>
◆接收用户输入信息
prompt("信息");
<span style="font-size:24px;">prompt("填入相关消息");</span>
◆控制台显示消息的方式
console.log("你好");
<span style="font-size:24px;">console.log("你好");</span>
◆在页面中输出消息
document.write("大家<br>好");
该方法内部可以包含html标签。
<span style="font-size:24px;"> document.write("噢哈哈<br>哦啊哦哈");</span>
------------------------------------------------------------------------------------------------------------------
☞ 在写js代码过程中分号";"必须写。
------------------------------------------------------------------------------------------------------------------ ☞ 变量(重点)
☞ 变量
会变化的量。
变量就是用来装数据的容器。
------------------------------------------------------------------------------------------------------------------
☞ 变量的定义
通过var关键字定义变量
<span style="font-size:24px;">var username; //定义变量</span>
------------------------------------------------------------------------------------------------------------------
☞ 变量的赋值
通过赋值运算符“=”给变量赋值。
注意:如果想要判断两个数据是否相同,不能使用该运算符。
注意:如果定义了变量,将变量在页面中显示,不需要给变量添加引号。
<span style="font-size:24px;">username = "张三";//给变量赋值</span>
<span style="font-size:24px;">var username;//定义变量
username="李四";
var age=18;
alert("us<span style="font-family: Arial, Helvetica, sans-serif;">ername</span><span style="font-family: Arial, Helvetica, sans-serif;">"); </span><span style="font-family: Arial, Helvetica, sans-serif; color: rgb(204, 0, 0);">错误的写法</span></span><img alt="难过" src="http://static.blog.youkuaiyun.com/xheditor/xheditor_emot/default/sad.gif" style="font-family: Arial, Helvetica, sans-serif; background-color: rgb(255, 255, 255);" />
◆ 在js中是严格区分字母大小写。
◆ 变量名中不能有空格。
------------------------------------------------------------------------------------------------------------------
☞ 变量的命名规范
◆ 不能使用纯数字或者以数字开头定义变量
◆ 不推荐使用汉字定义变量
◆ 不能使用纯特殊字符或者以特殊字符开头("_"除外)定义变量。
◆ 不能使用关键字定义变量。
◆ 不能使用关键字定义变量。
◆ 不推荐使用保留字定义变量
------------------------------------------------------------------------------------------------------------------ ☞ 数据类型
------------------------------------------------------------------------------------------------------------------ ☞ 数据类型
☞ 简单数据类型
◆ number 数字类型
◆ string 字符串类型
◆ boolean 布尔类型
◆ undefined 变量未初始化
◆ null object
☞ 复杂数据类型
◆ object 对象
◆ array 数组
------------------------------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------------------------------
☞ 数字类型(number)
所有的数字赋值给变量,那么该变量的数据类型就是数字类型(number)
☞ 小数
☞ 负数
☞ 正数
数字类型的取值范围:
◆ 能表示
的最大值是±1.7976931348623157乘以10的308次方
☞ 数字类型的表示方式
能表示的最小值是±5乘以10的-324次方
◆ 十进制表示法
◆ 十六进制表示法
以0x开头 数字0-9和a(A)- f(F)
◆ 八进制表示法
以数字0开头 0-7之间的组合
<span style="font-size:24px;">var n1 = -123;
var n2 = 0xacf;
var n3 = 0075;</span>
------------------------------------------------------------------------------------------------------------------
☞ 字符串类型
◆ 所有用双引号或者单引号包含起来的都是字符串类型
◆ 转义字符
\" 转双引号
\' 转单引号
\r 回车
\n 换行
<span style="font-size:24px;">alert("中\'\'国");
alert("中\"\"国");</span>
------------------------------------------------------------------------------------------------------------------
☞ 布尔数据类型(boolean)
☞ true
☞ false
数据类型转换中: 数字1:代表true 数字0: 代表false
------------------------------------------------------------------------------------------------------------------
☞ 比较运算符
> < >= <=
比较运算符最后的结果为: true和false
------------------------------------------------------------------------------------------------------------------
☞ undefined 变量未初始化
定义了变量,但是没有给变量进行赋值。
------------------------------------------------------------------------------------------------------------------
☞ 变量取值为null的时候
◆ 该变量的引用为空。
var n1;//undefined
var n2=null;//object 内存中不存在该值
var n3="";//string 特殊的空,在内存中是存在的
------------------------------------------------------------------------------------------------------------------
☞ 数据类型的判断
typeof(变量)
数据类型判断
var n1=123;
var n2 = 0x0cf;
var n3 = 0047;
alert(typeof(n1));
------------------------------------------------------------------------------------------------------------------
☞ 运算符
+
-
*
/
% 取(获取余数)
() 优先级
------------------------------------------------------------------------------------------------------------------
☞ 加运算
◆ 两个数字类型变量相加,结果为数字类型
◆ 一个数字类型和一个字符串类型变量相加,最后结果为字符串,加好起的是一个连接的作用。
var n1 = 123;
var n2 = "123";
alert(typeof(n1+n2));
------------------------------------------------------------------------------------------------------------------
☞ 减运算
◆如果两个数字类型的变量相减,最后的结果为数字类型。
◆如果一个数字类型的变量和一个数字的字符串类型的变量相减,最后结果为数字类型。
var n1 = 123;
var n2 = "123";
alert(n1-n2);
alert(typeof(n1-n2));
NaN:not a number 不是一个数字
NaN的数据类型属于number类型。
◆如果一个数字类型的变量和一个非数字类型的变量相减,最后的结果为NaN。
------------------------------------------------------------------------------------------------------------------
☞ 除运算
◆如果两个数字类型的变量相除,最后结果为数字类型。
◆如果一个数字类型的变量和一个数字的字符串变量相除,最后结果为数字类型。
◆如果一个将数字0最为数字,得出的结果为infinity(无穷大)
infinity的数据类型属于number类型
------------------------------------------------------------------------------------------------------------------ ☞ 取余
获取最后结果的余数。
------------------------------------------------------------------------------------------------------------------
☞ 优先级()
有括号先计算括号里面的数据