javascript学习笔记（一）

wusheep️

于 2024-03-04 17:01:25 发布

阅读量1.6k

点赞数 46

文章标签： javascript 学习笔记

本文链接：https://blog.csdn.net/qq_59746686/article/details/136454383

版权

输出：

使用 window.alert() 弹出警告框。
使用 document.write() 方法将内容写到 HTML 文档中。如果在文档已完成加载后执行 document.write，整个 HTML 页面将被覆盖
使用 innerHTML 写入到 HTML 元素。
使用 console.log() 写入到浏览器的控制台。-右键检查查看

<!DOCTYPE html><html>
<body>

<h1>我的第一个 Web 页面</h1>

	<p id="demo">我的第一个段落</p>

<script>
	document.getElementById("demo").innerHTML = "段落已修改。";
</script>

</body>
</html>

数据类型

var length = 16;                                  // Number 通过数字字面量赋值 
var points = x * 10;                              // Number 通过表达式字面量赋值
var lastName = "Johnson";                         // String 通过字符串字面量赋值
var cars = ["Saab", "Volvo", "BMW"];              // Array  通过数组字面量赋值
var person = {firstName:"John", lastName:"Doe"};  // Object 通过对象字面量赋值

数字，字符串，数组，对象的声明均使用var

可以使用 typeof 操作符来检测变量的数据类型。

typeof "John"                // 返回 string 
typeof 3.14                  // 返回 number
typeof false                 // 返回 boolean
typeof [1,2,3,4]             // 返回 object
typeof {name:'John', age:34} // 返回 object

语句标识符

语句	描述
break	用于跳出循环。
catch	语句块，在 try 语句块执行出错时执行 catch 语句块。
continue	跳过循环中的一个迭代。
do ... while	执行一个语句块，在条件语句为 true 时继续执行该语句块。
for	在条件语句为 true 时，可以将代码块执行指定的次数。
for ... in	用于遍历数组或者对象的属性（对数组或者对象的属性进行循环操作）。
function	定义一个函数
if ... else	用于基于不同的条件来执行不同的动作。
return	退出函数
switch	用于基于不同的条件来执行不同的动作。
throw	抛出（生成）错误。
try	实现错误处理，与 catch 一同使用。
var	声明一个变量。
while	当条件语句为 true 时，执行语句块。

代码折行：document.write("你好 \
世界!");

未进行赋值的变量，默认是undefined，注意与NULL区分。

null表示空对象，不改变类型。undefined清空对象，值和类型都是undefined

js对象

</head>
<body>

<p>创建和使用对象方法。</p>

<p id="demo"></p>
<script>
var person = {
    firstName: "John",
    lastName : "Doe",
    id : 5566,
    fullName : function() 
	{
       return this.firstName + " " + this.lastName;
    }//对象方法作为一个函数定义存储在对象属性中。
};
document.getElementById("demo").innerHTML = person.fullName();
</script>
	
</body>
</html>

js函数

function myFunction(var1,var2)
{
代码
}

js事件

下面是一些常见的HTML事件的列表:

事件	描述
onchange	HTML 元素改变
onclick	用户点击 HTML 元素
onmouseover	鼠标指针移动到指定的元素上时发生
onmouseout	用户从一个 HTML 元素上移开鼠标时发生
onkeydown	用户按下键盘按键
onload	浏览器已完成页面的加载

js字符串

在 JavaScript 中，字符串写在单引号或双引号中。

因为这样，以下实例 JavaScript 无法解析：

"We are the so-called "Vikings" from the north."

字符串 "We are the so-called " 被截断。

如何解决以上的问题呢？可以使用反斜杠 (\) 来转义 "Vikings" 字符串中的双引号，如下:

"We are the so-called \"Vikings\" from the north."

反斜杠是一个转义字符。转义字符将特殊字符转换为字符串字符：

转义字符 (\) 可以用于转义撇号，换行，引号，等其他特殊字符。

下表中列举了在字符串中可以使用转义字符转义的特殊字符：

代码	输出
\'	单引号
\"	双引号
\\	反斜杠
\n	换行
\r	回车
\t	tab(制表符)
\b	退格符
\f	换页符

常用属性：

length

返回字符串的长度

常用方法：

charAt()	返回指定索引位置的字符
slice()	提取字符串的片断，并在新的字符串中返回被提取的部分
split()	把字符串分割为子字符串数组
substr()	从起始索引号提取字符串中指定数目的字符
substring()	提取字符串中两个指定的索引号之间的字符

模板字符串

const name = 'John';
const age = 31;
const job = 'Web Developer';
const city = 'Beijing';

function hello(){
    return 'hello';
}

let str =`
Name:${name}
age:${age}
job:${job}
city:${city}
calc:${2+2}
function:${hello()}
sanmu: ${age >
30 ? 'over 30': 'under 30' }
`

console.log(str);

${name} 和 ${age} 是模板字符串的表达式部分，它们被包含在 ${} 内部，并在运行时求值。

模板字符串是一种方便的字符串语法，允许你在字符串中嵌入表达式和变量。

模板字符串使用反引号 `` 作为字符串的定界符分隔的字面量。

条件语句

if 语句 - 只有当指定条件为 true 时，使用该语句来执行代码

if (condition)
{
当条件为 true 时执行的代码
}
else
{
当条件不为 true 时执行的代码
}

if...else 语句 - 当条件为 true 时执行代码，当条件为 false 时执行其他代码
if...else if....else 语句- 使用该语句来选择多个代码块之一来执行
switch 语句 - 使用该语句来选择多个代码块之一来执行

switch(n)
{
    case 1:
        执行代码块 1
        break;
    case 2:
        执行代码块 2
        break;
    default:
        与 case 1 和 case 2 不同时执行的代码
}

循环语句

for循环

for (var i=0,len=cars.length; i<len; i++)
{ 
    document.write(cars[i] + "<br>");
}

var i=2,len=cars.length;
for (; i<len; i++)
{ 
    document.write(cars[i] + "<br>");
}//省略写法

for in循环

var person={fname:"Bill",lname:"Gates",age:56}; 
 
for (x in person)  // x 为属性名
{
    txt=txt + person[x];
}

while循环
do while 循环

该循环至少会执行一次，即使条件为 false 它也会执行一次，因为代码块会在条件被测试前执行：

break 语句用于跳出循环。

continue 用于跳过循环中的一个迭代。

类型转换

xx->number :Number(xx)

xx->string: toString(xx)

正则表达式

使用单个字符串来描述、匹配一系列符合某个句法规则的字符串搜索模式。正则表达式可用于所有文本搜索和文本替换的操作

/正则表达式主体/修饰符(可选)

修饰符	描述
i	执行对大小写不敏感的匹配。
g	执行全局匹配（查找所有匹配而非在找到第一个匹配后停止）。
m	执行多行匹配。

正则表达式通常用于两个字符串方法 : search() 和 replace()。

search() 方法用于检索字符串中指定的子字符串，或检索与正则表达式相匹配的子字符串，并返回子串的起始位置。

replace() 方法用于在字符串中用一些字符串替换另一些字符串，或替换一个与正则表达式匹配的子串。

wusheep️

关注

46
点赞
踩
34

收藏

觉得还不错? 一键收藏
0
评论
javascript学习笔记（一）

方法用于检索字符串中指定的子字符串，或检索与正则表达式相匹配的子字符串，并返回子串的起始位置。方法用于在字符串中用一些字符串替换另一些字符串，或替换一个与正则表达式匹配的子串。是模板字符串的表达式部分，它们被包含在 ${} 内部，并在运行时求值。模板字符串是一种方便的字符串语法，允许你在字符串中嵌入表达式和变量。转义字符 (\) 可以用于转义撇号，换行，引号，等其他特殊字符。模板字符串使用反引号 `` 作为字符串的定界符分隔的字面量。在 JavaScript 中，字符串写在单引号或双引号中。
复制链接

扫一扫