注留言点赞,带你了解最流行的软件开发知识与最新科技行业趋势。
JavaScript 中变量的类型转换既可以手动进行也可以显式进行;我们只需要手动编写函数名称或方法。这被称为显式类型转换,而 JavaScript 中的类型强制是 JavaScript 中变量数据类型隐式转换的过程。
TypeScript 中的类型转换可以是隐式的(这是在代码执行期间自动完成的)或显式的(这是由开发人员完成的)。TypeScript 文件将在将代码从JavaScript转换为 TypeScript 后检查错误,因为TypeScript具有严格的类型检查。
我们知道,JavaScript中的类型转换是指JavaScript中显式类型转换的过程;我们知道JavaScript中有五种数据类型,分别是String、number、boolean、object和function。但是我们只能在其中三个中使用类型转换,它们是数字、字符串和布尔值。
在 TypeScript 中,既有双重相等运算符(==,称为松散相等运算符),也有三重相等运算符(===,称为严格相等运算符)。我们使用这两个运算符来比较值的相等性。
现在让我们看看在 TypeScript 中阅读不同的过程及其各自的方法。
在这个方法中,数字类型被转换为 JavaScript 中的字符串数据类型。
让我们借助一个示例来了解这一点:
String():无论我们在String()中写入什么,无论数据类型如何,数据类型都会转换为字符串类型。
让我们先看看语法,然后是示例:
String(n)
这里括号内的n是指要转换成字符串的值。
现在让我们在示例中实现语法:
String(1520)
String(1234)
"1520"
"1234"
在上面的代码中,我们通过在字符串语法中写入值,将值从数字转换为字符串。在你的编辑器中运行上面的代码以获得更好更清晰的解释。
在字符串转换中,有一些方法。它们是:
现在让我们借助示例详细了解每种方法的使用:
此 JavaScript 方法将数值转换为四舍五入的字符串符号。
让我们先看看语法,然后是示例:
n.toExponential()
这里的.toEponential 方法是用来转换成字符串指数形式(e+number)...
您可以在此处了解更多信息。
现在让我们在示例中实现语法:
let n=12.654;
console.log(n.toExponential());
let n=12.654;
console.log(n.toExponential());
在上面的示例中,我们输入了一个数字,然后以指数形式打印它,其数据类型为字符串。
此方法将数字转换为固定长度的字符串,我们提供:
让我们先看看语法,然后是示例:
n.toFixed()
这里的 . toEponential方法用于将数字转换为其字符串固定形式。
现在让我们在示例中实现语法:
let n=152.9054;
console.log(n.toFixed());
let n1=69.156;
console.log(n1.toFixed(2));
152
69.15
在上面的例子中,我们将上面的数字转换成字符串,通过使用.toFixed方法,我们刚刚提到了我们要打印小数点后的位数;也就是说,如果我们不提及任何内容,那么默认情况下,用户会将其视为零,并且不会在小数点后打印任何内容。在你的编辑器中运行上面的代码以获得更好更清晰的解释。
用于打印小数点后的数字,数据类型为字符串。
让我们先看看语法,然后是示例:
n.toExponential()
这里的 .toEponential方法是用来转换成字符串指数形式(e+number)...
现在让我们在示例中实现语法:
let n=12.654;
console.log(n.toFixed());
let n1=18.124;
console.log(n1.toFixed(1));
12.654
18.12
在上面的示例中,我们首先将数字 (n) 作为输入,然后使用该 .toFixed()函数,我们将数字从字符串中固定打印出来。在固定函数中,如果我们在可选参数中没有提及任何内容,那么它会将其视为零并打印整个值。如果我们在可选参数括号中提到任何数字,那么它只会从小数部分中排除值的计数,并将打印转换后的字符串的其余部分。
在这个方法中,我们将看到如何借助各种内置类型将字符串转换为数字数据类型。
数字转换方法如下:
现在让我们详细了解它们中的每一个:
在此方法中,我们只是将字符串值和布尔值转换为数字数据类型。
让我们先看看语法,然后是示例:
Number(n)
这里使用 Number 方法将 (n) 可以是字符串或布尔值转换为数字数据类型。
现在让我们在示例中实现语法:
Number('123');
Number('1520');
Number('5969');
Number(actual);// true in numeric form is 1 while false in numeric form is 0
123
1520
5969
1
Number() 我们已经通过编写函数将值从字符串或布尔数据类型显式转换为数字数据类型。在你的编辑器中运行上面的代码以获得更好更清晰的解释。
它用于仅将数字字符串值转换为字符串,条件是第一部分必须是数字类型。
句法::
parseInt(numeric_stringpart,radixpart)
例子:
parseInt(1520nlcdj)
parseInt('qwer@12222')
1520
Nan
在第二个输出行中,输出将是 Nan,因为它不满足第一部分必须是数字类型的条件。
它用于将字符串转换为其浮点数。
让我们看看下面的语法,然后是一个例子:
parseFloat(n)
这里 n 是将被转换为数字数据类型的变量。
parseFloat('126.7655')
126.7655
在上面的示例中,我们已将字符串转换为其父数字形式。
在此,我们将值从数字类型转换为布尔类型。
Boolean(n)
这里括号内的 n 值将被转换为 boolean 类型。
现在让我们看一个例子:
Boolean(1520)
Boolean(' ')
Boolean('yash')
Boolean(null)
true
true
true
在你的编辑器中运行上面的代码以获得更好更清晰的解释。
类型强制本身就是类型转换,但这里完成的类型转换是隐式的;转换和强制转换是相同的,唯一的区别是隐式和显式类型转换。
类型强制也用于相同的数据类型:数字、字符串和布尔值。众所周知,TypeScript 是 JavaScript 本身的超集,因此任何有效的 JavaScript 代码都是有效的 TypeScript 代码。
TypeScript 中的类型强制仅强制转换为字符串、数字和布尔基本类型,就像在类型转换中一样。在 TypeScript 中,我们无法将值类型强制转换为对象或函数。
TypeScript 有两种典型的强制转换形式,即隐式强制转换和显式强制转换。
现在让我们看看如何在每种类型中执行类型强制转换:
它用于将非字符串值转换为字符串类型。
让我们借助一个例子来理解这一点:
console.log('15'+20);
console.log('29'+null);
console.log(50+'45'+null)
'1520'
'29null'
'5045null'
字符串强制转换是使用JavaScript中的+ 运算符执行的。因此,如果我们对任何字符串使用 + 运算符,它将被转换为字符串类型。
然后使用带有变量的数学运算符,我们可以将任何非数字类型转换为数字类型。但是,我们不能在数字强制转换中使用 + 运算符。
让我们借助一个例子来理解这一点:
console.log('34'-34);
console.log('6'*8);
console.log('45'/45);
console.log('15'%5);
0
48
1
0
在这里,我们使用数学运算符将非数值转换为数值;我们可以不使用 + 运算符。在你的编辑器中运行上面的代码以获得更好更清晰的解释。
在这种类型的连接中,布尔值被转换为数学值。
让我们借助一个例子来理解这一点:
console.log(false-5);
console.log(true+5);
-5
6
因为我们知道在数值上true的值为1,false在数值上的值为0,所以我们可以根据它来计算。
将网页转换为图片,您可以使用一些库和工具来实现。在前端开发中,常用的库包括html2canvas和dom-to-image。这些库允许您将HTML元素转换为图像。
下面是使用html2canvas库将网页转换为图像的示例代码:
<!DOCTYPE html>
<html>
<head>
<title>Convert Webpage to Image</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.3.2/html2canvas.min.js"></script>
</head>
<body>
<div id="capture">
<!-- 在这里放置您想要转换为图像的HTML内容 -->
<h1>Hello, World!</h1>
<p>This is an example of converting a webpage to an image.</p>
</div>
<button onclick="convertToImage()">Convert to Image</button>
<script>
function convertToImage() {
html2canvas(document.getElementById("capture")).then(canvas => {
var img = canvas.toDataURL("image/png");
var link = document.createElement("a");
link.href = img;
link.download = "webpage.png";
link.click();
});
}
</script>
</body>
</html>
上述代码使用html2canvas库来将id为"capture"的div元素转换为图像。当用户点击"Convert to Image"按钮时,convertToImage()函数会被调用。该函数使用html2canvas对指定的HTML元素进行截图,并将结果转换为一个包含图像数据的URL。然后,创建一个隐藏的链接元素,将图像数据URL设置为链接的href属性,并模拟点击该链接以下载图像。最后,图像将以PNG格式下载到用户的设备上。
请注意,html2canvas库有一些限制和局限性,例如跨域图像的限制、CSS样式的复杂性等。确保在使用这些库时仔细测试和验证您的代码,并查阅相关文档以了解更多细节和选项。
者:前端小智 来源:大迁世界
.md文件是markdown的一种标记语言,和html比较起来,更简单快捷,主要体现在:标记符的数量和书写上。
方式一:使用i5ting_toc插件
需要先安装npm(安装node.js后会自带npm),然后才能安装i5ting插件:
npm install i5ting_toc -g
执行命令行生成html文件,在输入前要进入到对应根目录下:
i5ting_toc -f **.md
需要注意的是:写md文档的特殊符号时记得添加空格。小技巧:如何快速在当前目录打开cmd?选择当前目录,按住shift,然后鼠标右键在此处打开命令窗口(在此处打开powerShell窗口)。
方式二:使用gitbook
同样先需要安装node,然后运行:
npm i gitbook gitbook-cli -g
生成md文件,这个命令会生成相应的md的文件,然后在相应的文件里写你的内容即可:
gitbook init
md转html,生成一个_doc目录,打开就可以看到你html文件了。
gitbook build
方式三:利用前端代码
实现原理是采用node.js搭建服务器,读取md文件转化为html片断。浏览器发送ajax请求获取片段后再渲染生成html网页。
node代码:
var express = require('express');
var http = require('http');
var fs = require('fs');
var bodyParser = require('body-parser');
var marked = require('marked'); // 将md转化为html的js包
var app = express();
app.use(express.static('src')); //加载静态文件
var urlencodedParser = bodyParser.urlencoded({ extended: false });
app.get('/getMdFile',urlencodedParser, function(req, res) {
var data = fs.readFileSync('src/test.md', 'utf-8'); //读取本地的md文件
res.end(JSON.stringify({
body : marked(data)
}));
} );
//启动端口监听
var server = app.listen(8088, function () {
var host = server.address().address;
var port = server.address().port;
console.log("应用实例,访问地址为 http://%s:%s", host, port)
});
前端html:
<div id="content"> <h1 class="title">md-to-HTML web app</h1> <div id="article"> </div></div><script type="text/JavaScript" src="js/jquery-1.11.3.min.js"></script><script> var article = document.getElementById('article'); $.ajax({ url: "/getMdFile", success: function(result) { console.log('数据获取成功'); article.innerHTML = JSON.parse(result).body; }, error: function (err) { console.log(err); article.innerHTML = '<p>获取数据失败</p>'; } });</script>
*请认真填写需求信息,我们会在24小时内与您取得联系。