JS学习笔记（二）

JavaScript中的对象分为3种:自定义对象、内置对象、浏览器对象

一、Javascript自定义对象：

JavaScript 中的所有事物都是对象：字符串、数值、数组、函数…

对象中的属性定义不需要var声明

此外，JavaScript 允许自定义对象。

【1】构造对象的几种方法

（1）以构造函数形式来调用

var o= new Object(true);//使用Object生成布尔对象

（2）使用字面量创建

person={firstname:"John",lastname:"Doe",age:50,eyecolor:"blue"};

尝试打印：

console.log(person.firstname);

尝试给person对象添加新属性job：student，并打印验证：

person.job='student';
console.log(person.job);

（3）使用对象构造器构造person

function person(firstname,lastname,age,eyecolor) {

  this.firstname=firstname;

  this.lastname=lastname;

  this.age=age;

  this.eyecolor=eyecolor;

}

//之后用person对象为快速创建新对象服务

var Father=new person('Zhang','baba',47,'brown');

//打印检查效果:

console.log(Father);

var Mather=new person('Chen','mama',47,'brown');

//打印检查效果:

console.log(Mather);

运行结果：

//为对象添加新属性

Father.job='automobile mechanic';

console.log(Father);

运行结果：

【2】将方法添加到JS对象中

方法只不过是附加在对象上的函数。

在构造器函数内部定义对象的方法：

function person(firstname,lastname,age,eyecolor) {
    this.firstname=firstname;
    this.lastname=lastname;
    this.age=age;
    this.eyecolor=eyecolor;
    //定义在对象内部的方法，用于修改对象age属性
    this.changeage=function(num){
        this.age=num;
    }

}

//修改对象的属性值

Father.changeage(48);

console.log(Father);

运行结果:

【3】通过for遍历对象的属性

//通过for遍历对象属性
var txt='';
for(let x in Father){
  txt+=Father[x];
  txt+='||';
}
console.log(txt);

运行结果：

(注意：JavaScript的对象是可变的，它不会创建副本)

//对象实例化
var son1=new person('Zhang','yi',21,'brown');

var son2=son1;

console.log('被引用前年龄属性参数:'+son1.age);

son2.age=10;

console.log('被引用后年龄属性参数:'+son1.age);

运行结果：

细节知识补充：

new关键字的执行过程：

1、new构造函数可以在内存中创建了一个空的对象

2、this就会指向刚才创建的空对象（this的用途）

3、执行构造函数里面的代码给这个空对象添加属性和方法

4、返回这个对象

//对象练手案例：
//创建一个车的对象，该对象要有重量、颜色、牌子，可以载人、拉货和旅游。

function car(weight,color,brand){
    this.weight=weight;
    this.color=color;
    this.brand=brand;
    this.fun1=function(){
        console.log('载人');
    }
    this.fun2=function(){
        console.log('拉货');
    }
    this.fun3=function(){
        console.log('旅游');
    }
}
var BMW1=new car('1.5t','blue','BMW');
var CarInformation='';
for(var key in BMW1){
    CarInformation+=BMW1[key];
    CarInformation+='||';//简单分割，便于查看
}
console.log(CarInformation);
BMW1.fun1();
BMW1.fun2();
BMW1.fun3();

运行结果：

二、Javascript内置对象

内置对象就是指JS语言自带的一些对象，这些对象供开发者使用，并提供了一些常用的或是最基本而必要的功能（属性和方法)

例如：Math、Date、Array、String等

【1】Math对象练习：

//案例
var nums=[5,6,8,7,48,67,87,64,78,4,687,68,6];
for(let i=0;i<nums.length;i++){
    for(let j=0;j<nums.length-i-1;j++){
        if(nums[j]>nums[j+1]){
            let temp=nums[j];
            nums[j]=nums[j+1];
            nums[j+1]=temp;
        }
    }
}
console.log(nums);
//找出nums数组里面的最大值
console.log(Math.max(...nums));
var num1=234.234123,num2=-546.5,num3=54.7;
//向下取整
console.log(Math.floor(num1));
//向上取整
console.log(Math.ceil(num1));
//四舍五入
console.log(Math.round(num1));
console.log(Math.round(num2));
console.log(Math.round(num3));

（细节知识，当小数为.5时，结果往大取，包括负数）

运行结果：

【2】封装一个自定义的数学对象：

//封装一个属于自己的数学对象
var myMath={
    PI:3.1415926,
    max:function(){
        let maxNum=arguments[0];
        for(let i=1;i<arguments.length;i++){
            if(arguments[i]>maxNum){
                maxNum=arguments[i];
            }
        }
        return maxNum;
    },
    min:function(){
        let minNum=arguments[0];
        for(let i=1;i<arguments.length;i++){
            if(arguments[i]<minNum){
                minNum=arguments[i];
            }
        }
        return minNum;
    },
    avg:function(){
        let sum=0;
        for(let i=0;i<arguments.length;i++){
            sum+=arguments[i];
        }
        return sum/arguments.length;
    }
}
console.log('nums数组所有数字的最大数为:'+myMath.max(...nums));
console.log('nums数组所有数字的最小数为:'+myMath.min(...nums));
console.log('nums数组所有数字的平均数为:'+myMath.avg(...nums));

运行结果：

三、练手案例

【1】案例一、

//数组去除案例
//(1)将旧数组中不重复的元素转存到新数组中
//旧数组
var arr3=['c','a','z','a','x','a','x','c','b'];
//新数组
var arr4=new Array();
for(let i=0;i<arr3.length;i++){
    if(arr3.indexOf(arr3[i])==arr3.lastIndexOf(arr3[i])){
        arr4.push(arr3[i]);
    }
}
console.log(arr4);
//(2)将旧数组中不重复的元素转存到新数组中，重复的元素只保留一个
var arr5=new Array();
for(let i=0;i<arr3.length;i++){
    if(arr5.indexOf(arr3[i])==-1)
        arr5.push(arr3[i]);
}
console.log(arr5);

运行结果：

【2】案例二、

//查找字符串中元素'w'出现的位置(存储到一个数组中并打印)，以及总出现次数
var str='awaeawxdasrawexzewraeeeee';
var indexOfElement=new Array();
var key=0;
//简单直接法
for(let i=0;i<str.length;i++){
    if(str[i]=='w'){
        indexOfElement.push(i);
    }
}
console.log('方法一:元素w出现的位置:'+indexOfElement+'总出现次数:'+indexOfElement.length);
//应用indexOf方法
var indexOfElement2=new Array();
key=str.indexOf('w');
while(key!=-1){
    indexOfElement2.push(key);
    key=str.indexOf('w',key+1);
}
console.log('方法二:元素w出现的位置:'+indexOfElement2+'总出现次数:'+indexOfElement.length);

运行结果：

【3】案列三、

//查找字符串中出现最多的元素，以及其次数
var str2='awaeawxdseaew2saeaes5555asrawexzewraeeeee';
//技巧1，arr['x']可以判断数组arr中是否存在x元素
var objs={};
for(let i=0;i<str2.length;i++){
    let char=str2.charAt(i);
    if(objs[char]){
        objs[char]++;
    }else{
        objs[char]=1;
    }
}

console.log(objs);
//遍历对象objs，得到出现次数最多的元素
var maxCount=0;
var maxIndex=-1;
//遍历对象需要特别的循环
for(let i in objs){
    if(maxCount<objs[i]){
        maxCount=objs[i];
        maxIndex=i;
    }
}
console.log('出现次数最多的元素:'+maxIndex+'，出现次数为'+maxCount);

运行结果：

【3】案列四、

//查询000-01-21是星期几，用字符‘星期x’表示
var date1 = new Date("2000-01-21");
console.log(date1);
//日期格式化
//获取年份
console.log(date1.getFullYear());
//获取星期，注意，直接调用getDay仅获得1到7的整数返回值
arr = ["星期一", "星期二", "星期三", "星期四", "星期五", "星期六", "星期日"];
console.log(arr[date1.getDay() - 1]);

请自行验证！

四、数据类型内存分配

【1】数据类型存储位置

简单数据类型会被存储到栈中，复杂数据类型会被存储到堆中。

简单数据类型（值类型）：string、number、boolean、undefined、null，如age=18；

复杂数据类型，在栈中存放地址，地址指向堆中开辟的空间。例如array数组。