JavaScript
js基础知识
javascript组成:有三部分,ECMScript是js的标准,DOM文档对象模型,可以帮助我们去操作网页,BOM浏览器对象模型,可以让我们去操作浏览器。
js特点:
1.解释型语言,不用编译,直接运行
2.动态语言
3.基于原型的面向对象语言
4.js代码是从上往下一行一行执行的。
5.js是严格区分大小的
6.每个语句都以 ; 结尾【可以不写,但是浏览器会自动添加,要消耗一些资源,而且有时候浏览器可能会加错分号,一般要加上】
7.js会自动忽略代码中的空格和换行,我们可以利用这个来格式化代码,使之看起来比较好看。
js版的hello,world!
1.alert("Hello,world");//浏览器弹出警告框
2.document.write("Hello,world!");//向网页中写入内容
3.console.log("Hello,world!")//控制台打印内容
一般js代码都写在外部:
1.方便解耦
2.多次引用
3.利用浏览器的缓存机制。
注释:
1.单行注释 //注释内容
2.多行注释 /*注释内容*/
js标识符:
1.可以有字母,数字,下划线和美元符号
2.不能以数字开头,其他都可以
3.js的关键字或者保留字不能用作标识符
4.一般采用驼峰命名法【要保持好习惯】
5.js底层保存标识符时是采用Unicode编码,通常utf-8里面所有的内容都可以作为标识符,一般不建议用中文,难以阅读,还会出现其他的奇奇怪怪的问题
js中的数据类型
js中一共有六种数据类型:【前五种是基本数据类型,Object是引用数据类型】
1.String 字符串:使用 双引号 ,单引号 括起来,不能混着用,引号不能嵌套。双引号不能放在双引号里面,单引号不能放在单引号里面。
为了使用某些特殊符号时,在前面加上一个,表示就是一个转义字符。
\n 表示换行
\t 制表符
\\ 表示\
2.Number 数字
在js中,所有的数值都是Number类型,包括整数和浮点数(小数)。
Number.MAX_VALUE //最大整数【1,。7969e+308】
Numver.MIN_VALUE //最小整数【表示最小的正小数,5e-324,】
Infinity //是一个字面量【常量】,表示无穷大,类型是Number
-Infinity //表示负无穷,类型也是Number
NaN //表示 not a number,不是一个数字,类型也是Number,使用typeof检查类型都是number
var c=0.1+0.2;
document.write(c);
//0.30000000000000004
//【进行浮点运算后会得到不精确的结果,不要使用js进行精确度较高的运算】
3.Boolean 布尔值
布尔值只有两个值,true和false,主要用来逻辑判断
4.Null 空值
var c=null;//表示空值
document.write(typeof c)
//结果: object
5.Undefined 未定义
var c=undefined;//表示未定义
document.write(typeof c)
// undefined
6.Object 对象【有点像java中的对象】
js中一些特殊的函数
一些可以进行调试的函数:
typeof()
可以利用typeof()函数来分辨对应的变量的类型
var a=123;
console.log(a);
console.log(typeof(a));
强制类型转换【转为string类型,转为number类型】
其他数值类型转换为字符串
强制类型转换
将一个数据类型转化为其他的数据类型
将其他的数据转化为string类型:
方法1:
调用转换数据类型的toString()方法,改方法不会影响原变量
但是 null 和 undefined 没有toString() 方法
方法2:
调用String函数,不会改变原来的参数,
调用String()函数进行强制转换,对null和undefined也适用
var a=123;
a=String(a);
document.write(typeof a);
其他数值类型转化为Number
将其他的数据类型转换为Number
转换方式1:
使用Numer() 函数,不会改变原来的值
var c="123";
c=Number(c);
document.write(typeof c);
(1)如果是纯字符串,则直接将其转化为数字
(2)如果字符串有非数字内容,则转化为NaN
(3)如果字符串为一个空串或者是全部都是空格的字符串,则转化为0
(4)布尔类型的值,如果是true,则转化为1,否则为0
(6)null 转化为数字,结果为 0
(&)undefined 转化为NaN
转换方式2:
这种方式专门用来对付字符串
paseInt() //取出有效的数字,如果第一位不是数字,那么返回NaN。只会取出从第一位开始为数字的字符串,如果不是字符串,截止后,后面也就里面没有用了。
paseFloat()
js中表示其他进制的数字
/*
如果要表示十六进制的数字,则以 0x 开头;
如果要表示八进制的数字,则以 0 开头
如果要表示二进制的数字,则以 0b 开头【这个有些浏览器不适应】
*/
var a = 0x10;//十六进制数字
document.write(a+'<br/>');
var b = 070;//八进制数字
document.write(b+'<br/>');
var c=0b11111;//二进制数字,这个用法
document.write(c+'<br/>');
//这种方法不好,一些浏览器会解释成八进制的,一些浏览器会解释成10进制的
var d='070';
d=parseInt(d);
document.write(d+'<br>');
//推荐用这种
var e='070';
e=parseInt(e,10);//指定上面的数字是10进制形式的
document.write(e+'<br/>');
var f='070';
f=parseInt(f,8);//把上面的数字当做8进制的形式
document.write(f);
js基本算术运算符
算术运算符
当对非Number类型的值进行运算的时候,会将这些值转化为number类型的然后再进行运算(除了字符串)
任何值和NaN做运算时,结果都是NaN
+
可以对两个数字进行运算
对两个字符串进行相加,会拼接为一个字符串。
任何值和字符串做加法运算,都会先转化为字符串,然后再和字符串做拼接
可以利用这个特性,将数字加上一个空串,从而把数字转化为字符串
-
可以对两个数字做减法
减法中,会把所有的数据类型都转为Number类型
一个字符串, -0 *1 /1 都可以将字符串转化为数字类型
*
乘法,把所有数值类型都转为数字做计算
/
除法,把所有的数值类型都转化为数字做计算
%
取模,%取余数
js一元运算符
+ 正号不会对数字产生任何影响
- 负号可以对数字进行负号的取反
对于非Number类型的值
它会先转化为Number,然后再运算
可以对一个其他的数据类型转化为Number类型原理和 Number()函数一样
var a=1+2+3+4+"5";
document.write(a+'<br>');
var b="1"+2+3+4+5;
document.write(b);
/*105
12345*/
var a=1+2+3+4+"5";
document.write(a+'<br>');
var b= +"1"+2+3+4+5;//前面的加号把这个字符串转化为数字
document.write(b);
/*105
15*/
js中的特殊符号和自增自减符
js中也有 自增,自减的运算符。
js中三种逻辑运算符:
!非:对非布尔值进行取反,先转换为布尔值,然后再进行取反
想法:【我们可以利用两次取反将一个非布尔值转化为布尔值
&& 且:第一个值为true,会检查第二个,第一个为false,不会检查第二个。
特点:
如果两个值都为true,则返回后边的值
如果其中有false,则返回靠前的false。【遇到false就返回】
|| 或:如果第一个值为true,则不会检查第二个,如果第一个值为false,那么检查第二个。
**特点:
如果第一个值为true,则直接返回第一个值
如果第一个值为false,则返回第二个值
**
js的一些运算符
= += -= *= /= %= 跟java一致
> < >= <= 跟java一致
== != 跟java一致
可以通过 isNaN() 函数来检查该值是不是 NaN
三元运算符
js代码块
在一个大括号内包括的就是代码块【跟java也是有点像】,他们要么都执行,要么都不执行。代码块后面不用在写 ; 了,只具有分组的作用。代码块里面的内容在外面是完全可见的。
{
语句1;
语句2;
语句3;
}
prompt()函数
可以弹出一个提示框,该提示带有一个文本输入框
用户可以在其中输入一段内容,该函数需要一个字符串作为参数
该字符串可以是一段提示性的文字;
for switch case break cotinue while 这些跟java无异,不做笔记了
Object 类型【对象,跟java中的实体类和c语言的结构体有点像】
对象:一种复合的数据类型,在对象中可以存在不同数据类型的属性
对象的分类:
1.内建对象:又ES标准中定义的对象,在任何的ES是实现中都可以使用
比如:Math、String、Number、Boolean、Function、Object
2.宿主对象
由JS运行环境提供的对象,目前来讲主要指由浏览器提供的对象
比如 BOM、DOM、console、document
3.自建对象:自己创建定义的对象,
/*
在对象中保存的值称为属性
向对象中添加属性:
语法: 对象.属性名=属性值
* */
var obj = new Object();
obj.name="自渡";
obj.age=24;
obj.height=180;
/*
读取对象中的属性值
语法:
对象.属性名
如果读取对象中没有的属性,则返回undefined
* */
/*
修改对象的属性值
语法:对象.属性名=属性值
* */
/*
* 删除对象中的属性值
* delete.对象名.属性名
*/
console.log(obj.name);
自定义对象中,属性名不强制要求遵守标识符的规范【可以,但没必要】
js的属性值可以是任意类型的,也可以是一个对象
var a = new Object();
a.name="自渡";
a.age = 20;
a.height =180;
var b = new Object();
b.wegiht = 120;
a.test=b;
console.log(a);
in 运算符 可以检查某个对象中是否含有某个属性。
console.log("name" in a);//结果为true
console.log("sname" in a)//结果为false
基本数据类型和引用数据类型的区别
基本数据类型:String,Number,Undefined,Null,Boolean,Object
引用数据类型:Object
JS中的变量都是保存到栈内存中的
基本数据类型的值直接在栈内存中存储
值与值之间是独立存在的,修改一个变量不会影响其他的变量
var a=123;
var b=a;
console.log(a);
console.log(b);
//这里是b在内存中,把a的值直接复制一份赋给了b,互相独立
var obj=new Object();//看到了new 关键字,就会在内存中开辟一块空间来存放对象的数据
obj.name=123;
var obj2=obj;//此时,应该是如下图的情况
//所以当obj.name修改时,obj2.name也会被修改
obj2=null;//这个就不会影响obj1的值
对象字面量
var obj = new Object();
var obj1 = {};
console.log(obj);
console.log(obj1);
使用对象字面量,可以边创建对象边存放数据,对象字面量的属性名可以加引号【建议不加,但是使用一些奇怪的符号时,必须加 @ # 这些】
属性名和属性值之间用逗号分隔开
var obj = {
name:'自渡',
age:24,
height:170
};
console.log(obj.name);