javacript笔记
- 在一对script的标签中有错误的js代码,那么该错误的代码后面的js代码不会执行，如果第一对的script标签中有错误,不会影响后面的script标签中的js代码执行。
- console版上如果输出是黑色可能是字符串，如果是蓝色则可能是数字
- typeof null 输出是object，不是null，当一个变量赋值为NULL时，指的是该变量存储的是对象，该对象没有任何指向，所以typeof null是object。只有一种情况结果会是null，就是String（null），结果是null，把null换成字符串输出。
- 数字类型有范围: 最小值和最大值：
5console.log(Number.MAX_VALUE);//数字的最大值
console.log(Number.MIN_VALUE);//数字的最小值 - 不要用小数去验证小数.
var x=0.1;
var y=0.2;
var sum=x+y;
console.log(sum==0.3);// 结果是false
- 不要用NaN验证是不是NaN
var num;
console.log(num+10==NaN);//结果是false
验证结果是不是NaN,应该使用isNaN(值或者是变量)
7. 字符串的拼接: 使用+可以把多个字符串放在一起形成一个字符串；
只要有一个是字符串,其他的是数字,那么结果也是拼接,不是相加；
如果有一个是字符串,另一个不是字符串,使用-（除了+号的运算符）号,此时会发生计算，浏览器帮助我们 自动的把字符串类型转成了数字类型,这种方式叫:隐式转换，如下：
var str1 = "10";
var str2 = 5;
console.log(str1-str2);//结果是5
- Undefined和Null
undefined表示一个声明了没有赋值的变量，变量只声明的时候值默认是undefined
null表示一个空，变量的值如果想为null，必须手动设置 - ++ – 都是运算符
++ 和 – 可以分为:前+ 和后+ and 前- 和后-
如果++在后面:如: num++ +10参与运算，先参与运算,运算结束后自身再加1。
如果++在前面:如: ++num+10参与运算，先自身加1,然后再参与运算。 - switch-case:
- 语法:
switch(表达式){
case 值1:代码1;break;
case 值2:代码2;break;
case 值3:代码3;break;
case 值4:代码4;break;
…多个case
default:代码5;
}
注意：
（1）default后面的break是可以省略的
（2） default也可以省略
（3） switch-case 语句中和case后面的值比较的时候使用的是严格的模式（===）
（4）break是可以省略,如下：
var month=parseInt(prompt("请输入月份"));
switch (month){
case 1:
case 3:
case 5:
case 7:
case 8:
case 10:
case 12:console.log("31天");break;
case 4:
case 6:
case 9:
case 11:console.log("30天");break;
case 2:console.log("28天");break;
}
- 数据的创建
（1）通过构造函数创建数组：var 数组名=new Array(长度);
（2）通过字面量的方式创建数组：var 数组名=[];//空数组
11.把数据丢进新数组
var arr = [10, 0, 20, 0, 30, 0, 50];
var newArr=[];//新数组,用来存放第一个数组中所有非0的数字
for(var i=0;i- 全局变量:声明的变量是使用var声明的（不在函数内声明）,那么这个变量就是全局变量
隐式全局变量:声明的变量没有var,就叫隐式全局变量
全局变量是不能被删除的,隐式全局变量是可以被删除的 - 函数和构造函数的区别；名字是不是大写(首字母是大写)
- instanceof的用法
function Person(name,age) {
this.name=name;
this.age=age;
this.sayHi=function () {
console.log("我叫:"+this.name+",年龄是:"+this.age);
};
}
//自定义构造函数创建对象:先自定义一个构造函数,创建对象
var obj=new Person("小明",10);
console.log(obj.name);
console.log(obj.age);
obj.sayHi();
var obj2=new Person("小红",20);
console.log(obj2.name);
console.log(obj2.age);
obj2.sayHi();
console.log(obj instanceof Person);//true
console.log(obj2 instanceof Person);//true
//自定义狗的构造函数,创建对象
function Dog(name,age,sex) {
this.name=name;
this.age=age;
this.sex=sex;
}
var dog=new Dog("大黄",20,"男");
console.log(dog instanceof Person);//false
console.log(dog instanceof Dog);//true
- 对象占了两个空间，一个是堆，一个是栈，堆里面是对象，栈里面是该对象所有空间的地址（引用）
如： var obj=new Person(“小明”,20);，new Person(“小明”,20)就是在堆里面开辟个空间，栈里存的就是这个空间的地址，obj=new Person(“小明”,20)，就是将栈里的obj放该空间的地址。
- 创建对象的方法
（1）new Object()创建对象：var obj = new Object();
var person = new Object();
person.name = 'lisi';
person.age = 35;
person.job = 'actor';
person.sayHi = function(){
console.log('Hello,everyBody');
}
（2）自定义构造函数：var obj2 = new 自定义构造函数；
function Person(name,age,job){
this.name = name;
this.age = age;
this.job = job;
this.sayHi = function(){
console.log('Hello,everyBody');
}
}
var p1 = new Person('张三', 22, 'actor');
console.log(per instanceof Person);
//只有这种方式可以知道对象的类型是Person
（3）字面量的方式：var obj3 = {}；（创建对象）、var num = 10（数字）； var arr = [];（数组），缺陷：一次性对象
var o = {
name: 'zs',
age: 18,
sex: true,
sayHi: function () {
console.log(this.name);
}
};
（4）工厂函数创建对象
function createPerson(name, age, job) {
var person = new Object();
person.name = name;
person.age = age;
person.job = job;
person.sayHi = function(){
console.log('Hello,everyBody');
}
return person;
}
var p1 = createPerson('张三', 22, 'actor');
-
工厂模式和自定义构造函数
共同点：都是函数,都可以创建对象,都可以传入参数
区别：（1）工厂模式： 函数名是小写；有new；有返回值；new之后的对象是当前的对象；直接调用函数就可以创建对象。（2）自定义构造函数：:函数名是大写(首字母)； 没有new；没有返回值；this是当前的对象；通过new的方式来创建对象。 -
原始数据类型: number,string,boolean,undefined, null,object
基本类型(简单类型),值类型: number,string,boolean
复杂类型(引用类型):object
空类型:undefined,null -
console.dir(对象)：把对象的结构显示出来
-
基本类型又叫做值类型，值类型的值存储在栈中
复杂类型又叫做引用类型，对象在堆上存储,地址在栈上存储var num=10;//值类型,值在栈上
var obj={};//复杂类型,对象在堆,地址(引用)在栈值类型之间传递,传递的是值
引用类型之间传递,传递的是地址(引用)值类型作为函数的参数,传递的是值
引用类型作为函数的参数,传递的是地址
例题:
function Person(name,age,salary) {
this.name = name;
this.age = age;
this.salary = salary;
}
function f1(person) {
person.name = "ls";
person = new Person("aa",18,10);
}
var p = new Person("zs",18,1000);
console.log(p.name);//zs
f1(p);
console.log(p.name);//ls
18. 堆栈空间分配区别：
（1）栈（操作系统）：由操作系统自动分配释放 ，存放函数的参数值，局部变量的值等。其操作方式类似于数据结构中的栈；
（2）堆（操作系统）： 存储复杂类型(对象)，一般由程序员分配释放， 若程序员不释放，由垃圾回收机制回收，分配方式倒是类似于链表。
19. string ---->字符串类型----基本类型、 String---->字符串类型----引用类型。
字符串可以看成是字符组成的数组,但是js中没有字符类型
因为字符串可以看成是数组,所以,可以通过for循环进行遍历
字符串特性:不可变性,字符串的值是不能改变
字符串的值之所以看起来是改变的,那是因为指向改变了,并不是真的值改变了
var str = 'abc';
str = 'hello';
// 当重新给str赋值的时候，常量'abc'不会被修改，依然在内存中
// 重新给字符串赋值，会重新在内存中开辟空间，这个特点就是字符串的不可变
// 由于字符串的不可变，在大量拼接字符串的时候会有效率问题
// var str=new String("hello");对象
var str="hello";
str[1]="W";
console.log(str);
for(var i=0;i- 实例方法---->必须要通过new的方式创建的对象(实例对象)来调用的方法
静态方法---->直接通过大写的构造函数的名字调用的方法(直接通过大写的对象名字调用的) - 基本包装类型
普通变量不能直接调用属性或者方法，对象可以直接调用属性和方法
基本包装类型:本身是基本类型,但是在执行代码的过程中,如果这种类型的变量调用了属性或者是方法,那么这种类型就不再是基本类型了,而是基本包装类型,这个变量也不是普通的变量了,而是基本包装类型对象
var str="hello";//基本类型
str=str.replace("ll","HH");//调用了方法，转成了基本包装类型对象，不再是基本类型
console.log(str);
注意：如果是一个对象&&true,那么结果是true，如果是一个true&&对象,那么结果是对象。
var flag=new Boolean(false);//虽然是值是false，但是new了所以是对象，对象就是true
var result1=true&&flag;//flag对象
var result2=flag&&true//true
console.log(result1，result2);
var num2=Number(“10”)，这是数值类型
var num=10;//数值类型
var num2=Number("10");//这是类型转换,没有new，所以还是数值类型
var num3=new Number("10");//new了，所以是基本包装类型
- 在表单标签中,如果属性和值只有一个,并且值是这个属性本身,那么,在写js代码,DOM操作的时候,这个属性值,是布尔类型就可以了
- 凡是css中这个属性是多个单词的写法,在js代码中DOM操作的时候.把-干掉,后面的单词的首字母大写即可
- 在js代码中DOM操作的时候,设置元素的类样式,不用class关键字,应该使用,className
- 判断数字要比判断字符串的效率高，因为数字直接比较值，字符串判断是一次判断字符是否相等，效率低。因此可以用长度判断的地方尽量不要用字符串判断。
- 如果这个属性在浏览器中不支持,那么这个属性的类型是undefined，所以判断这个属性的类型是不是undefined,就知道浏览器是否支持
- 设置标签中的文本内容,应该使用textContent属性,谷歌,火狐支持,IE8不支持
设置标签中的文本内容,应该使用innerText属性,谷歌,火狐,IE8都支持
function setInnerText(element,text) {
//判断浏览器是否支持这个属性
if(typeof element.textContent =="undefined"){//不支持
element.innerText=text;
}else{//支持这个属性
element.textContent=text;
}
}
//获取任意标签中间的文本内容
function getInnerText(element) {
if(typeof element.textContent=="undefined"){
return element.innerText;
}else{
return element.textContent;
}
}
- 变量和函数都是window的,因为页面中的所有内容都是window的,window是可以省略的.
- window对象有另一个名字top,以下两个输出的结果是一样的，都是window
- 直接输出window.name输出的结果是空，而不是undefined，所以一般不用name做变量。window.name可以用于解决一些跨域问题
- 一般把JS写在body后面，这样先加载页面的标签和内容，优先给用户呈现页面，当他看页面的过程JS就能加载完毕，这样可以提升用户体验。
- window.location 对象
（1）属性：
location对象：window.location
地址栏上#及后面的内容：window.location.hash
主机名及端口号：window.location.host
主机名：window.location.hostname
文件的路径—相对路径：window.location.pathname
端口号：window.location.port
协议：window.location.protocol
搜索的内容：window.location.search
（2）方法：
onload=function () {
document.getElementById("btn").onclick=function () {
//设置跳转的页面的地址
//location.href="http://www.jd.com";//属性
//location.assign("http://www.jd.com");//方法
//location.reload();//重新加载--刷新
//location.replace("http://www.jd.com");//没有历史记录
};
};
- window.history对象
- back()：后退键
- forward()：前进键
- go()：括号里是负数是后退，正数是前进
- window.navigator对象
- serAgent：通过userAgent可以判断用户浏览器的类型，借此知道是手机用户还是电脑用户
- platform：通过platform可以判断浏览器所在的系统平台类型
- 如果样式的代码是在style的标签中设置,外面是获取不到
如果样式的代码是在style的属性设置,外面是可以获取 - 如何判断对象是不是这个数据类型?
（1） 通过构造器的方式 实例对象.constructor==构造函数名字
（2） 对象 instanceof 构造函数名字
注：尽可能的使用第二种方式来识别 - 原型的引入
title
不需要共享的数据写在构造函数中,需要共享的数据写在原型中
- 简单的原型写法
function Student(name, age, sex) {
this.name = name;
this.age = age;
this.sex = sex;
}
//简单的原型写法
Student.prototype = {
constructor:Student, //必须手动增加构造器的指向，该代码不能省略
height: "188",
weight: "55kg",
study: function () {
console.log("哈哈");
},
eat: function () {
console.log("嘎嘎");
}
};
- 原型中的方法,是可以相互访问的；实例对象的方法,也可以相互调用的。
- 实例对象使用的属性或者方法,先在实例中查找,找到了则直接使用,找不到则,去实例对象的__proto__指向的原型对象prototype中找,找到了则使用,找不到则报错
- this的指向
- 普通函数中的this是谁?-----window
- 对象.方法中的this是谁?----当前的实例对象
- 定时器方法中的this是谁?----window
- 构造函数中的this是谁?-----实例对象
- 原型对象方法中的this是谁?—实例对象
- 函数的不同调用方式
（1）普通函数
function f1() {
console.log("哈哈");
}
f1();
（2）构造函数
function F1() {
console.log("hh");
}
var f=new F1();
（3）对象的方法
function Person() {
this.play=function () {
console.log("hh");
};
}
var per=new Person();
per.play();
- 函数是对象,对象不一定是函数
有__proto__原型的是对象
有prototype原型是函数
函数既有prototype又有__proto__，所以函数也是对象 - 所有的函数实际上都是Function的构造函数创建出来的实例对象
