JS格式
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> <!--声称中文编码-->
<script type="text/javascript">
<!-- JS内容-->
</script>
<style type="text/css">
<!--定义CSS样式-->
</style>
<title>网站名称</title>
</head>
<body>
<!-- JS代码也可写到body中,但结构与行为耦合,不便于维护-->
网页内容
</body>
</html>
JS的要求
- 严格区分大小写
- 每条语句以分号(;)结尾
- 忽略空格和换行
外部JS文件(扩展名为js)
最好把JS代码单独写在一个文件中,然后通过script标签引入
这样可以实现不同的页面同时引用,也可以利用到浏览器的缓存机制
格式:
<script type="text/javascript" src="文件路径"></script>
可以引用若干个外部文件
特别的: 如果已经引用了外部的JS文件,则再写代码系统会自动忽略,如果需要添加一些代码,则可以再创建一个新的JS文件和引用script标签
输入输出
输入
prompt(""); // 弹出提示框
confirm(""); //弹出输入框,有确认和取消按钮
输出
console.log(""); //输出在控制台
document.write(""); //输出在页面
alert(); //消息弹出窗
运算符
左移运算符<<
相当于乘2
相当于乘2
a<<1 //相当于a/2
a<<2 //相当于a/4
右移运算符>>
相当于除2
a>>1 // 相当于a*2
a>>2 //相当于a*4
中括号运算符[]
<script>
var course = {
name : 'aaa',
key : 'bbb'
};
var name = 'key';
console.log(course.name); /* 输出 aaa
console.log(course[name]); bbb
console.log(course.key); */ bbb
</script>
三元运算符 ?:
a?b:c a为真时返回b的值,否则返回c的值
循环
for…in
语法格式:
for(objectProp in object)
objectProp:JS引擎在每次循环时自动设置objectProp为对象的属性值
object:可以是任意数据类型,主要是对象和数组
eg:
<script>
var array=[1,2,3,4,5];
for(var key in array)
{
console.log(key+' '+array[key]);
};
var animal = {
name : 'a',
id : 'b',
age : 10
};
for(var i in animal)
{
console.log(i+' '+animal[i]);
}
</script>
#arguments
arguments的介绍
JS中有个内置对象arguments,用于储存函数调用时的所有实参
arguments以伪数组的形式储存实参
伪数组的特点:
具有 length 属性
按索引方式储存数据
不具有数组的 push , pop 等方法
arguments的使用:
<script>
function getMax(a,b){
b == null ? a:b;
var max = arguments[0];
for(var i=0,length=arguments.length;i<length;i++){
if(arguments[i]>max)
max = arguments[i];
}
return max;
}
console.log(getMax(62));
console.log(getMax(62,80));
console.log(getMax(62,80,100));
</script>
说明:arguments,用于储存函数调用时的所有实参,我们在console.log里调用这个函数
实参中输入了62 80 100 ,这三个数进入arguments,然后因为形参就两个,所以截断了,只有62,80进入,所以这个实参数跟函数没关系,与arguments有关系,无论多少个实参都能进入arguments
进制转换
16进制
要以0x开头
如 a = 0x10;
//输出a = 16
8进制
八进制单词Octal
要以0o/0O开头
如:a = 0o10;
//输出 a = 8
2进制
要以0b开头
如:a=0b10;
//输出 a = 2
但部分浏览器不支持
进制的应用
a = "070";
a = parseInt(a); //不同的浏览器会解析成不同的答案,有的10进制有的8进制
a = "070";
a = parseInt(a,10); //a表示转换类型的参数,第二个参数表示要求转换为10进制
JS中的六种数据类型
- String 字符串 //推荐使用单引号 ‘ ’
- Number 数值 // 整数或浮点数
- Boolean 布尔值 // true false
- Null 空值 // 值只有 null
- Undefined 未定义 //声明变量但不赋值
- Object 对象
1-5是基本数据类型,6是引用数据类型
不要用JS进行对精确度要求高的运算,因为JS同大多语言一样对小数的运算是不正确的
有些字符比较特殊,例如: < >等等
可以用 \ 作为转义字符 ,例如:\"<" 或\'<'
JS中留有 \n换行 \t制表符
Number
最大值:Number.MAX_VALUE,这个值为:1.7976931348623157e+308
最小值:Number.MIN_VALUE,这个值为:5e-32
Infinity 代表无穷大,大于任何数值
-Infinity 代表无穷小,小于任何数值
NaN Not a number,代表一个非数值
String
字符串 + 任何类型= 拼接之后的新字符串
当出现引号嵌套时:外双内单,外单内双
声明变量
可以用关键字 var 来声明一个变量
<script type="text/javascript">
var a; //声明变量a
</script>
但是变量名不能与关键字和保留字符重名
命名通常用驼峰命名法
首字母小写,其后单词首字母大写其余小写,例如:helloWorld
检查变量类型
语法:
typeof 变量
#类型转换
类型转换1(强制转换)
转换成String类型:
方法一:
a = a.toString();
null和undefined不可以转换(这俩值没有toSring方法)。该方法不会影响原变量
方法二:
调用String函数
a = String(a);
null和undefined会转换为字符串
转换成Number类型
方法一:
调用Number函数
a = Number(a);
方法二:
字符串转换为整数/浮点数:
parseInt();
// 把字符串(中的有效整数)转换为整数
parseFloat();
// 把字符串(中的浮点数)转换为浮点数
如果对非String使用这个方法,它会先将其转换成String,然后再操作
转换成Boolean类型
方法一:
调用Boolean函数
a = Boolean(a);
数字 —> Boolean 除了0和NaN表示false,负数整数都是true
字符串 —>Boolean 除了空串(连空格都没有,只有引号),其余的都是true
null和undefined都会转换为false
对象会转换为true
方式二:
对任意的数据类型做两次非运算,即可将其转换为Boolean类型
如:
a = !!a;
类型转换2(隐式转换)(利用运算符)
字符串+字符串
字符串+字符串会进行拼串,如:"a" + "b" = "ab";
数+字符串
任何值+字符串都会先转换成字符串再进行拼串操作
即:值+字符串=字符串(String)
如:1+"ab" = "1ab";
11+"" = "11";
变量类型转换成String
非Number类型的值进行运算(-、/)
会将这些值转换成Number类型
任何值 运算符 NaN = NaN
就像数学中 1+正无穷=正无穷 一样
如:
true+false = 1;
d="123"
d = d-0; //d转换成Number类型
String类型的数字 —> Number类型的数字
例如:
a = "1"; //String
a = +a; // Number
或者 a = -a; // Number
引入JS文件
外部引入JS文件
<script src="JS文件地址"></script>
输出与交互
向控制台输出内容
console.log("内容")
相当于C的printf(“”)
控制台:在浏览器中按F12
弹出警告框
格式:
alert("内容")
弹出输入框
用户可以输入
格式:
prompt("内容")
向body中输出一个内容
格式:
document.write("内容")