JS基础一

JavaScript 是 Web 的编程语言。

所有现代的 HTML 页面都使用 JavaScript。

JavaScript 是脚本语言

JavaScript 是一种轻量级的编程语言。

JavaScript 是可插入 HTML 页面的编程代码。

JavaScript 插入 HTML 页面后,可由所有的现代浏览器执行。

HTML 页面引入JavaScript的三种方法:

1.写在页面中<head></head>标签或者<body></body>标签中,已<script></script>标签开头

2.直接在当前目录下新建一个.js的文件,在引入时<script src="xxx.js"></script>

注意:html文档的加载执行顺序,从上到下执行,建议js代码写在<body>部分

Js的输出语句:

1.console.log("hello world") //需要到浏览器的控制台查看   alert("hello world")//调用BOM对象下面的Window对象,弹出提示框

2.使用 innerHTML 写入到 HTML 元素。 

<!DOCTYPE html>
<html>
<body>

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

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

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

</body>
</html>

  

3.使用 document.write() 方法将内容写到 HTML 文档中。

<!DOCTYPE html>
<html>
<body>

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

<p>我的第一个段落。</p>

<script>
document.write(Date());
</script>

</body>
</html>

<--!请使用 document.write() 仅仅向文档输出写内容-->

<--!如果在文档已完成加载后执行 document.write,整个 HTML 页面将被覆盖-->

  

JS基础语法:

数据类型:Number(数字)  包含整数,小数,浮点数 ;String(字符串);Array(数组) ; Object(对象);Function(函数)

JS变量声明:ES5---var x,y=1,2;Es6--   let x 声明变量

/*

let允许你声明一个作用域被限制在块级中的变量、语句或者表达式。在Function中局部变量推荐使用let变量,避免变量名冲突。

作用域规则

let 声明的变量只在其声明的块或子块中可用,这一点,与var相似。二者之间最主要的区别在于var声明的变量的作用域是整个封闭函数。

*/

JS数据类型,对象:

值类型(基本类型):字符串(String)、数字(Number)、布尔(Boolean)、对空(Null)、未定义(Undefined)、Symbol。

引用数据类型:对象(Object)、数组(Array)、函数(Function)。

var a=123//数字    var a="hello world" //字符串   var a=true //布尔值   var a =Null //空值    var a;//Undefind 

 

在 JavaScript中,几乎所有的事物都是对象,JavaScript 对象是拥有属性和方法的数据。声明对象的方法:   

JS中使用{}来表示对象

//声明对象
<script>
//声明方法1
var obj={name:"tang","func":add,"age":"23"}    
var obj={};
obj["name"]="alex"
console.log(obj)


//声明方法二
 var objs=new Object()
 objs[name]="alex";
 objs["age"]=20;
 console.log(objs)


</scrpit>

  

 

JS中访问对象属性和方法

访问对象属性:

var obj={name:"tang",age:"20"};

console.log(obj.name,obj.["age"]);//使用对象下标 或 对象.属性来访问

访问方法

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>菜鸟教程(runoob.com)</title> 
</head>
<body>

<p>创建和使用对象方法。</p>
<p>对象方法作为一个函数定义存储在对象属性中。</p>
<p id="demo1"></p>
<p id="demo2"></p>
<script>
var person = {
    firstName: "John",
    lastName : "Doe",
    id : 5566,
    fullName : function() 
    {
       return this.firstName + " " + this.lastName;
    }
};
func=person["fullName"]
document.getElementById("demo1").innerHTML = "不加括号输出函数表达式:" + person.fullName;
/*

不加括号输出函数表达式:function() { return this.firstName + " " + this.lastName; }

*/
document.getElementById("demo").innerHTML = person.fullName();

</script>
    
</body>
</html>

JS的作用域

JavaScript 作用域
在 JavaScript 中, 对象和函数同样也是变量。

在 JavaScript 中, 作用域为可访问变量,对象,函数的集合。

JavaScript 函数作用域: 作用域在函数内修改。


javascript局部作用域:
变量在函数内声明,变量为局部作用域。
局部变量:只能在函数内部访问。

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>菜鸟教程(runoob.com)</title> 
</head>
<body>

<p>局部变量在声明的函数外不可以访问。</p>
<p id="demo"></p>
<script>
myFunction();
document.getElementById("demo").innerHTML = "carName 的类型是:" +  typeof carName;
function myFunction() 
{
    var carName = "Volvo";
}
</script>

</body>
</html>

因为局部变量只作用于函数内,所以不同的函数可以使用相同名称的变量。

局部变量在函数开始执行时创建,函数执行完后局部变量会自动销毁。

javascript 全局变量
变量在函数外定义,即为全局变量。
全局变量有 全局作用域: 网页中所有脚本和函数均可使用。 
如果变量在函数内没有声明(没有使用 var 关键字),该变量为全局变量。
<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>菜鸟教程(runoob.com)</title> 
</head>
<body>

<p>
如果你的变量没有声明,它将自动成为全局变量:
</p>
<p id="demo"></p>
<script>
myFunction();
document.getElementById("demo").innerHTML =
	"我可以显示 " + carName;
function myFunction() 
{
    carName = "Volvo";
}
</script>

</body>
</html>

变量的声明周期:
JavaScript 变量生命周期在它声明时初始化。

局部变量在函数执行完毕后销毁。

全局变量在页面关闭后销毁。

函数参数为局部变量,只对函数起作用

 

JS的判断语句及条件循环:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

    
<script>
    //判断语句
    var i=5
    if (i<10)
    {
        console.log(i)
    }
    
    else{

        alert("false")
}

//JS判断语句 if()---else   if()--elseif()--else  注意:==是值想等  ===是全等及比较类型也想等


//JS循环 for while循环
for (var i=0;i<10;i++){
    console.log(i)
}

var a=0
while (a>10){
    console.log(a);
    a++;
}

//a++是先执行代码在加一  ++a是先加1在执行代码  a--、--a同理

//例子:通过for循环遍历数组
var arr=[1,2,3,4,5]
for (i in arr ){
    //将下标作遍历
    console.log(arr[i])
}

//length JS里面的对象都具有的属性
for (var i=0;i<arr.length;i++){
    console.log(arr[i])
}


</script>

</body>
</html>    


        

  

如果我失败了,至少我尝试过,不会因为痛失机会而后悔
原文地址:https://www.cnblogs.com/tangcode/p/11880796.html