JavaScript学习笔记:你必须要懂的原生JS(一)
1、原始类型有哪几种?null是对象吗?原始数据类型和复杂数据类型存储有什么区别?
原始类型有6种,分别是undefined,null,bool,string,number,symbol(ES6新增)
虽然typeof null返回的值是object,但是null不是对象,而是基本数据类型的一种
原始数据类型存储在栈内存,存储的是值
复杂数据类型的地址存储在栈内存,指向存储在堆内存的值。当我们把对象赋值给另外一个变量的时候,复制的是地址,指向同一块内存空间,当其中一个对象改变时,另一个对象也会变化
2、typeof能否正确判断类型?instanceof呢?instanceof的实现原理是什么?
首先typeof能够正确地判断基本数据类型,但是除了null,typeof null输出的是对象
但是对对象来说,typeof不能正确地判断其类型,typeof一个函数可以输出'function',而除此之外,输出的全是object,这种情况下,我们无法准确的知道对象的类型
instanceof可以准确地判断复杂数据类型,但是不能正确判断基本数据类型。
instanceof是通过原型链判断的,A instanceof B,在A的原型链中层层查找,是否有原型等于B.prototype,如果一直找到A的原型链的顶端(null;即Object.prototype.proto),仍然不等于B.prototype,那么返回false,否则返回true
instanceof的实现代码:
// L instanceof R
function instance_of(L, R) {//L 表示左表达式,R 表示右表达式
var O = R.prototype;// 取 R 的显式原型
L = L.__proto__; // 取 L 的隐式原型
while (true) {
if (L === null) // 已经找到顶层
return false;
if (O === L) // 当 O 严格等于 L 时,返回 true
return true;
L = L.__proto__; // 继续向上一层原型链查找
}
}
3、for of,for in和foreach,map的区别
for...of循环:具有iterator接口,就可以用for...of循环遍历它的成员(属性值)。for...of循环可以使用的范围包括数组、Set和Map结构、某些类似数组的对象、Generator对象,以及字符串。for...of循环调用遍历器接口,数组的遍历器接口只返回具有数字索引的属性。对于普通的对象,for...of结构不能直接使用,会报错,必须部署了Iterator接口后才能使用。可以中断循环
for...in循环:遍历对象自身的和继承的科枚举的属性,不能直接获取属性值。可以中断循环
forEach:只能遍历数组,不能中断,没有返回值(或认为返回值是undefined)
map:只能遍历数组,不能中断,返回值是修改后的数组
4、如何判断一个变量是不是数组?
使用Array.isArray判断,如果返回true,说明是数组;
使用instanceof Array判断,如果返回true,说明是数组;
使用Object.prototype.toString.call判断,如果值是[object Array],说明是数组;
通过constructor来判断,如果是数组,那么arr.constructor === Array(不准确,因为可以指定obj.constructor = Array)
5、类数组和数组的区别是什么?
类数组:
拥有length属性,其他属性(索引)为非负整数(对象中的索引会被当做字符串来处理)
不具有数组所具有的方法
类数组是一个普通对象,而真实的数组是Array类型
常见的类数组有:函数的参数arguments,DOM对象列表(比如通过document.querySelectorAll得到的列表),jQuery对象(比如$("div"))
类数组可以转换为数组
// 第一种方法
Array.prototype.slice.call(arrayLike, start);
// 第二种方法
[...arrayLike];
// 第三种方法:
Array.from(arrayLike);
任何定义了遍历器接口的对象,都可以用扩展运算符转为真正的数组
Array.from方法用于将两类对象转为真正的数组:类似数组的对象(array-like object)和可遍历(iterable)的对象
6、== 和 === 有什么区别?
===不需要进行类型转换,只有类型相同并且值相等时,才返回true
==如果两者类型不同,首先需要进行类型转换。具体流程如下:
首先判断两者类型是否相同,如果相等,判断值是否相等;
如果类型不同,进行类型转换;
判断比较的是否是null或者是undefined,如果是,返回true;
判断两者类型是否为string和number,如果是,将字符串转换成number;
判断其中一方是否为boolean,如果是,将boolean转为number再进行判断;
判断其中一方是否为object且另一方为string、number或者symbol,如果是,将object转为原始类型再进行判断。
注意复杂数据类型,===比较的是引用地址
7、ES6中的class和ES5中的类有什么区别?
ES6 class 内部所有定义的方法都是不可枚举的;
ES6 class 必须使用new调用;
ES6 class 不存在变量提升;
ES6 class 默认即是严格模式;
ES6 class 子类必须在父类的构造函数中调用super(),这样才有this对象;ES5中类继承的关系是相反的,现有子类的this,然后用父类的方法应用在this上。
8、数组的哪些API会改变原数组?
修改原数组的API有:splice/reverse/fill/copyWithin/sort/push/pop/unshift/shift
不修改原数组的API有:slice/map/forEach/every/filter/reduce/entry/entries/find
注:数组的每一项是简单数据类型,且未直接操作数组的情况下。
9、let、const以及var的区别是什么?
let和const定义的变量不会出现变量提升,而var定义的变量会提升;
let和const是JS中的块级作用域;
let和const不允许重复声明;
let和const定义的变量在定义语句之前,如果使用会抛出错误,而var不会;
10、在JS中什么是变量提升?什么是暂时性死区?
变量提升就是变量在声明之前就可以使用,值为undefined
在代码块内,使用let/const命令声明变量之前,该变量都是不可用的。这在语法上,称为“暂时性死区“。暂时性死区也意味着typeof不再是一个百分百安全的操作
typeof x;//ReferenceError(暂时性死区,抛错)
let x;
typeof y;//值是undefined,不会报错
暂时性死区的本质就是,只要一进入当前作用域,所要使用的变量就已经存在了,但是不可获取,只有等到声明变量的那一行代码出现,才可以获取和使用该变量
JavaScript学习笔记:你必须要懂的原生JS(一)的更多相关文章
- Java程序猿的JavaScript学习笔记(汇总文件夹)
最终完结了,历时半个月. 内容包含: JavaScript面向对象特性分析,JavaScript高手必经之路. jQuery源代码级解析. jQuery EasyUI源代码级解析. Java程序猿的J ...
- Java程序猿的JavaScript学习笔记(8——jQuery选择器)
计划按例如以下顺序完毕这篇笔记: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScript ...
- Java程序猿JavaScript学习笔记(2——复制和继承财产)
计划和完成在这个例子中,音符的以下序列: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaSc ...
- Java程序猿的JavaScript学习笔记(3——this/call/apply)
计划按例如以下顺序完毕这篇笔记: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScript ...
- Java程序猿JavaScript学习笔记(4——关闭/getter/setter)
计划和完成这个例子中,音符的顺序如下: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScr ...
- Java程序猿JavaScript学习笔记(14——扩大jQuery UI)
计划和完成这个例子中,音符的顺序如下: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScr ...
- javascript学习笔记(四) Number 数字类型
数字格式化方法toFixed().toExponential().toPrecision(),三个方法都四舍五入 toFixed() 方法指定小数位个数 toExponential() 方法 用科学 ...
- JavaScript学习笔记之数组(二)
JavaScript学习笔记之数组(二) 1.['1','2','3'].map(parseInt) 输出什么,为什么? ['1','2','3'].map(parseInt)//[1,NaN,NaN ...
- JavaScript学习笔记[0]
JavaScript学习笔记[0] 使用的是廖雪峰JavaScript教程. 数据类型 Number 表示数字,不区分浮点整形. === 比较时不转化数据类型. == 反之. NaN与任何值都不想等, ...
- Java程序猿的JavaScript学习笔记(1——理念)
计划按例如以下顺序完毕这篇笔记: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScript ...
随机推荐
- Pass Infrastructure基础架构(上)
Pass Infrastructure基础架构(上) Operation Pass OperationPass : Op-Specific OperationPass : Op-Agnostic De ...
- 用NVIDIA Tensor Cores和TensorFlow 2加速医学图像分割
用NVIDIA Tensor Cores和TensorFlow 2加速医学图像分割 Accelerating Medical Image Segmentation with NVIDIA Tensor ...
- 『言善信』Fiddler工具 — 8、Fiddler检查器(Inspectors)详解
目录 1.请求报文内容 2.响应报文内容 3.响应报文中Transformer选项说明 Inspectors意思是检查器.Inspectors可以使用多种方式,查看请求的请求报文和响应报文相关信息. ...
- 操作系统-gcc编译器驱动程序
gcc编译器驱动程序,读取x.c文件,翻译成可执行目标文件x 1.预处理阶段 预处理器(cpp)将x.c(源程序,文本文件)中的#等直接插入程序文本中,成为另一个c程序x.i(文本文件) 2.编译阶段 ...
- .NET Core/.NET5/.NET6 开源项目汇总1:常用必备组件
系列目录 [已更新最新开发文章,点击查看详细] 开源项目是众多组织与个人分享的组件或项目,作者付出的心血我们是无法体会的,所以首先大家要心存感激.尊重.请严格遵守每个项目的开源协议后再使用.尊 ...
- Java8的Stream API确实很牛,但性能究竟如何?
Stream Performance 已经对 Stream API 的用法鼓吹够多了,用起简洁直观,但性能到底怎么样呢?会不会有很高的性能损失?本节我们对 Stream API 的性能一探究竟. 为保 ...
- 第11章 PADS功能使用技巧(1)-最全面
一.如何走蛇形线? 蛇形线是布线过程中常用的一种走线方式,其主要目的是为了调节延时满足系统时序设计要求,但是设计者应该有这样的认识:蛇形线会破坏信号质量,改变传输延时,布线时要尽量避免使用,因此一块P ...
- Golang超时机制--2秒内某个函数没被调用就认为超时
Golang超时机制--2秒内某个函数没被调用就认为超时 需求描述 当一整套流程需要其他程序来调用函数完成时通常需要一个超时机制,防止别人程序故障不调你函数导致你的程序流程卡死 实现demo pack ...
- 42、sort命令
排序和把相同的放到一起: 42.1.sort命令介绍: sort命令是一个排序介绍,简而言之就是以什么为分割符,对第几列进行什么排序操作: 42.2.sort命令参数介绍: -u #去重,会直接把重复 ...
- 11、函数(def)
11.1.函数: 函数即变量 函数的作用域只跟函数声明时定义的作用域有关,跟函数的调用位置无任何关系 1.函数格式: def test(x): ''' 2*x+1 :param x:整形数字 :ret ...