js再学习

帝黎亚

已于 2022-02-17 18:52:44 修改

阅读量256

点赞数

文章标签： javascript 开发语言

于 2022-02-11 23:27:22 首次发布

本文链接：https://blog.csdn.net/qq_52109865/article/details/122887680

版权

基础

今天找对象，啊不，是学习对象
在 JavaScript 中，对象是王。如果理解了对象，就理解了 JavaScript。
在 JavaScript 中，几乎“所有事物”都是对象。
布尔是对象（如果用 new 关键词定义）
数字是对象（如果用 new 关键词定义）
字符串是对象（如果用 new 关键词定义）
日期永远都是对象
算术永远都是对象
正则表达式永远都是对象
数组永远都是对象
函数永远都是对象
对象永远都是对象
所有 JavaScript 值，除了原始值，都是对象
那么为了找对象（bushi），我们先了解什么是原始值

原始值指的是没有属性或方法的值。

原始数据类型指的是拥有原始值的数据。

JavaScript 定义了 5 种原始数据类型：

string
number
boolean
null
undefined
原始值是一成不变的（它们是硬编码的，因此不能改变）

对象就是包含变量的变量，JavaScript 变量能够包含单个的值，对象也是变量。但是对象能够包含很多值，值按照名称 : 值对的形式编写（名称和值以冒号分隔）。
比如：

var person = {firstName:"Bill", lastName:"Gates", age:62, eyeColor:"blue"};

类似于python的字典

如何创建对象

创建 JavaScript 对象
通过 JavaScript，我们能够定义和创建自己的对象。
有不同的方法来创建对象：

定义和创建单个对象，使用对象文字。
定义和创建单个对象，通过关键词 new。
定义对象构造器，然后创建构造类型的对象。
在 ECMAScript 5 中，也可以通过函数 Object.create() 来创建对象

比如：

var person = new Object();
person.firstName = "Bill";
person.lastName = "Gates";
person.age = 62;
person.eyeColor = "blue";

也可以写成

var person = {
    firstName:"Bill",
    lastName:"Gates",
    age:62,
    eyeColor:"blue"
};

js事件

HTML 事件是发生在 HTML 元素上的“事情”。
当在 HTML 页面中使用 JavaScript 时，JavaScript 能够“应对”这些事件
下面是 HTML 事件的一些例子：

HTML 网页完成加载
HTML 输入字段被修改
HTML 按钮被点击
通常，当事件发生时，用户会希望做某件事。

JavaScript 允许我们在事件被侦测到时执行代码。

下面是一些常见的 HTML 事件：

事件		描述
onchange	HTML 元素已被改变
onclick		用户点击了 HTML 元素
onmouseover	用户把鼠标移动到 HTML 元素上
onmouseout	用户把鼠标移开 HTML 元素
onkeydown	用户按下键盘按键
onload		浏览器已经完成页面加载

实例

简单的学习代码，实现点击后呈现时间
在这里插入图片描述
代码如下：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>js事件</title>
	</head>
	<body>
		<h1>js 事件</h1>
		<button onclick="document.getElementById('time').innerHTML=Date()">时间是？</button>
		<p id="time"></p>
	</body>
</html>

获取天津的天气

{"results":[{"location":{"id":"WWGQDCW6TBW1","name":"天津","country":"CN","path":"天津,天津,中
国","timezone":"Asia/Shanghai","timezone_offset":"+08:00"},"now":
{"text":"晴","code":"1","temperature":"3"},"last_update":"2022-02-09T21:18:05+08:00"}]}

代码如下：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>获取天气</title>
	</head>
	<body>
		<h1>天津天气</h1>
		<p id="weather"></p>
	</body>
	<script>
	var wea = {
			"results": [{
				"location": {
					"id": "WWGQDCW6TBW1",
					"name": "天津",
					"country": "CN",
					"path": "天津,天津,中国",
					"timezone": "Asia/Shanghai",
					"timezone_offset": "+08:00"
				},
				"now": {
					"text": "晴",
					"code": "1",
					"temperature": "3"
				},
				"last_update": "2022-02-09T21:18:05+08:00"
			}]
		}
	document.getElementById("weather").innerHTML =wea.results[0].location.name+" "+wea.results[0].now.text+" "+ wea.results[0].now.temperature;
	</script>
</html>

在这里插入图片描述
视频实例（综合了一下）

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>控制台输出信息</title>
	</head>
	<body>
		<script >
			var text = "你好啊世界，这是我自己学的东西" 
			console.log(text)
			console.log(text.substr(4))
			console.log(text.substring(6,7))
			var time = new Date()
			console.log(time)
			console.log(time.getFullYear())
			console.log(time.getFullYear()+"/"+time.getMonth()+"/"+time.getDate()+"/"+time.getHours()+":"+time.getMinutes())
		</script>
	</body>
</html>

关于几种类型的转换

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
	</body>
	<script type="text/javascript">
		console.log(parseInt("123abc"));//123
		console.log(parseInt("abc123"));//NAN
		console.log(parseInt("123.4abc"));//123
		console.log(parseInt("123"));//123
		
		var a = 1;
		var b = "2";
		console.log(a+parseFloat("123abc"));
		console.log(parseFloat("abc123"));
		console.log(parseFloat("123.4abc"));
		console.log(parseFloat("123"));
		
		//toString // 转字符串
		var aa = 10;
		console.log(aa);
		console.log(aa.toString());
		
		// toFixed() // 保留小数
		var cc = 1.325;
		console.log(cc.toFixed(2));
		
		//Number 转数字
		var p = "abc123";
		var q = "123abc";
		var m = "123.4abc";
		console.log(Number(p));
		console.log(Number(q));
		console.log(Number(m));
		
		//Boolean
		console.log(Boolean("a"));
		console.log(Boolean("0"));
		console.log(Boolean("1"));
		console.log(Boolean(null));
		
		//String 
		console.log(String(10));
		console.log(null);
		console.log(String("null"));
	</script>
</html>

在这里插入图片描述

帝黎亚

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
js再学习

基础今天找对象，啊不，是学习对象在 JavaScript 中，对象是王。如果理解了对象，就理解了 JavaScript。在 JavaScript 中，几乎“所有事物”都是对象。布尔是对象（如果用 new 关键词定义）数字是对象（如果用 new 关键词定义）字符串是对象（如果用 new 关键词定义）日期永远都是对象算术永远都是对象正则表达式永远都是对象数组永远都是对象函数永远都是对象对象永远都是对象所有 JavaScript 值，除了原始值，都是对象那么为了找对象（bushi），我
复制链接

扫一扫