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 ...
随机推荐
- 开放式神经网络交换-ONNX(上)
目的 本文档包含ONNX语义的规范性规范. "onnx"文件夹下的.proto和.proto3文件构成了用协议缓冲区定义语言编写的语法规范..proto和.proto3文件中的注释 ...
- selenium css定位元素
CSS 选择器: 常见符号: #表示 id选择器 .表示 class选择器 >表示子元素,层级 一个空格也表示子元素,但是是所有的后代子元素,相当于 xpath 中的相对路径 一.css:属性定 ...
- HTML基本标签及语法
HTML简介 什么是HTML 本文素材来源于黑马程序员Pink老师 HTML 指的是超文本标记语言(Hyper Text Markup Language) ,它是用来描述网页的一种语言. HTML 不 ...
- C# —— 点击按钮动态打开ComboBox
网上搜索了好多资料,大多是重绘ComboBox或者使用自定义控件创建一个全新的ComboBox(并非基于window的ComboBox). 对于菜鸟的我,实现太麻烦,有些代码理解起来困难,但是项目比较 ...
- 《Docker基础与实战,看这一篇就够了》
什么是Docker? Docker 使用 Google 公司推出的 Go 语言 进行开发实现,基于 Linux 内核的 cgroup,namespace,以及 AUFS 类的 Union FS 等技术 ...
- Visual Studio 2019本地不能运行Azure Functions
最近一个项目,需要维护同事写得代码,主要是一堆基于 .net core 3.1 的 Azure Functions.想起2年前第一次接触 Azure Functions(那次是基于.net frame ...
- 管理后台Vue
管理后台 遇到的问题 搭建 基于vue 3.0 Vue CLI 4.x Ant Design Vue 2.0 搭建后台管理系统 Ant Design Vue 2.0 npm i --save ant- ...
- DOS命令行(10)——reg/regini-注册表编辑命令行工具
注册表的介绍 注册表(Registry,台湾.港澳译作登錄檔)是Microsoft Windows中的一个重要的数据库,用于存储系统和应用程序的设置信息. 1. 数据结构 注册表由键(key,或称 ...
- 【.NET 与树莓派】LED 数码管驱动模块——TM1638
LED 数码管,你可以将它看做是 N 个发光二级管的组合,一个灯负责显示一个段,七个段组合一位数字,再加一个小数点,这么一来,一位数码管就有八段.一般,按照顺时针的方向给每个段编号. 上图中的 h 就 ...
- Nginx网站服务
1.常见的网站服务 静态网站服务: Apache服务 nginx服务 动态网站服务: Tomcat服务 PHP 2.nginx网站服务特点 (1)nginx具有高并发(特别是静态资源).占用系统资源少 ...