当前位置 博文首页 > mdxiaohu的博客：web前端开发（三）—JavaScript基础
目录
一、JS简介
二、JS变量
三、JS数据类型(弱类型)
四、字符串常用方法
五、数组常用方法
六、条件判断
七、循环语句
八、函数
九、浏览器对象
JavaScript 是属于网络的脚本语言！
JavaScript 被数百万计的网页用来改进设计、验证表单、检测浏览器、创建cookies，以及更多的应用。
JS代码写在HTML的script标签内。
?
??JS变量用于存储程序所需要的数据。
??语法： var 变量名 = 变量值； 例： var age = 18;? var name = “田轩”；
变量名是大小写英文、数字、$和_的组合，且不能用数字开头。变量名也不能是JavaScript的关键字，如if、while等。
声明一个变量用var语句。
使用等号=对变量进行赋值。
?
??变量可以存储的数据有不同的类型，JS将数据划分为以下类型：
??1.数值类型
??JavaScript不区分整数和浮点数，统一用Number表示，其值可以是任意数值、NaN、Infinity;
??2.字符串
字符串是以单引号'或双引号"括起来的任意文本，比如'abc'，"xyz"等等
3.布尔类型
布尔值和布尔代数的表示完全一致，一个布尔值只有true、false两种值，要么是true，要么是false，可以直接用true、false表示布尔值，也可以通过布尔运算计算出来。
4.数组
数组是一组按顺序排列的集合，集合的每个值称为元素。JavaScript的数组可以包括任意数据类型。
例如：[1,2,’3’,’田轩’,true]
数组的元素可以通过索引来访问。请注意，索引的起始值为0.
var arr = [1, 2, 3.14, 'Hello', null, true];
arr[0]; // 返回索引为0的元素，即1
arr[5]; // 返回索引为5的元素，即true
arr[6]; // 索引超出了范围，返回undefined
?
5.对象
JavaScript的对象是一组由键-值组成的无序集合，例如：
var person = {
??? name: 'Bob',
??? age: 20,
??? tags: ['js', 'web', 'mobile'],
??? city: 'Beijing',
??? hasCar: true,
??? zipcode: null
};
JavaScript对象的键都是字符串类型，值可以是任意数据类型。上述person对象一共定义了6个键值对，其中每个键又称为对象的属性，例如，person的name属性为'Bob'，zipcode属性为null。
要获取一个对象的属性，我们用对象变量.属性名的方式：
person.name; // 'Bob'
person.zipcode; // null
?
两个特殊的值
null和undefined
null表示一个“空”的值，它和0以及空字符串''不同，0是一个数值，''表示长度为0的字符串，而null表示“空”。
null表示一个空的值，而undefined表示值未定义。事实证明，这并没有什么卵用，区分两者的意义不大。大多数情况下，我们都应该用null。undefined仅仅在判断函数参数是否传递的情况下有用
?
数值操作
??算术运算符：+? -? *? /? %? ++ --
??比较运算符： > 、>=、 <、<=、 == 、!=
??逻辑运算符： &&?? ||? ！
??三目运算符： a > b ? a : b;
?
?? 字符串长度： length
??? ?截取字符串：substring(0,3);
??? ?查找字符串中是否包含某字符：indexOf(“abc”)；
?
??? 数组长度：length
??? 拼接数组：concat([1,2,3]);
??? 数组拼接字符串：join();
??向数组尾部追加数据： pop()
?
JavaScript使用if () { ... } else { ... }来进行条件判断。
1.if ???如果 就
??? var age = 10;
??? if(age >= 18) {
??? ?????? console.log(‘可以进入网吧’);
}
2. if … else 如果 否则
? var name = ‘童季帆’;
??if(name != ‘童季帆’){
??? ?????? console.log(‘放过’);
} else {
??? ?????? console.log(‘抓捕’);
}
3. if …else if … else ?多层判断
如：
小明身高1.75，体重80.5kg。请根据BMI公式（体重除以身高的平方）帮小明计算他的BMI指数，并根据BMI指数：
?
低于18.5：过轻
18.5-25：正常
25-28：过重
28-32：肥胖
高于32：严重肥胖
?
要计算1+2+3，我们可以直接写表达式；
var sum = 1 + 2 + 3 … + 100;
如果累加到10000呢？
为了让计算机能计算成千上万次的重复运算，我们就需要循环语句。
JavaScript的循环有两种，一种是for循环，通过初始条件、结束条件和递增条件来循环执行语句块：
var sum= 0;
for (var i=1; i<=10000; i++) {
??? sum = sum + i;
}
?
1.定义函数
在JavaScript中，定义函数的方式如下：
function abs(x) {
??? if (x >= 0) {
??????? return x;
??? } else {
??????? return -x;
??? }
}
上述abs()函数的定义如下：
?
function指出这是一个函数定义；
abs是函数的名称；
(x)括号内列出函数的参数，多个参数以,分隔；
{ ... }之间的代码是函数体，可以包含若干语句，甚至可以没有任何语句。
请注意，函数体内部的语句在执行时，一旦执行到return时，函数就执行完毕，并将结果返回。因此，函数内部通过条件判断和循环可以实现非常复杂的逻辑。
如果没有return语句，函数执行完毕后也会返回结果，只是结果为undefined。
?
2.调用函数
调用函数时，在函数名称后加上一对小括号，并按顺序传入参数即可；
abs(-1);
?
练习
定义一个计算圆面积的函数area_of_circle()，它有两个参数：
r: 表示圆的半径；
pi: 表示π的值，如果不传，则默认3.14
?
?1.window
? indow对象有innerWidth和innerHeight属性，可以获取浏览器窗口的内部宽度和高度。内部宽高是指除去菜单栏、工具栏、边框等占位元素后，用于显示网页的净宽高。
?2.location
location对象表示当前页面的URL信息。
location.protocol; // 'http'
location.host; // 'www.example.com'
location.port; // '8080'
location.pathname; // '/path/index.html'
location.search; // '?a=1&b=2'
location.hash; // 'TOP'
要加载一个新页面，可以调用location.assign()。如果要重新加载当前页面，调用location.reload()方法非常方便。
