web基础day02

web基础day02

总体其实和java类似

javascript是一门基于对象的语言。
javascript是一门独立的语言。
javascript是一门脚本语言。脚本语言特点：直接解释执行。
javascript常用于浏览器端，在后台也有技术实现，Node.js

javascript概述 1.

javascript特点 2.

JavaScript不得不说的历史 3.

和JAVA的关系：语法十分相似，但其实毫无关系。
1995年5月，Netscape，LiveScript
1995年12月，改名为JavaScript
1996年8月，微软，Jscript
1997-1999年，ECMA，ECMAScript，基于已有的JavaScript和Jscript，提出了标准的Script语法规
则，JavaScript和Jscript都遵循这套标准。

alert(123)

在head标签中书写一个script子标签，在script起始标签身上添加src属性，指向
外部js文件。

第二种：引入外部js文件。

js语句是自上而下的解释执行。每次都会讲一句js语句放入浏览器中内置的js解析
器进行解释执行。

js语句可以不添加分号，如果不添加则会在解释过程中，由js解析器自动添
加。(推荐手动书写，避免不必要的错误。)

在引入script标签时，如果引入的是外部文件，script标签中间没有任何语句。这
时不能把script标签书写为自闭标签，如果改变为自闭标签则会导致js语句失效。

HTML引入js

分为两大类：基本数据类型和复杂数据类型
数值型Number 字符串型String 布尔型Boolean 未定义类型Undefined 空
类型Null
在js中数值型是一种基本数据类型，也是js的一个包装对象。其中包含属性
和方法。
属性：
数值型： i.
基本数据类型有5种： a.
js语法–数据类型 5.
javascript
2019年7月31日 9:01

//alert(Number.MAX_VALUE);
//alert(Number.MIN_VALUE);
console.log(Number.MAX_VALUE);
console.log(Number.MIN_VALUE);
console.log(Number.NEGATIVE_INFINITY);
console.log(Number.POSITIVE_INFINITY);
console.log(-Infinity);
console.log(Infinity);
console.log(NaN123);
console.log(NaN"abc");
console.log(NaNNaN);
console.log(isNaN(123));//false
console.log(isNaN(“abc”));//true
//Number数值型
NaN属性：表示一个非数字，本身和任何值都不相等包括它自己。
在js中String是一个基本数据类型，同时还是js的一个包装对象。
console.log(str.length);
console.log(str.charAt(0));
var str1 = “abc’efg’qwe’”;
console.log(str1.split("’"));
console.log(str.toUpperCase());
var str = “abcdefg”;
js中的String相关api和java相似。可以通过查看jsapi文档使用。
字符串类型 ii.
||
&&
|
&
!
在js中Boolean是一个基本数据类型，同时还是js的一个包装对象。在布尔
型中只包含两个值，分别为true和false。
console.log(true && false);//false
console.log(true | false);//1
console.log(true & false);//0
console.log(!true);//false
console.log(true || false);//true
布尔型Boolean iii.
var a;
console.log(a);//undefined
js中的一个基本数据类型，这个类型中只包含undefined这一个值。常用于
表示一个未被初始化的变量。
未定义类型Undefined iv.
js的一个基本数据类型，这个类型中只包含null这一个值。常用于表示一个
无效的值。多数用来作为返回值使用。
空类型Null v.
console.log(nullundefined);//判断的是两者的类型。js中认为两者类型相
同(js中认为null来自于undefined)
console.log(null === undefined);//判断的是两者的值，值必然不相等。
拓展： vi.
js语法–数据类型自动转换 b.

js在需要时会自动对类型进行转换，转换的规则：
数字 可以在需要时转换为对应的字符串形式。0会转换位false，其他数字会转换
为true.在需要对象时可以自动转换为Number对象。
字符串 可以在需要时转换为对应的数值，需要注意当数值和字符串进行加法运算
时，会处理为字符串的拼接，所以需要通过parseInt或parseFolat将字符串
强制转换为数值类型参与运算。非空字符串转换为ture，空字符串转换为
false。需要对象时自动转换为String对象
布尔类型 true转换为1，false转换位0.转换为字符串的"true"和"false".转换为
Boolean对象

对象类型 如果为null则转成字符串"null",如果为null转换为false
js语法–数据类型自动转换 b.

• 可以作为加法运算。可以作为与字符串的拼接运算

• 只能作为减法运算

• 运算过程中会保留浮点型数据
  / 运算过程中会保留浮点型数据
  小数运算结果为整数，会以整型的形式展示。
  注意：js中整型数据运算结果产生小数，会以小数的形式展示。
  2+3>5?“yes”:“no”
  三目运算符 i.
  var str = 123;
  console.log(typeof(str));//number
  var str1 = “abc”;
  console.log(typeof(str1)==“string”);//string
  var str2 = true;
  console.log(typeof(str2));
  typeof()判断当前变量的类型 ii.
  js语法–运算符 c.
  var i;
  var定义的变量为弱类型的变量，可以理解为是一种没有类型的类型。
  a = “abc”;
  a = true;
  a = new Object();
  console.log(a);
  var a = 0;
  定义变量的关键字 i.
  定义局部变量：var i=0;
  定义全局变量：i=0;
  var x = 1;
  }
  mx();
  console.log(x);
  //局部变量
  function mx(){
  局部变量和全局变量 ii.
  js语法–定义变量 d.

console.log(x);
//全局变量
x = 1;
function mx(){
}
mx();
console.log(x);
while
do while
for js没有增强for循环
----和java中的使用方式相同。
//js语句–if
var x = 2;
console.log(“yes”);
if(x =1){
console.log(“no”);
}else{
}
switch case
console.log(“yes”);
if(1 == x ){
console.log(“no”);
}else{
}

js中的if语句，判断结构中可以书写为x= 1这种形式，这种形式为赋值语句，执行赋值操作后才会进行判断。总结为先赋值，再判断。由于x被赋值为1，if判断的单独一个x，就相当于是if(x)，也就是if(1)，会得到true中的结果。

可以通过先书写常量，再书写变量的方法来避免上述错误。

js语法–语句 e.

函数 数组 对象

js函数是一段可执行js语句的合集。可以通过调用函数名加上一对小括号的
形式来执行js函数。js函数本质上是一段字符串。
1)
在js中，函数调用时，可以传入比参数列表更少的数据，未被传入值的参
数，将会以undefined为值来使用。
2)
在js中，函数调用时，可以传入比参数列表更多的数据，多余的数据未被
抛弃，在函数中内置的arguments属性会将用户传入的参数全部放在一个数
组中。可以通过循环遍历的方式来获取。
3)
函数中可以将函数名称当做参数来使用，传入方法的参数列表。在函数希
望使用的使用只需要在函数名后添加一对小括号即可。总结：函数传递，
可以通过变量(函数名)实现。函数调用就是在函数名后添加括号。
4)
Function类型是js中的内置的一个对象类型。 5)
js函数 i.

复杂数据类型

Function类型是js中的内置的一个对象类型。 5)
普通函数定义方式 a)
函数体
function mx(参数列表){
}
mx()
动态函数定义方式 b)
//在括号中的最后一个参数为函数体
//最后一个参数之前的所有参数都属于参数列表
var mx1 = new Function(“a”,“b”,“return a+b”);
console.log(mx1(1,2));//3
直接量定义函数(匿名函数) c)
return a+b;
var mx2 = function(a,b){
};
console.log(mx2(3,4));
函数的定义方式 6)
在js中数组本质是一段可执行的字符串。js数组是由一对中括号，其中包含
多个元素，元素之间用逗号隔开组成的数据。
1)
js数组特点:存储数据的类型是任意的.存储数据的长度是任意. 2)
//普通数组定义方式 a)
var arr = new Array();
arr[0] = 1;
arr[1] = “abc”;
console.log(arr);
//包含初始容量的数组定义方式 b)
var arr1 = new Array(3);
arr1[0] = “abc”;
arr1[1] = true;
arr1[2] = 1;
arr1[3] = 2;
arr1[99] = 3;
console.log(arr1);
//包含初始值的数组定义方式 c)
var arr2 = new Array(1,“abc”,false,new Object());
console.log(arr2);
/var arr3 = new Array(“A”);
console.log(arr3)/
//直接量定义数组（匿名数组） d)
var arr3 = [1,“abc”,true];
console.log(arr3);
var arr4 = [3];
console.log(arr4);
js数组的定义方式： 3)
push()添加元素
数组操作api 4)
js数组 ii.

push()添加元素
pop()移除最后一个元素
shift()移除第一个元素
for()遍历数组
String – 基本数据类型 字符串类型 的包装对象
Boolean – 基本数据类型 布尔类型 的包装对象
Nubmer – 基本数据类型 数值类型 的包装对象
Array – 数组类型 的包装对象
Function – 函数类型 的包装对象
Math – 数据对象，封装了很多数学常量和数学方法
Date – 日期时间对象，封装了很多和日期实现相关的方法
思考：parseInt(“123abc123”);打印结果。
Global – 全局对象。js中有一些方法和属性经常使用，但归到哪个对象上都不
合适，所以js中有一个Global对象整合了这些方法和属性。Global中定义的方
法和属性特点是属于全局，可以直接使用。
邮箱正则。
RegExp --正则对象，保存有关正则表达式模式匹配信息的固有全局对
象。Partten
js的内置对象： ○
js对象–内置对象 iii.
在js中对象的本质是一段可执行的字符串。是由一对花括号，其中包含多
个键值对，键值之间使用冒号(:)隔开，键值对之间使用逗号隔开，这些内
容组成了js对象。
1)
js中没有类的概念，无法通过类创建对象。可以通过构造函数的形式直接
创建一个类的构造函数，用它产生对象。
2)
无参构造创建对象 a)
function Person(){
}
var p = new Person();
p.name = “lili”;
p.age = 18;
return this.name+“say…”;
p.say = function(){
}
console.log(p.say());
有参函数创建对象 b)
this.name = name;
function Person(name,age){
js对象创建方式 3)
js对象 --自定义对象 iv.

this.name = name;
this.age = age;
}
var p = new Person(“cy”,90);
p.addr = “安徽”;
console.log§;
直接量定义对象（匿名对象） c)
console.log§;
var p = {name:“cy”,age:18,addr:“安徽”};
删除属性： delete p.name
添加属性： p.age = 18;
console.log(name)
~with语句： with§{
}
对象api操作： d)
name:“cy”,
age:18,
{name:“lili”,age:18,job:“吃”},
{name:“乔碧罗”,age:18,job:“faker”}
girlfriends:[
]
var data = {
}
JSON本质上就是一段字符串，能够保存较复杂关系的数据，具有良好的数据保存格式，又
极为轻量，加之多种代码平台都支持对字符串的处理，所以我们可以使用JSON字符串进行
数据的传入，甚至跨平台传输。
data[“wife”][1][“job”];
查看当前JSON中第二个wife的工作
json字符串 6.

DHTML Dynamic 动态的 HTML . a.
DHTML认为页面中的每一个元素都可以看做是一个对象。 b.
DHTML操作页面中对象，就是在操作页面中的元素。 c.
DHTML可以对页面中的对象进行增删改查的操作。 d.
DHTML概述 1.
BOM浏览器对象模型 a.
onblur:失去焦点
onfocus:获得焦点
!!!onload:当前浏览器页面装载完成后触发
!!!alert
!!!confirm
!!!prompt
!!!close (//仅限ie浏览器，chrom和firefox需要解决浏览器禁止js关闭非js创建页面的
问题)
!!!setInterval
setInterval 和 setTimeout的不同？
!!!setTimeout

其中包含的方法：
location
history
screen
navigator
window对象：
BOM和DOM 2.
DHTML
2019年7月31日 16:18