js基础知识

jokerJOJO777

已于 2023-11-12 19:01:24 修改

阅读量41

点赞数

文章标签： javascript 开发语言 ecmascript

于 2023-10-31 12:17:31 首次发布

本文链接：https://blog.csdn.net/jokerJOJO777/article/details/134134899

版权

本文介绍了HTML（超文本标记语言）用于页面内容描述，CSS（层叠样式表）美化网页样式，以及JavaScript（脚本语言）实现网页动态交互。讨论了变量、数据类型、常量、DOM和BOM等关键概念及其在网页开发中的应用。

摘要由CSDN通过智能技术生成

html - 标记语言 -负责页面内容

HTML 是用来描述网页的一种语言。HTML 是一种在 Web 上使用的通用标记语言。HTML 允许你格式化文本，添加图片，创建链接、输入表单、框架和表格等等，并可将之存为文本文件，浏览器即可读取和显示。

HTML 指的是超文本标记语言
HTML 不是一种编程语言，而是一种标记语言标记语言是一套标记标签 (markup tag)
HTML 使用标记标签来描述网页文档包含了HTML 标签及文本内容

css - 层叠样式表 - 美化样式
层叠样式表是一组样式设置的规则，用于控制页面的外观样式
实现内容与样式的分离，便于团队开发 ,样式复用，便于网站的后期维护,页面的精确控制，让页面更精美页面外观美化布局和定位

js - 脚本语言(配合html网页) - 是一种具有函数优先的轻量级，解释型或即时编译型的编程语言。
脚本语言、基于对象、动态交互、跨平台性由 ECMAScript，描述了该语言的语法和基本对象文档对象模型（DOM），描述处理网页内容的方法和接口浏览器对象模型（BOM），描述与浏览器进行交互的方法和接口组成

JS代码书写位置

行内式 <button onclick="alert(123)">按钮</button>

内嵌式

head中的 JavaScript 函数

把<script>标签写在html文件中的<head>标签中

 <script>
    alert('hello world')
  </script>

外链式

将代码单独保存为.js格式文件，然后在HTML文件中使用<script src=""></script>这样的形式引入它

有分号与无分号看团队要求,绝大多数无分号规范

注释单行 // 快捷方式 ctrl+/ 多行注释 /* */ 快捷方式 shift+alt或option+a

JS输入输出语句

弹窗 alert(内容)

     alert('双11快到了!!!')  // 弹窗

控制台打印输出 console.log(内容)

console.log('和龙哥学前端，月薪过万')    // 控制台输出  快捷键F12

提示输入用户输入，一般用变量去接收内容。 prompt（内容）

var str = prompt('请您输入内容：')

文档输出 document.write(内容)

document.write('我是js动态生成的')

变量:存储数据的容器

变量是用于存储信息的"容器",也就是内存中的一个空间

定义变量 var 变量名 = 值或先声明后赋值

let 变量名 = 变量值

let定义变量 let不允许重复定义,不具有变量提升(必须先声明再使用)

定义多个变量 let a,b,c=20

注意名字组成部分

1 数字中文字母 _ $

2 不能以数字开头

3 区分大小写

4 不能是关键字 let if else for ...

5 有意义 name age score ...

6 小驼峰命名 studentName, getElementById

变量值

存储在内存空间的数据


 // js执行这段代码时候 默认会把 var声明的变量提升
  console.log(num);
  var num  = 100
 // 等价于下面
  var num 
  console.log(num);
  num = 100

常量-其值不能改变的量

const PI = 3.1415926
    //PI =3.14 // 报错 不能重新赋值(常量名不能直接出现在赋值的左边 )
    //const a // 常量必须初始化
    //a =100
    const arr =  []
    arr[0] = 100 //

数据类型与转换

数字类型number

const age = 18

console.log(typeof NaN); // NaN not a number

字符串string('' `` "") const str = 'hello' // '' 单引号

const str2 = "hello"

const str3 = `hello` // 模版字符串支持换行支持表达式

console.log(typeof str3); // string 字符串

const str4 = 'china'

console.log(str + 'str4'); // hellostr4

console.log(`hello${str4}`); // 'hello' + str4

console.log('我今年'+age+'岁了');

console.log(`我今年${age}岁了`); // 模版字符串拼接

布尔型boolean

const str5 = "hello 'china'"

console.log(str5);

console.log('===========');

const flag = true

const flag2 = false

console.log(typeof flag);// boolean 布尔型

undefined未赋值的变量默认值是undefined，类型是undefined

let school

console.log(school, typeof school); // undefined 'undefined'

空值null

let obj = null

产生独一无二的值Symbol

let s = Symbol() // 产生独一无二的值

console.log(typeof s);// symbol

Bignt大数值

const num = 12n

console.log(typeof num);

检测数据类型typeof 转换

字符串->数字

+'123'->123
     const  age = +prompt('请输入年龄')
     console.log(age, typeof age);
     console.log('1年后您是'+(age  + 1)+'岁');

Number() -> 把其他类型转成数字类型
    console.log(Number('123'));
    console.log(Number(true)); // true->1  false->0
    console.log(Number(null));// null->0
    console.log(Number(undefined));// undefined->NaN

'123'-0 '123'*1 '123'/1 隐式转换

数字->字符串 // 5->'5'

console.log(5+''); // '5'+''-> '5'
    console.log(''+5);
    console.log(String(100));  // '100'
    console.log(String(true)); //  'true'
    console.log(String(null)); // 'null'
    console.log(String(undefined)); // 'undefined'
    console.log((5).toString());//  输出5的十进制字符串形式
    console.log((5).toString(2)); //  输出5的二进制字符串形式

jokerJOJO777

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
1
评论
js基础知识

定义多个变量 let a,b,c=20注意名字组成部分1 数字中文字母 _ $2 不能以数字开头3 区分大小写4 不能是关键字 let if else for ...5 有意义 name age score ...6 小驼峰命名 studentName, getElementById变量值存储在内存空间的数据。
复制链接

扫一扫