刷题总结823

如何判断一个js对象是否是Array,arr为要判断的对象,其中最准确的方法是?
添加链接描述

var arr = [];
if (!Array.isArray) {
  Array.isArray = function(arg) {
    return Object.prototype.toString.call(arg) === '[object Array]';
  };
}
Array.isArray(arr);

判断一个对象是否属于数组,最好怎么做?

  1. typeof(arr),typeof返回的是基本数据类型及object,不会详细到array的,所以不行
  2. arr instanceof Array,这一点还不透彻,说的是在多iframe/window环境下,通过Instanceof来识别对象是否属于数组会出错
  3. arr.toString,直接使用toString函数自然是数组有什么就返回什么了,例如[1,2] => '1,2'
  4. Object.prototype.toString.call(arr) === '[object Array]';这才是正确的

JavaScript prototype 属性添加链接描述

在JavaScript中,prototype对象是实现面向对象的一个重要机制。
每个函数就是一个对象(Function),函数对象都有一个子对象 prototype对象,类是以函数的形式来定义的。prototype表示该函数的原型,也表示一个类的成员的集合

在这里插入图片描述

function A(x){
this.x = x;
}
A.prototype.x = 1;

function B(x){
this.x = x;
}
B.prototype = new A();
var a = new A(2), //a.x首先要在自己的构造函数中查找,没有采取原型上找,这里有this.x = x.所以a.x = 2;
b = new B(3);//B.prototype = new A();形成原型链
delete b.x;//但是delete只能删除自己的x不能删除父级的x.   
//b.x通过原型链找到构造函数A里面的this.x=x但是没有赋值,所以undefined
function A(x){
this.x = x;
}
A.prototype.x = 1; //将A的prototype.x赋值为1
//什么是protytype,也就是JS中的原型链机制,当读取A中的x时,如果A中找不到,则通过原型链去查找X
//在去new一个对象的时候会继承这个原型链
function B(x){
this.x = x;
}
B.prototype = new A();
//将B的原型链指向A,也就是B.prototype = {x:undefined}
var a = new A(2), b = new B(3);
delete b.x;
//最后结果中a.x,可以直接取到
//而b.x原本为3后来被删去,则进入原型链查找,为undefined

JS的每一个function都有一个prototype属性 ,该属性指向一个普通的Object。由这个function new出来的每一个实例都会带上一个__proto__的指针,指向prototype指向的那个Object。当把类的方法放到function的prototype里的时候,该prototype对象就会添加一个新的属性,那么每个实例都会获得该类的方法。
这就是基本的封装。即类的属性在构造方法里定义,类的方法在prototype里添加。
那为什么在原型上添加的方***被类的对象引用呢?
因为JS首先在该对象上查找方法,如没有则会去原型上查找。直到查找到Object跟类。
在这里插入图片描述

对于认为b.x = 1 的错误认知是对原型链理解的不够,那么什么时候去从原型上找属性呢,就是当实例的自身属性上没有该属性的时候就会去原型上找。本题中 delete b.x; 将b自身属性x 删除,再次获取b.x值就会从原型上面去找,b.__proto__ 属性指向 B.prototype, B.prototype等于 new A() 实例化对象,new A()实例化因为没有传值,所以 this.x = x 实例后对象x属性是undefined, 因为实例化对象已经有自身属性x, 并且x属性是undefined, 所以并不会去原型上找,最后 b.x = undefined

B.prototype = new A(); // B构造函数 把A构造函数的方法给到了原型对象中
var a = new A(2), b = new B(3);
// a实例化的是A函数,其中实例化后传入参数2所以 自己的属性有a.x = 2 ,__proto__指向的是A函数的原型对象也就是 a.__proto__.x = 1 . b实例化的B函数,也同样是传入参数3所以b.x = 3, 因为B函数的原型对象是实例化的A函数所以:b.__proto__.x = this.x = x (此时没有实参,赋值x=undefined) 也就是 b.__proto__.x = this.x = undefined
delete b.x; // 删除b.x 也就是删除b.x = 3
输出 a.x ,b.x // 如上所述,a.x = 2没受影响 ,b.x由于被删除需要查找自己的原型链找到B.prototype 中的 this.x = undefined

任意的数据类型+""即可将其转换成String字符串类型,这是一种隐式类型转换,由浏览器自动完成,实际上也是调用String()函数。

任意的数据类型 -0 即可将其转换成Number数值类型。

关于web表单登录中用到的图形验证码的实现:
服务器端生成验证码后一方面通过图片将验证码返回给客户端,同时在服务器端保存文本的验证码,由服务器端验证输入内容是否正确

this对象
在不手动改变this指向的前提下,this总是指向函数的直接调用对象
如果有new关键字,this指向new出来的那个对象
IE中attachEvent中的this总是指向全局对象window

1.在事件中,this指向触发这个事件的对象(特殊的是:IE中的attachEvent中的this总是指向全局对象window)。
2.this总是指向函数的直接调用者(而非间接调用者)
3.new后面就是构造函数,构造函数中的this指向的就是当前的对象

html5应该写成<br />换行符,<hr/>分割线
<p>段落元素
<div>块元素

CSS盒子模型中(因为padding是边框和内容的分割,这部分必然是透明的,除非设置背景色)是透明的,这部分可以显示背景()

Margin(外边距) - 清除边框外的区域,外边距是透明的。
Border(边框) - 围绕在内边距和内容外的边框。
Padding(内边距) - 清除内容周围的区域,内边距是透明的。
Content(内容) - 盒子的内容,显示文本和图像。
Margin
margin清除周围的元素(外边框)的区域。margin没有背景颜色,是完全透明的
Padding(填充)
当元素的 Padding(填充)(内边距)被清除时,所"释放"的区域将会受到元素背景颜色的填充。

两个关键词: 透明、显示背景。content、border都不是透明的; margin是透明的,但是不能显示背景;只有padding符合这两个条件。

while if 等不能改变作用域
with try-catch eval可以改变作用域链
with:像是bind,会改变绑定的环境,做到一些函数不用显式参数就能正确引用参数。
try…catch的catch:进入到catch分支,不管你愿不愿意,都会自动创建一个错误对象包裹你的错误处理。
eval:解析字符串,并作为js运行。可以理解为将解析后的字符串套进一个自己的全局window,并执行。

with 语句用于设置代码在特定对象中的作用域:

var qs1 = location.search.substring(1);
var hostname1 = location.hostname;
var url1 = location.href;
 
// 上面几行代码都包含了location对象,可使用with语句简写为以下形式
 
with(location){
	var qs2 = search.substring(1);
	var hostname2 = hostname;
	var url2 = href;
}

当Javascript执行一段with语句时,会创建对应的执行上下文,用location创建活动对象,并将其活动对象压入到with作用域链的顶端

<tr> table row, <th> table head, <td> tabel body
<dl> 定义列表(definition list),<dt>定义列表中的项目(即术语部分(definition term))。<dd> 定义列表中定义条目的定义部分(definition definition)。

h5新增的标签 :
video 表示一段视频并提供播放的用户界面
audio 表示音频
canvas 表示位图区域
source 为video和audio提供数据源
track 为video和audio指定字母
svg 定义矢量图
code 代码段
figure 和文档有关的图例
figcaption 图例的说明
main
time 日期和时间值
mark 高亮的引用文字
datalist 提供给其他控件的预定义选项
keygen 秘钥对生成器控件
output 计算值
progress 进度条
menu 菜单
embed 嵌入的外部资源
menuitem 用户可点击的菜单项
menu 菜单
header 定义了文档的头部区域
section 定义文档中的节(section、区段)。
nav 定义导航链接的部分
aside 定义页面独立的内容区域
article 定义页面的侧边栏内容。
footer 定义 section 或 document 的页脚

JavaScript的数据类型分为两种:原始类型(即基本数据类型)和对象类型(即引用数据类型):
基本类型:String、Number、Boolean、Null、Undefined、Symbol
引用类型:Object、Array、Function

JS中this关键字, 它代表函数运行时,自动生成的一个内部对象,只能在函数内部使用。
c, 全局函数调用时,this指向全局函数; 应该是指向调用全局函数的对象。

this有四种情况!
1)当在函数调用的时候指向widow
2)当方法调用的时候指向调用对象
3)当用apply和call上下文调用的时候指向传入的第一个参数
4)构造函数调用指向实例对象

iframe

iframe本身就不是动态语言,样式和脚本都需要额外导入。
1、创建比一般的 DOM 元素慢了 1-2 个数量级
iframe 的创建比其它包括 scripts 和 css 的 DOM 元素的创建慢了 1-2 个数量级,使用 iframe 的页面一般不会包含太多 iframe,所以创建 DOM 节点所花费的时间不会占很大的比重。但带来一些其它的问题:onload 事件以及连接池(connection pool)

2、阻塞页面加载
及时触发 window 的 onload 事件是非常重要的。onload 事件触发使浏览器的 “忙” 指示器停止,告诉用户当前网页已经加载完毕。当 onload 事件加载延迟后,它给用户的感觉就是这个网页非常慢。

window 的 onload 事件需要在所有 iframe 加载完毕后(包含里面的元素)才会触发。在 Safari 和 Chrome 里,通过 JavaScript 动态设置 iframe 的 SRC 可以避免这种阻塞情况

3、唯一的连接池
浏览器只能开少量的连接到 web 服务器。比较老的浏览器,包含 Internet Explorer 6 & 7 和 Firefox 2,只能对一个域名(hostname)同时打开两个连接。这个数量的限制在新版本的浏览器中有所提高。Safari 3+ 和 Opera 9+ 可同时对一个域名打开 4 个连接,Chrome 1+, IE 8 以及 Firefox 3 可以同时打开 6 个

绝大部分浏览器,主页面和其中的 iframe 是共享这些连接的。这意味着 iframe 在加载资源时可能用光了所有的可用连接,从而阻塞了主页面资源的加载。如果 iframe 中的内容比主页面的内容更重要,这当然是很好的。但通常情况下,iframe 里的内容是没有主页面的内容重要的。这时 iframe 中用光了可用的连接就是不值得的了。一种解决办法是,在主页面上重要的元素加载完毕后,再动态设置 iframe 的 SRC。

4、不利于 SEO
搜索引擎的检索程序无法解读 iframe。另外,iframe 本身不是动态语言,样式和脚本都需要额外导入。综上,iframe 应谨慎使用

标准盒子模型 = margin + border + padding + width (width = content )
IE盒子模型 = margin + width(width = border + padding + content )

A选项,'1’是字符串string,1是数字number。类型不一样,===下比较返回false。
B选项。
任何数值除以0都会导致错误而终止程序执行。但是在 JavaScript 中,会返回出特殊的值,因此不会影响程序的执行。
比0大的数除以0,则会得到无穷大,所以 js 用 Infinity 来显示出来。
也就是1/0得到的是Infinity。isNaN(1/0)返回的是false。但是isNaN(0/0)返回的就是true
3. C选项。
in操作符,对于数组属性需要指定数字形式的索引值来表示数组的属性名称(固有属性除外,如length)。
所以说在这里,1 in [1]并不是表示数字1在不在数组里。而是表示数组中含不含有1这个索引index值。
数组长度为1,所以只含有的index值为0,这个表达式返回fasle
4. D选项。
1 && 2 > 1,先判断右边的表达式,2>1返回true。1 && true返回的结果也是true。

对于D选项:’>'的优先级排在前,所以2>1 结果为1true
1&&true 结果为true,原因如下;
对于“&&”和‘||’的规律:
1、只要“||”前面为false,无论“||”后面是true还是false,结果都返回“||”后面的值。

2、只要“||”前面为true,无论“||”后面是true还是false,结果都返回“||”前面的值。

3、只要“&&”前面是false,无论“&&”后面是true还是false,结果都将返“&&”前面的值;

4、只要“&&”前面是true,无论“&&”后面是true还是false,结果都将返“&&”后面的值;

函数提升优先级高于变量提升

var a = 10;
function a(){}
console.log(typeof a)

首先使用var声明变量会造成变量提升,毫无疑问变量a会被置于代码块顶部,但是下方使用function关键字声明了函数a,函数声明也会提升至代码块顶部,而且优先级更高。
所以实际代码等价于

function a () {}
var a
a = 10
console.log(typeof a)

变量a会覆盖函数a,输出结果为number。
那如果这里使用关键词let呢,代码变为

let a = 10
function a () {}
console.log(typeof a)

这里明显会报错。前面提到,函数声明会优先于变量声明,会被提升至代码块顶部,所以会先声明function a ,再执行let a = 10;,但是a已被声明过,不能再使用let 关键字进行重声明。所以这里应当注意函数声明提升的问题,即便let声明变量的语句被置于代码块顶部,但是需要注意函数声明提升。

将一对象的背景色透明度改为80%的声明
ie兼容性写法,filter:alpha(opacity:80);平时就用这一种,没接触过其他写法

 []是属于Array 

链接:

// 1. isNaN()函数用来判断一个数是否是NaN;
// 只有一个值是NaN或者能被转换为NaN的时候才返回true
console.log(isNaN(‘e’));//true,因为e可以被转换为NaN
console.log(isNaN(‘11’));//false,因为字符串可以被转换为数字,不能被转为NaN
console.log(isNaN(null));//false,因为null可以被转换为0,不能被转为NaN
console.log(isNaN(NaN));// true,NaN返回true

        // 2. parseInt(string,raix)函数有两个参数
        // 2.1 注意:string字符串只会被解析从第一个字符开始直到不是数字的字符部分
        console.log(parseInt('223'));//223
        // 2.2 当字符串中间存在非数字,那么就只解析前面是数字的部分字符
        console.log(parseInt('22e3'));//22
        // 2.3 如果字符串中第一个字符就不是数字,那么返回NaN 
        console.log(parseInt('e21'));//NaN
        
        // 对于parseInt()函数还有一个易考点,就是利用数组的下标,还记得parseInt()函数的第二个参数吗?
        // 2.4 parseInt()函数的第二个参数指的就是进制,这个参数小于2或者大于36的时候,都会返回NaN 
        console.log(parseInt(1,1));//NaN ,因为第二个参数是1表示1进制<2,所以错误
        console.log(parseInt(1,2));//1,因为表示二进制 =2,在范围内
        // 2.5 我们一般都是省略这个参数的,这个时候就是默认为10进制
        console.log(parseInt(99));//99
        // 2.6 我们第二个参数使用0的时候也是使用十进制
        console.log(parseInt(99,0));//99
        // 2.7 如果第一个参数前缀使用0x/0X则表示使用16进制
        console.log(parseInt(0x99));//153=16*9+9
        console.log(parseInt(0x99,10));//如果第一个参数使用了0x表示十六进制,那么第二个参数设置了值也无效
        
        // 2.8 看一个实例,对于数组
        var arr=[1,2,3,2,5];
        console.log(arr.map(parseInt));//[1, NaN, NaN, 2, NaN]
        // arr.map方法就是对于数组arr里面的每一项都去使用方法里面的函数,最后返回新数组
        // 因为map方***有索引,所以实际上就是 
        parseInt(1,0);//1,因为0表示十进制
        parseInt(2,1);//1进制<2,所以错啦!
        parseInt(3,2);// 2进制,但是3不在0——2范围内(3应该改为11),所以不符合2进制要求
        parseInt(2,3);//符合,因为三进制是0-3,而2在范围内
        parseInt(5,4);//4进制不包括5,所以NaN
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值