JS基础 | Cheese

数据类型

基本数据类型：Number、String、Boolean、Null、Undefined、Symbol

引用数据类型：Object( Array、Function、Map、Set)

基本数据类型和引用数据类型它们在内存中的存储方式不同。基本类型值是指简单的数据段，存储在栈中，按值访问。引用类型的值是保存在内存中的对象，存储在堆内存中，不能直接访问内存中的位置，实际操作对象时时操作对象的引用，因此是按引用访问的。

引用类型可以为其添加属性和方法。

访问变量有按值和按引用两种方式，而参数只能按值传递。在向参数传递引用类型的值时，会把这个值内存中的地址复制给一个局部变量。

所有对象都有valueOf(),toString(),toLocaleString()方法。

包装对象：基础数据类型临时创建的临时对象。其中 number、boolean 和 string 有包装对象，代码运行的过程中会找到对应的包装对象，然后包装对象把属性和方法给了基本类型，然后包装对象被系统进行销毁。

Symbol

Symbol是ES6新出的一种数据类型，这种数据类型的特点就是没有重复的数据，可以作为object的key。数据的创建方法Symbol()，因为它的构造函数不够完整，所以不能使用new Symbol()创建数据。由于Symbol()创建数据具有唯一性，所以 Symbol() !== Symbol(), 同时使用Symbol数据作为key不能使用for获取到这个key，需要使用Object.getOwnPropertySymbols(obj)获得这个obj对象中key类型是Symbol的key值。

BigInt

BigInt也是ES6新出的一种数据类型，这种数据类型的特点就是数据涵盖的范围大，能够解决超出普通数据类型范围报错的问题。

使用方法：
整数末尾直接+n：647326483767797n
调用BigInt()构造函数：BigInt(“647326483767797”)

break和countinue

break会立即退出循环，continue会退出该循环，然后从该循环继续往下执行。

number类型的方法

将数值格式化为字符串：

toFixed(小数位长度)：按照指定的小数位返回数值的字符串表示, 指定截取小数位，小数位按四舍五入取值；
toExponential()：返回以指数表示法表示的数值的字符串；
toPrecision(长度)：数字格式化为指定长度，传参大于数字长度，后面补0；传参小于数字整数位，返回科学计数
1
2
3
4
var num = 99;
num.toPrecision(1); //"1e+2"
num.toPrecision(2); //"99"
num.toPrecision(3); //"99.0"

string类型的方法

charAt(index)：返回给定位置的那个字符；
charCodeAt(index)：返回字符串中给定位置的字符编码值；
formCharCode()：把字符串编码还原成字符串；
concat()：拼接多个字符串；
indexOf(),lastIndexOf()：从头/尾查找返回字符串中该字符的位置；
trim()：删除前后空格；
toLowerCase(),toLocaleLowerCase(),toUpperCase(),toLocaleUpperCase()：大小写转换；
text.localCompare(str)：比较两个字符串。返回0表示相等；
返回截取字符串的方法：substr(start, length),第二个参数表示返回的字符个数；slice(start, end), substrig(start, end) 第二个参数指定子字符串最后一个字符后面的位置。

// 传入负数
// slice: 将负值与字符串长度相加
// (end||start) < 0 ? (end||start) += length : (end||start)
'abc'.slice(0, 2) === 'abc'.slice(0, -1) //true 'ab'
'abc'.slice(1, 2) === 'abc'.slice(-2, 2) //true 'b'

// substr: start加上字符串长度，截取的length转化为0；
// start < 0 ? start += length : start
'abc'.substr(-1, 2) // c
'abc'.substr(1, 2) //bc

// substr: 将所有负值都转化为0
// (end||start) < 0 ? 0 : (end||start)
'abc'.substring(1, 2) //b
'abc'.substring(1, -2) //a
'abc'.substring(-2, 2) //ab

字符串的模式匹配：
- text.match(pattern)与正则的pattern.exec(text)相同；
- 查找模式方法：text.search(parrent),返回字符串中第一个匹配项的索引；
- replace():替换方法；
- split():指定分隔符分割字符串，结果保存在一个数组中，第二个参数可以指定数组的大小；

Global对象下的方法

eval():相当于解析器，只有一个字符串参数；

URI编码方法：

encodeURI()：对不属于URI的特殊字符编码，对应解码方法decodeURI()；
encodeURIComponent()：对任何非标准字符编码，对应解码方法decodeURIComponent()；

Array方法

检测数组：arr instanceof Array，Array.isArray(arr)；

栈（后进先出）方法：push()在数组末尾添加元素，返回修改后数组的长度；pop()从数组末尾移除最后一项，返回移除的项；

队列（后进先出）方法：shift()移除数组的第一项并返回该项；unshift()在数组前端添加任意个项并返回新数组的长度；

重排序方法：

reserve()翻转数组项顺序，改变原数组；
sort()默认情况按ASCII码从小到大排序，会改变原数组；

concat():合并数组，返回新数组；

slice():返回参数指定位置的项，不改变原数组；

splice():根据传入参数，删除项，插入项或者替换项，返回包含删除项的数组，会改变原数组；

迭代方法：

every(),对数组的每一项给定一个函数，如果每一项都返回true就返回true；
filter(),对数组的每一项给定一个函数，返回true的项组成的数组；
forEach(),对数组的每一项给定一个函数，无返回值；
map():对数组的每一项给定一个函数，返回每次函数调用的结果组成的数组；
some():对数组的每一项给定一个函数，如果任一项返回true就返回true。
reduce(function(prev, cur, index, arr) {}, initValue): 可以做累加器

Function方法

apply()和call():在特定的作用域中调用函数，实际上等于设置函数体内this对象的值。能扩充函数的定义域。apply()方法接收两个参数：一个是在其中运行函数的作用域，另一个是参数数组。Call()方法第一个参数是this值没有变化，变化的是其余参数直接传递给函数。

bind():会创建一个函数的实例，其this值会被绑定到传给bind函数的值。

创建对象

工厂模式

function createPerson(name,age){
	var o = new Object();
	o.name = name;
	o.age = age;
	o.sayName = function(){
		console.log(this.name);
	}
	return o;
}
var person1 = createPerson("A",20);
var person2 = createPerson("B",28);

缺点：无法识别对象

构造函数模式

function Person(name,age){
	this.name = name;
	this.age = age;
	this.sayName = function(){
		console.log(this.name);
	}
}
var person1 = new Person('A',20);
var person2 = new Person('B',28);

原型模式

Person.prototype.name = "A";
Person.prototype.age = 20;
Person.prototype.sayName = function(){
	console.log(this.name);
};
var person1 = new Person();
var person2 = new Person();
person2.name = "B";
alert(person1.name);//"A"--来自原型
alert(person2.name);//"B"--来自实例,切断了和原型的联系
person2.name = null;
alert(person2.name);//””

组合使用构造模型和原型模式

function Person(name,age){
	this.name = name;
	this.age = age;
	this.friends = ["a","b"];
}
Person.prototype = {
	constructor:Person,
	sayName:function(){
		alert(this.name);
	}
}
var person1 = new Person("A",20);
var person2 = new Person("B",28);
person1.friends.push("c");
alert(person1.friends === person2.friends);//false
alert(person1.sayName === person2.sayName);//true

动态原型模式

信息封装在构造函数中，通过构造函数初始化原型。不能使用字面量重写原型。

function Person(name,age){
	this.name = name;
	this.age = age;
	if(typeof this.sayName != "function"){
		Person.prototype.sayName = function(){
			alert(this.name);
		}
	}
}
var person3 = new Person("C",30);
person3.sayName();

寄生构造函数模式

function Person(name,age){
	var o = new Object();
	o.name = name;
	o.age = age;
	o.sayName = function(){
		console.log(this.name);
	}
	return o;
}
var person1 = new Person("A",20);
person1.sayName();

稳妥构造函数模式

function Person(name,age){
	var o = new Object();
	o.name = name;
	o.age = age;
	o.sayName = function(){
		console.log(name);
	}
	return o;
}
var person1 = new Person("A",20);
person1.sayName();

怪癖检测转化为数组

function convertToArray(nodes){
  Var array = null;
  try{
    array = Array.prototype.slice.call(nodes,0);
  //针对非IE浏览器
  } catch {
    array = new Array();
    for(var i =0,len = nodes.length; i < len; i++){
      array.push(nodes[i]);
    }
  }
  return array;
}