javascript 的组成
- javascript 的组成部分:
- DOM : Document Object Mode 文档对象模型,此处的文档指的是 HTML 页面(HTML 文档)
为我们提供了一套操作页面元素的 api (一套工具)
api:application(应用) programming(编程) interface(接口) - BOM: Browser Object Mode 浏览器对象模型,提供一个和浏览器交互的对象,核心对象: window
- ECMAScript:规定语法的标准
基本类型和复杂类型
- 两种数据类型
- 基本(简单)数据类型
- string 字符串类型
- number 数值(小数和整数)
- boolean 布尔类型(true | false)
- null 空类型
- undefined 未定义
- 复杂(复合)数据类型
- Object 对象类型
- Array 数组类型 =====>Object
- Date 日期类型 =====>Object
- Math 数学类型 =====>Object
- Function 函数 =====>function(并非Object)
- RegExp 正则表达式
- String 字符串对象类型
- Number 数值对象类型
- Boolean 布尔对象类型
- 判断对象类型的方法
- 关键字 typeof
- 语法 typeof 变量
var str = "demoString";
console.log(typeof str);
var number = 10;
console.log(typeof number);
console.log(typeof null); //Object
console.log(null instanceof Object); //true |false(错误的)
var obj = {};
if (typeof obj == "object")
{
console.log("有值");
}
var a;
//if (a == undefined)
if (typeof a == "undefined")
{
console.log(a);
}
等于和全等于符号说明
- 赋值操作 (=)
- 等于符号 (==)
- 作用:用来判断左边的值和右边的值是否相等
- 特点:判断是否相等
- 全等符号(===)
特点:判断值是否相等,以及类型是否相等 - 不等于符号(!=)
- 不全等于符号 (!=)
null 和 undefined 的区别
变量的值永远都不可能等于 null ,除非我们手动赋值 null
设置变量为 null 是告诉系统这个变量不再使用,可以把占用的内存空间释放
值类型和引用类型
值类型
string
number
boolean
undefined
null (*)
引用类型
Object 类型,以下类型其本质基本都是 Object 类型
Function function======>object
Array
Date
String
Number
Boolean
变量在内存中存储的结构,和超市储存箱很像,有一个名字(比如说01,02,03)还有一个空间(可以存放数据)
区别: 区别在于空间中存储的信息
值类型:存储的是具体数据
引用类型:存储的是一个引用 (reference)[地址],该引用指向内存的一块存储空间,这块空间存储着具体数据
举例:
01(变量的名称) ------> 一个苹果(具体数据)
02(变量的名称) ------>苹果在超市的第二排货架的第一列(地址)
值类型和引用类型的赋值
- 赋值(=):
左边的变量 = 右边的变量;
var a = 10;
内部细节:是把右边变量(空间中)存储的值赋值一份放在左边变量开辟的存储空间中 - 值类型的赋值
赋值操作:是把右边变量(空间中)存储的值[具体数据]复制一份放在左边变量(空间中)修改了其中的一个变量对另一个变量没有影响 - 引用类型的赋值
赋值操作:是把右边变量(空间中)存储值的[地址]赋值一份放在左边变量(空间中),修改了其中一个对象,对另外一个对象是有影响的
var str1 = '让我掉下眼泪的,不止作业的酒';
var str2 = str1 ;
console.log(str1 == str2);//true
//修改变量的值
str1 = '让我依依不舍的,不止你的温柔'
console.log(str1);
console.log(str2);
var obj1 = {name:'zs'};
var obj2 = obj1;
obj1.name = 'lisi';
console.log(obj2.name); //lisi
//该行代码切断 obj2和obj1 的联系
obj1 = {age:22};
console.log(obj2.age);
//输出 undefined
值类型和引用类型在函数中的使用
在函数中的使用
函数的参数:
形参(形式参数):该变量使用来占位用的,在调用之前是没有值的,在函数内部表现为一个局部变量(param)
实参:函数调用的时候传入的参数,这个参数是有值的(a);函数的调用
把实参的值赋值给形参
值类型作为函数的参数:那么内部修改了参数的值,对外部的实参没有影响
引用类型数据作为函数的参数:那么内部修改了形参的值,对外部的实参有影响,他们只想的是内存中的同一块数据
<script>
function func(param){
console.log(param);//我是字符串
param = '我也是一个字符串';
console.log(param);
}
var a = '我是字符串';
func(a);
console.log(a);
</script>
<script>
function foo(obj){
console.log(obj.name);//zhangsan
//尝试修改形参的值
//obj.name = 'lisi';
obj = {
name:'哗啦哗啦';
}
obj.name = 'lisi';
}
var o = {name:'zhangsan'};
foo(o);
console.log(o.name,'_____');
</script>
//此处例子并未显示出引用类型赋值在函数内部如果改变的话,会对函数外部造成影响 ???
对象的动态特性
- javaScript 中的对象和其他的大多数语言都不一样
- 对象支持动态特性:增删改查(方法)
- 对象:键值对的集合(key - value)
- 属性:在对象内部声明的变量
- 方法:在对象内部定义的函数
-操作对象的属性和方法可以使用两套方式 - 点语法
- 中括号
//点语法使用
//创建要给空的对象
var obj = {};
//动态添加属性
obj.name = 'zhangsan';
console.log(obj.name);
//修改属性
obj.name = 'lisi';
console.log(obj.name);
//区分添加还是修改:在通过点语法的方式访问属性的时候,先检查该属性是否存在,如果存在就是修改,如果该属性不存在,那么就是添加
//添加方法
obj.showName = function(){
console.log('我的名字');
}
obj.showName();
//修改方法
obj.showName = function(){
console.log('哈哈哈哈');
}
obj.showName();
//输出对象的属性
//关键字 delete
//语法:delete 对象.属性
delete obj.name;
console.log(obj.name);
//中括号语法[]
var obj = {};
var name = 'testName';
//注意在使用[]语法的时候,key 必须是字符串需要加""
obj[name] = 'zhangsan';
//name 是 window 的name
console.log(obj);
obj["name"] = "lisi";
console.log(obj["name"]);
//添加方法
obj['showName'] = function(){
console.log('我的名字');
}
obj['showName']();
//修改方法
obj['showName'] = function(){
console.log('哈哈哈哈----');
}
obj['showName']();
//删除对象的属性
delete obj['name'];
console.log(obj['name']); //undefined
obj['background color'] = 'red';
console.log(obj);