291.你如何声明命名空间?
尽管 JavaScript 缺少命名空间,但我们可以使用 Objects 、 IIFE 来创建命名空间。
使用对象字面量表示法:让我们将变量和函数包装在充当命名空间的对象字面量中。之后,您可以使用对象表示法访问它们
var namespaceOne = { function func1() { console.log("This is a first definition"); } } var namespaceTwo = { function func1() { console.log("This is a second definition"); } } namespaceOne.func1(); // This is a first definition namespaceTwo.func1(); // This is a second definition
使用 IIFE(立即调用函数表达式): IIFE 的外一对括号为其内部的所有代码创建了一个局部作用域,并使匿名函数成为一个函数表达式。因此,您可以在两个不同的函数表达式中创建相同的函数来充当命名空间。
(function() { function fun1(){ console.log("这是第一个定义"); } fun1(); }()); (function() { function fun1(){ console.log("这是第二个定义"); } fun1(); }());
使用块和 let/const 声明:在 ECMAScript 6 中,您可以简单地使用块和 let 声明来将变量的范围限制为块。
{ let myFunction= function fun1(){ console.log("这是第一个定义"); } myFunction(); } //myFunction(): ReferenceError: myFunction 未定义。 { let myFunction= function fun1(){ console.log("这是第二个定义"); } myFunction(); } //myFunction(): ReferenceError: myFunction 未定义。
294.如何动态加载 CSS 和 JS 文件?
您可以在 DOM 中创建 link 和 script 元素,并将它们作为 child 附加到 head 标记。让我们创建一个函数来添加脚本和样式资源,如下所示,
function loadAssets(filename, filetype) { if (filetype == "css") { // External CSS file var fileReference = document.createElement("link") fileReference.setAttribute("rel", "stylesheet"); fileReference.setAttribute("type", "text/css"); fileReference.setAttribute("href", filename); } else if (filetype == "js") { // External JavaScript file var fileReference = document.createElement('script'); fileReference.setAttribute("type", "text/javascript"); fileReference.setAttribute("src", filename); } if (typeof fileReference != "undefined") document.getElementsByTagName("head")[0].appendChild(fileReference) }
295.在 DOM 中查找 HTML 元素的不同方法有哪些?
如果要访问 HTML 页面中的任何元素,则需要从访问文档对象开始。稍后您可以使用以下任何一种方法来查找 HTML 元素,
1.document.getElementById(id):通过Id查找元素
2.document.getElementsByTagName(name):通过标签名查找元素
3.document.getElementsByClassName(name):通过类名查找元素
296.什么是jQuery?
jQuery 是一个流行的跨浏览器 JavaScript 库,它通过最小化浏览器之间的差异来提供文档对象模型 (DOM) 遍历、事件处理、动画和 AJAX 交互。它以其“少写,多做”的理念而广为人知。例如,您可以使用 jQuery 在页面加载时显示欢迎消息,如下所示,
$(document).ready(function(){ // 它选择文档并在页面加载时应用该功能 alert('Welcome to jQuery world'); });
297.什么是 V8 JavaScript 引擎?
V8 是 Google Chrome 浏览器使用的开源高性能 JavaScript 引擎,用 C++ 编写。它也在 node.js 项目中使用。它实现了 ECMAScript 和 WebAssembly,并在 Windows 7 或更高版本、macOS 10.12+ 和使用 x64、IA-32、ARM 或 MIPS 处理器的 Linux 系统上运行。
注意:它可以独立运行,也可以嵌入到任何 C++ 应用程序中。
304.列出 ES6 的一些特性?
下面是 ES6 的一些新特性的列表,
1.支持常量或不可变变量
2.对变量、常量和函数的块范围支持
3.箭头函数
4.默认参数
5.Rest and Spread 参数
6.Template Literals(模板字符串)
7.多行字符串
8.解构赋值
9.增强的对象文字
10.Promises
11.Classes
12.Modules
305.什么是 ES6?
ES6 是 javascript 语言的第六版,它于 2015 年 6 月发布。它最初被称为 ECMAScript 6 (ES6),后来更名为 ECMAScript 2015。几乎所有现代浏览器都支持 ES6,但对于旧浏览器有很多转译器,比如 Babel.js 等。
306.我可以重新声明 let 和 const 变量吗?
不,您不能重新声明 let 和 const 变量。如果你这样做,它会抛出以下错误
Uncaught SyntaxError: Identifier 'someVariable' has already been declared
说明:带有var关键字的变量声明引用了一个函数作用域,由于提升特性,该变量被视为在封闭作用域的顶部声明。因此,对同一个提升变量做出贡献的所有多个声明都没有任何错误。让我们举个例子,为 var 和 let/const 变量在同一范围内重新声明变量。
var name = 'Haiyong'; function myFunc() { var name = 'Nick'; var name = 'Abraham'; // 在同一功能块中重新分配 alert(name); // Abraham } myFunc(); alert(name); // Haiyong
块范围的多声明抛出语法错误,
let name = 'Haiyong'; function myFunc() { let name = 'Nick'; let name = 'Abraham'; // 未捕获的语法错误:标识符"name"已被声明 alert(name); } myFunc(); alert(name);
312.什么是标记模板?
标记模板是模板的高级形式,其中标记允许您使用函数解析模板文字。tag 函数接受第一个参数作为字符串数组,其余参数作为表达式。此函数还可以根据参数返回操作过的字符串。让我们看看组织中 IT 专业技能集的这种标记模板行为的使用情况,
var user1 = 'Haiyong'; var skill1 = 'JavaScript'; var experience1 = 15; var user2 = 'CSDN'; var skill2 = 'JavaScript'; var experience2 = 5; function myInfoTag(strings, userExp, experienceExp, skillExp) { var str0 = strings[0]; // "Mr/Ms. " var str1 = strings[1]; // " is a/an " var str2 = strings[2]; // "in" var expertiseStr; if (experienceExp > 10){ expertiseStr = 'expert developer'; } else if(skillExp > 5 && skillExp <= 10) { expertiseStr = 'senior developer'; } else { expertiseStr = 'junior developer'; } return ${str0}${userExp}${str1}${expertiseStr}${str2}${skillExp}; } var output1 = myInfoTag`Mr/Ms. ${ user1 } is a/an ${ experience1 } in ${skill1}`; var output2 = myInfoTag`Mr/Ms. ${ user2 } is a/an ${ experience2 } in ${skill2}`; console.log(output1);// Mr/Ms. Haiyong is a/an expert developer in JavaScript(是一位 JavaScript 专家开发人员) console.log(output2);// Mr/Ms. CSDN is a/an junior developer in JavaScript(
313.什么是原始字符串?
ES6 提供了一个原始字符串特性,使用该String.raw()方法来获取模板字符串的原始字符串形式。此功能允许您在输入原始字符串时访问它们,而无需处理转义序列。例如,用法如下,
var calculationString = String.raw `The sum of numbers is \n${1+2+3+4}!`; console.log(calculationString); // The sum of numbers is 10 如果不使用原始字符串,将通过多行显示输出来处理换行符序列 var calculationString = `The sum of numbers is \n${1+2+3+4}!`; console.log(calculationString); // The sum of numbers is // 10 此外,原始属性可用于标记函数的第一个参数 function tag(strings) { console.log(strings.raw[0]); }
314.什么是解构赋值?
解构赋值是一个 JavaScript 表达式,它可以将数组中的值或对象中的属性解包为不同的变量。
让我们使用解构赋值从数组中获取月份值
var [one, two, three] = ['JAN', 'FEB', 'MARCH']; console.log(one); // "JAN" console.log(two); // "FEB" console.log(three); // "MARCH" 并且您可以使用解构赋值获取对象的用户属性, var {name, age} = {name: 'Haiyong', age: 22}; console.log(name); // Haiyong console.log(age); // 22
315.解构赋值中的默认值是什么?
如果在解构赋值期间从数组或对象中解压缩出来的值未定义,则可以为变量分配一个默认值。它有助于避免为每个分配单独设置默认值。让我们以数组和对象用例为例,
数组解构:
var x, y, z;
[x=2, y=4, z=6] = [10];
console.log(x); // 10
console.log(y); // 4
console.log(z); // 6
对象解构:
var {x=2, y=4, z=6} = {x: 10};
console.log(x); // 10
console.log(y); // 4
console.log(z); // 6
316.你如何在解构赋值中交换变量?
如果不使用解构赋值,交换两个值需要一个临时变量。而使用解构功能,可以在一个解构表达式中交换两个变量值。让我们在数组解构赋值中交换两个数字变量,
var x = 10, y = 20;
[x, y] = [y, x];
console.log(x); // 20
console.log(y); // 10
317.什么是增强的对象字面量?
对象字面量可以很容易地快速创建带有花括号内的属性的对象。例如,它为公共对象属性定义提供了更短的语法,如下所示。
//ES6 var x = 10, y = 20 obj = { x, y } console.log(obj); // {x: 10, y:20} //ES5 var x = 10, y = 20 obj = { x : x, y : y} console.log(obj); // {x: 10, y:20}