JS笔记（一）_JS基本类型、数组和对象基本概念和方法

1.JS基本类型：

ECMAScript 中有5种简单数据类型（也称为基本数据类型）：Undefined,Null,Boolean,Number和String。一种复杂数据类型：object

# typeOf null 的结果为Object

[code]var n = null
var flag = true
var s = 'str'
var num = 11
var un = undefined

console.log(typeof(n));         //object
console.log(typeof(flag));      //boolean
console.log(typeof(s));         //String
console.log(typeof(num));       //number
console.log(typeof(un));        //undefined

2.值传递 / 引用传递 （堆栈）

搞清楚这个问题需要先理解清楚堆栈的存储方式：

1.基本数据类型是直接存储在栈内存

[code]var a = 5
var b = a        //复制一份赋值给a
b += 1
console.log(a);  //5
console.log(b);  //6

2.引用类型是存储在堆内存，而栈中存放的是其在堆中的地址，如下例子所示

[code]var arr1 = [4,5,6]
var arr2 = arr1      //把arr1的栈中存放的地址复制给arr2，此时两者指向同一个数组
arr2.push(9)
console.log(arr1);   //[ 4, 5, 6, 9 ]

3.数组及相关方法

[code]//三种创建数组的方式：
//1: 常规方式:
var basketStar=new Array();
basketStar[0]="kobe";
basketStar[1]="james";
basketStar[2]="curry";

//2: 简洁方式:
var basketStar=new Array("kobe","james","curry");

//3: 字面量方式:
var basketStar=["kobe","james","curry"];

**********************************************

//数组长度： arr.length

var arr = [1,2,3]
//添加元素到数组末尾
arr.push(4)
console.log(arr);   //[ 1, 2, 3, 4 ]
//删除数组末尾元素
arr.pop()
console.log(arr);   //[ 1, 2, 3 ]
//添加元素到数组头部
arr.unshift(0)
console.log(arr);   //[ 0, 1, 2, 3 ]
//删除数组头部元素
arr.shift()
console.log(arr);   //[ 1, 2, 3 ]

//找出某个元素的索引
console.log(arr.indexOf(2));  //1
//splice根据数组下标删除元素
arr.splice(1,1)      //标识从该数组的下标为1的元素开始删除1个元素
console.log(arr);    //[ 1, 3 ]

**********************************************

//copyWithin()
const array1 = ['a', 'b', 'c', 'd', 'e'];
//把从index为3到4（不包括4）的元素拷贝放到index为0 的位置
console.log(array1.copyWithin(0, 3, 4)); //["d", "b", "c", "d", "e"]
console.log(array1.copyWithin(1, 3));    //["d", "d", "e", "d", "e"]

//fill()
//方法用一个固定值填充一个数组中从起始索引到终止索引内的全部元素。不包括终止索引。
const array1 = [1, 2, 3, 4];
console.log(array1.fill(0, 2, 4)); // [1, 2, 0, 0]
console.log(array1.fill(5, 1)); // [1, 5, 5, 5]
console.log(array1.fill(6)); // [6, 6, 6, 6]
//Array.prototype.reverse() 反转
const array1 = ['one', 'two', 'three'];
console.log('array1:', array1); //["one", "two", "three"]
const reversed = array1.reverse();
console.log('reversed:', reversed); //["three", "two", "one"]

// concat() 方法用于合并两个或多个数组。
//此方法不会更改现有数组，而是返回一个新数组。
const array1 = ['a', 'b', 'c'];
const array2 = ['d', 'e', 'f'];
const array3 = array1.concat(array2);
console.log(array3); // ["a", "b", "c", "d", "e", "f"]

//includes() 方法用来判断一个数组是否包含一个指定的值
//如果包含则返回 true，否则返回false。(MDN标注实验性API)
const array1 = [1, 2, 3];
console.log(array1.includes(2)); // true
const pets = ['cat', 'dog', 'bat'];
console.log(pets.includes('cat')); // true
console.log(pets.includes('at')); // false

//join()将一个数组（或一个类数组对象）的所有元素连接成字符串并返回这个字符串
//如果数组只有一个项目，那么将返回该项目而不使用分隔符。
const elements = ['Fire', 'Air', 'Water'];
console.log(elements.join());// "Fire,Air,Water"
console.log(elements.join(''));// "FireAirWater"
console.log(elements.join('-'));// "Fire-Air-Water"

//slice() 方法返回一个新的数组对象
//这一对象是一个由 begin 和 end 决定的原数组的浅拷贝
//包括 begin，不包括end）。原始数组不会被改变。
const animals = ['ant', 'bison', 'camel', 'duck', 'elephant'];
console.log(animals.slice(2));//  ["camel", "duck", "elephant"]
console.log(animals.slice(2, 4));// ["camel", "duck"]
console.log(animals.slice(1, 5));// ["bison", "camel", "duck", "elephant"]

**********************************************

//迭代方法
1.forEach()
为数组中的每个元素执行一次回调函数。
2.every()
如果数组中的每个元素都满足测试函数，则返回 true，否则返回 false。
3.some()
如果数组中至少有一个元素满足测试函数，则返回 true，否则返回 false。
4.filter()
将所有在过滤函数中返回 true 的数组元素放进一个新数组中并返回。
5.map()
返回一个由回调函数的返回值组成的新数组。
6.reduce()
从左到右为每个数组元素执行一次回调函数，并把上次回调函数的返回值放在一
个暂存器中传给下次回调函数，并返回最后一次回调函数的返回值。
7.reduceRight()
从右到左为每个数组元素执行一次回调函数，并把上次回调函数的返回值放在一
个暂存器中传给下次回调函数，并返回最后一次回调函数的返回值。

4.对象及相关方法

[code]//对象创建的几种方式
//1 new
var person = new Object();
person.name = "lisi";
person.age = 21;
person.say = function(){
console.log(this.name);
}

//2字面量
var person = {
name: "lisi",
age: 22,
say: function(){
console.log(this.name);
}
}

//3.工厂模式（无法识别对象类型，全部为Object）
function createPerson(name,age){
var p = new Object();
p.name = name;
p.age = age;
p.say = function(){
console.log(this.name);
}
return p;
}
var p1 = createPerson('xiaoming', 18)
p1.say()
var p2 = createPerson('xiaohong', 15)
p2.say()

//4.构造函数模式
function Person(name, age){
this.name = name
this.age = age
this.say = function(){
console.log(this.name);
}
}
var p3 = new Person('ming',18)
var p4 = new Person('hong',15)
console.log(p3.say());
console.log(p4.say());
console.log(p3 instanceof Person); //true
console.log(p4 instanceof Person); //true

//5.公有私有
function Person(name){
//私有
var name = name;
var say = function(){
console.log(name);
}
//私有属性公有化
return {
say
}
}
var p5 = Person("xiaohua")
console.log(p5.say());