你不知道的JS

Posted 2021-11-30 jeffjoy

1、作用域 

块级作用域 let 只在函数内部自己的作用域内有效
全局作用域 var
函数作用域
找不到作用域抛出ReferenceError 变量有了则抛出 TypeError
先声明后赋值
函数提升 变量提升 函数优先，函数声明提升在普通变量之前
函数表达式不会提升
闭包：当函数可以记住并访问所在的词法作用域，即使函数是在当前词法作用域之外执行，这时就产生了闭包。
垃圾回收机制
2.this:

1.默认绑定 ： 全局
2.隐式绑定 ：
function foo() {
console.log( this.a );
}
var obj2 = {
a: 42,
foo: foo
};
var obj1 = {
a: 2,
obj2: obj2
};
obj1.obj2.foo(); // 42
隐式丢失：是被隐式绑定的函数会丢失绑定对象，也就是说它会应用默认绑定，从而把 this 绑定到全局对象或者 undefined 上
function foo() {
console.log( this.a );
}
var obj = {
a: 2,
foo: foo
};
var bar = obj.foo; // 函数别名！
var a = "oops, global"; // a 是全局对象的属性
bar(); // "oops, global"
虽然 bar 是 obj.foo 的一个引用，但是实际上，它引用的是 foo 函数本身，因此此时的bar() 其实是一个不带任何修饰的函数调用，因此应用了默认绑定。
3.显示绑定 ： apply(),call()，bind()
4.new绑定
5.优先级： 显示绑定>new绑定>隐式绑定
对象
原型
行为委托
词法结构 break continue return 和随后的表达式之间不能换行
语法结构

3.数据类型
堆(heap)：堆是在程序运行时，申请某个大小的内存空间，动态分配。数据结构.像倒过来的树。
栈(stack)： 先进后出的数据结构。像桶。系统分配。
队列(queue)：先进先出。特殊线性表。
数据类型：

1. 基本数据类型：null, undefined,string,number,boolean,symbol
2. 引用数据类型：object(对象，数组，函数)

基本数据类型--名值都存在栈内存中。
引用数据类型--名在栈中，值存在堆内存中。栈内存会提供一个引用地址指向堆内存中的值。
引用数据类型进行复制时，复制的是引用地址，因此改变值时候两个都会受到影响，因此叫做浅拷贝。

var a=[0,1,2,3]; 
var b=a;
b[0] = 2; //a[0] 也会变为2
a[4] = 5;    //b[4] 也会为5
char s1[] = "aaaaaaaaaaaaaaa"; 
char *s2 = "bbbbbbbbbbbbbbbbb"; 
aaaaaaaaaaa是在运行时刻赋值的；放在栈中。 
而bbbbbbbbbbb是在编译时就确定的；放在堆中。 

1).七种内置类型 ：null, undefined,string,number,boolean,symbol,object
2).typeof() 区分数据类型 6种： undefined,string,number,boolean,symbol,object(包括null,array,function,object)
3).Object.prototype.toString() 返回对象内部属性Class
常见的原生函数： Sting(),Number(),Boolean(),Array(),Object(),Function(),RegExp(),Date(),Error(),Symbol()
例:Object.prototype.toString.call(["a","b","c"]) [Object Array]
Sting(),Boolean(),Number()显示创建包装对象。
4).instanceof去区分对象类型
5). 表达式void 没有返回值，返回undefined
6).NaN 不与任何值相等包括自身 isNaN()
7).undefined 声明未赋值 null 没有值
8).ES6 中新加入了一个工具方法 Object.is(..) 来判断两个值是否绝对相等 Object.is(a,NaN) //true
9).Infinity -Infinity +0 -0

4.值和引用
1.简单值（即标量基本类型值，scalar primitive）总是通过值复制的方式来赋值 / 传递，包括null、undefined、字符串、数字、布尔和 ES6 中的 symbol。
2.复合值（compound value）——对象（包括数组和封装对象）和函数，则总是通过引用复制的方式来赋值 / 传递。

字符串和数字转换
1.字符串转数字
显式 Number() toNumber() parseInt() parseFloat()
隐式 +"53"

2.数字转字符串
显式 String() toSting()
隐式 +""

3.对象默认都有valueOf()和toString()方法，Object.create(null)创建的对象[Prototype]属性为null

4.布尔类型 ToBoolen() (undefined,null,"",false,+0,-0,NaN) 转为false, 其他为true(例如：[],{},function(){}) 

5.json字符串
　　JSON.stringify()  将 javascript 对象转换为字符串
　　toJSON()　　　将大写的字符串成员值序列化

　　JSON.parse()    将JSON字符串转化为对象

　　eval() 可用于将 JSON 文本转换为 JavaScript 对象。

7. 日期 获取时间戳 Date.now(),+new Date(),new Date().getTime()

Object.prototype.toString.call() 转为字符串
Array.prototype.slice.call() 能将类数组(arguments,NodeList)，字符串(String)转换成数组
Array.prototype.slice.call(arrayLike, index) 从第index个开始转换成数组
Array.from()

 4.深拷贝和浅拷贝的区别？
深拷贝的实现形式（几种）和浅拷贝的实现？
Object.assign() 进行的是浅拷贝，拷贝的是对象的属性的引用，而不是对象本身。Object.assign()可以处理一层的深度拷贝
Object.assign(target, ...sources)
Object.assign();Object.create();
深拷贝的实现：
1.手动复制
2.对象只有一层时候，Object.assign()
3.转成Json再转回来：用JSON.stringify把对象转成字符串，再用JSON.parse把字符串转成新的对象。
var obj1 = { body: { a: 10 } };
var obj2 = JSON.parse(JSON.stringify(obj1));
4.递归拷贝
5.Object.create()
6.jquery var obj2 = $.extend(true, {}, obj1);
7.函数库 lodash

dom元素获取值和赋值：
1. js.value = jQuery.val() 返回或设置被选元素的值
2. js.innerhtml = jQuery.html() 返回或设置被选元素的内容包括标签
3. js.innerText = jQuery.text() 设置或返回被选元素的文本内容
4. document.querySelector(‘#name‘).value querySelectorAll()
document.getElementById(‘name‘).value $("#name").val()
document.getElementByClassName(‘name‘).value $(".name").val()
document.write() 原样写入 wirteln() 末尾换行
document.getElementsByName()
document.getElementsByTagName()
5. input标签的readonly属性，表示只可读。但是可以通过js改变元素的值。
JavaScript通过DOM操纵HTML文档，修改的只是浏览器的呈现，而不会对文档本身内容进行修改。当input的type为hidden时候，value值会随着值的变化html也跟着变化。

 

思维导图

 

对象

1.创建方式：
对象字面量、new创建、Object.create() 、 inherit()
2.Object.create(null)创建的对象[Prototype]属性为null
3。属性特征：
1）、可写，可枚举，可配置
2）、属性的查询和设置
3）、属性删除 delete
4) 、检测属性 hasOwnProperty()、in、propertyIsEnumerable()可枚举 、Object.keys()
5) 、属性getter和setter
6) 、defineProperty() 、defineProperties() 、 getPropertyOf() 、isPropertyOf() 、
7) 、可扩展性 isSeal()、isFrozen()
8) 、序列化 toJson(),JSON.parse(),JSON.stringfy()

 

call()、apply()、bind() 上下文，参数
栈和堆
引用类型和值类型
深拷贝浅拷贝

array.prototype.slice.call()