IT评测·应用市场-qidao123.com

标题: Javascript前端面试基础4【每日学习并更新10】 [打印本页]

---

作者: 欢乐狗    时间: 2024-7-31 12:16
标题: Javascript前端面试基础4【每日学习并更新10】
同步和异步的区别

• 同步:浏览器访问服务器请求，用户看得到页面革新，重新发请求等请求完，页面革新,新内容出现，用户看到新内容,进行下一步操作
  
• 异步:浏览器访问服务器请求，用户正常操作，浏览器后端进行请求。等请求完，页面不革新，新内容也会出现，用户看到新内容
  

渐进增强和优雅降级

• 渐进增强︰针对低版本浏览器进行构建页面，包管最基本的功能，然后再针对高级浏览器进行效果、交互等改进和追加功能达到更好的用户体验。
  
• 优雅降级:一开始就构建完备的功能，然后再针对低版本浏览器进行兼容
  

 defer和async

• defer并行加载js文件，会按照页面上script标签的次序执行
  
• async并行加载js 文件，下载完成立即执行，不会按照页面上script标签的次序执行
  

 说说严格模式的限制

• 变量必须声明后再使用
  
• 函数的参数不能有同名属性，否则报错不能使用with语句
  
• 禁止this指向全局对象
  

attribute和property的区别是什么

• attribute 是dom 元素在文档中作为html标签拥有的属性;
  
• property 就是dom元素在js 中作为对象拥有的属性；
  
• 对于html的标准属性来说，attribute和property是同步的，是会自动更新的
  
• 但是于自义的属性来说，他们是不同步的
  

   在JavaScript中，特殊是在操作HTML文档时，常常会遇到attribute（属性）和property（特性）这两个概念。尽管它们在某些情况下看起来相似，但它们实际上代表着不同的概念，并用于不同的目的。明白它们之间的区别对于有效地使用JavaScript进行DOM操作非常重要。
  Attribute（属性）

• 界说：HTML标签中的属性。比方，在<input type="text" value="Hello">中，type和value都是属性。
  
• 操作方式：通过getAttribute()、setAttribute()、hasAttribute()和removeAttribute()等DOM方法来操作。
  
• 用途：界说HTML标签的行为或表现。HTML属性只能在HTML标签中指定，不能在JavaScript中直接创建。
  

Property（特性）

• 界说：DOM对象中用于表现HTML标签属性的值。比方，对于上面的<input>标签，element.type和element.value都是特性。
  
• 操作方式：直接通过JavaScript代码访问和修改，如element.propertyName。
  
• 用途：表现HTML标签在DOM中的状态。特性可以在JavaScript中动态创建和修改。
  

Attribute与Property的区别

• 界说方式：属性是在HTML标签中界说的，而特性是在DOM对象中界说的。
  
• 同步性：一些HTML属性与DOM特性是同步的，即修改其中一个，另一个也会相应改变。但这并不总是如许，特殊是在一些自界说属性或特定属性（如input的value）上。
  
• 用途：属性重要用于界说HTML标签的初始状态和行为，而特性用于表现这些标签在DOM中的当前状态，并答应JavaScript动态地读取和修改这些状态。
  

示例

1. //html
2. <input id="myInput" type="text" value="Hello">

复制代码

1. //javascript
2. var input = document.getElementById('myInput');  
3.   
4. // Property  
5. console.log(input.type); // "text"  
6. input.value = 'World'; // 修改特性，也会同步修改属性  
7.   
8. // Attribute  
9. console.log(input.getAttribute('type')); // "text"  
10. input.setAttribute('type', 'password'); // 修改属性，不会同步修改特性（在某些浏览器中可能例外）

复制代码

总的来说，明白attribute和property的区别对于进行有效的DOM操作非常重要，特殊是在涉及HTML标签的初始化和动态修改时。
谈谈你对ES6的明白

• 新增模板字符串（为JavaScript提供了简单的字符串插值功能).
  
• 箭头函数
  
• for-of(用来遍历数据—比方数组中的值。
  
• arguments 对象可被不定参数和默认参数完美代替。
  
• ES6将promise对象纳入规范，提供了原生的Promise 对象。
  
• 增长了let和const下令，用来声明变量。
  
• 增长了块级作用域。
  
• let下令实际上就增长了块级作用域。
  
• 引入module模块
  

   ES6（ECMAScript 2015）是JavaScript的一个重要版本，它引入了许多新的语言特性和API，使得JavaScript更增强大和机动。以下是对ES6的详细解析：
  一、新特性概览

  

• 变量声明
  
  
  
  • let：用于声明块级作用域的局部变量，解决了var声明变量时作用域和预解析带来的题目。
    
  • const：用于声明一个只读的常量，一旦声明，其值就不能被改变。
    
  
  
• 函数
  
  
  
  • 箭头函数：提供了一种更轻便的函数誊写方式，并且不绑定自己的this，arguments，super，或new.target。这些函数更适适用于非方法函数，并且它们不能用作构造函数。
    
  • 默认参数值：答应在函数界说时为参数指定默认值，如许调用函数时纵然没有传入这些参数，它们也会被赋予默认值。
    
  • 睁开运算符：答应一个数组表达式或字符串在需要多个参数（用于函数调用）或多个元素（用于数组字面量）的地方睁开。
    
  
  
• 模板字符串
  
  
  
  • 答应嵌入表达式，并且可以通过多行字符串和字符串插值等功能来简化字符串的拼接和处理惩罚。
    
  
  
• 解构赋值
  
  
  
  • 答应从数组或对象中提取数据，并将其赋值给声明的变量，这大大简化了数据访问的语法。
    
  
  
• 新数据结构
  
  
  
  • Set：答应你存储任何类型的唯一值，无论是原始值或者是对象引用。
    
  • Map：提供了一种存储键值对的有序集合，其中的每个元素都是一个键值对。
    
  
  
• Promises
  
  
  
  • 是异步编程的一种解决方案，比传统的回调函数方式更加优雅和强大。它代表了一个尚未完成但预期将来会完成的异步操作的结果。
    
  
  
• 模块化
  
  
  
  • ES6引入了模块化的语法，使得JavaScript可以更方便地编写和组织大型应用程序。通过import和export语句，可以实现模块的导入和导出。
    
  
  
• 类
  
  
  
  • ES6引入了类的语法，使得JavaScript支持基于类的面向对象编程。类是一种特殊的函数，用于创建对象。
    
  
  
• 其他新特性
  
  
  
  • 包括Symbol类型、迭代器（Iterator）、天生器（Generator）等，这些新特性为JavaScript提供了更多的表达本领和机动性。
    
  
  

  二、实际应用

  ES6的这些新特性在实际开发中得到了广泛的应用。比方，箭头函数使得函数式编程在JavaScript中变得更加方便；模板字符串简化了字符串的拼接和处理惩罚；解构赋值进步了代码的可读性和轻便性；Promises和async/await使得异步编程变得更加简单和直观。
   什么是面向对象编程及面向过程编程，它们的异同和优缺点

• 面向过程就是分析出解决题目所需要的步骤，然后用函数把这些步骤一步一步实现，使用的时候一个一个依次调用就可以了
  
• 面向对象是把构成题目变乱分解成各个对象，创建对象的目的不是为了完成一个步骤，而是为了描叙某个事物在整个解决题目的步骤中的行为
  
• 面向对象是以功能来划分题目，而不是步骤
  

面向对象编程头脑

• 基本头脑是使用对象，类，继续,封装等基本概念来进行程序计划优点
  

• 易维护
  
• ·接纳面向对象头脑计划的结构，可读性高，由于继续的存在，纵然改变需求，那么维护也只是在局部模块，以是维护起来是非常方便和较低资本的
  
• 易扩展
  
• 开发工作的重用性、继续性高，降低重复工作量。缩短了开发周期
  

对web标准、可用性、可访问性的明白

• ·可用性（Usability):产品是否容易上手，用户能否完成任务，服从怎样，以及这过程中用户的主观感受可好，是从用户的角度来看产品的质量。可用性美意味着产品格量高，是企业的焦点竞争力
  
• .可访问性(Accessibility): Web内容对于残障用户的可阅读和可明白性
  
• 可维护性(Maintainability):一般包含两个条理，一是当体系出现题目时，快速定位并解决题目的资本，资本低则可维护性好。二是代码是否容易被人明白，是否容易修改和增强功能。
  

怎样通过JS判断一个数组

在JavaScript中，判断一个变量是否为数组，可以通过多种方式来实现。以下是一些常用的方法：
1. 使用Array.isArray()方法

Array.isArray()是ES5新增的方法，用于确定通报的值是否是一个Array。

1. const arr = [1, 2, 3];  
2. console.log(Array.isArray(arr)); // 输出：true  
3.   
4. const notArr = 'not an array';  
5. console.log(Array.isArray(notArr)); // 输出：false

复制代码

2. 使用instanceof操作符

instanceof操作符可以用来测试一个对象在其原型链中是否存在一个构造函数的prototype属性。

• instanceof 操作符只能用于对象，不能用于原始值（如数字、字符串、布尔值）。
  
• 假如 constructor.prototype 在 object 的原型链上不存在，那么纵然 object 是通过 constructor 创建的，instanceof 也会返回 false。这大概是由于原型链被修改过。
  

1. const arr = [1, 2, 3];  
2. console.log(arr instanceof Array); // 输出：true  
3.   
4. const notArr = 'not an array';  
5. console.log(notArr instanceof Array); // 输出：false
8. -------------------------------------------------------
9. function Car(make, model) {  
10.   this.make = make;  
11.   this.model = model;  
12. }  
13.   
14. const auto = new Car('Honda', 'Accord');  
15.   
16. console.log(auto instanceof Car);    // 输出：true  
17. console.log(auto instanceof Object); // 输出：true  
18. console.log(auto instanceof Array);  // 输出：false

复制代码

3. 使用Object.prototype.toString.call()方法【Jquery中使用】

这是一个更通用的方法，可以用来判断一个对象的类型。

1. const arr = [1, 2, 3];  
2. console.log(Object.prototype.toString.call(arr) === '[object Array]'); // 输出：true  
3.   
4. const notArr = 'not an array';  
5. console.log(Object.prototype.toString.call(notArr) === '[object Array]'); // 输出：false

复制代码

4. 使用constructor属性

constructor属性返回对创建此对象的数组函数的引用。

1. const arr = [1, 2, 3];  
2. console.log(arr.constructor === Array); // 输出：true  
3.   
4. const notArr = 'not an array';  
5. console.log(notArr.constructor === Array); // 输出：false

复制代码

免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。

---

欢迎光临 IT评测·应用市场-qidao123.com (https://dis.qidao123.com/)

Powered by Discuz! X3.4