js的基本语法
2017-07-16 本文已影响5人
阿凡提说AI
1.helloworld
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<!--页内样式-->
<script type="text/javascript">
// alert('hello world');
// alert('hello world');
alert('hello world');
console.log('哈哈哈哈');
console.log('哈哈哈哈');
console.log('哈哈哈哈');
</script>
<!--<script src=""></script>-->
</head>
<body>
<button onclick="alert('99999');">百度一下</button>
</body>
</html>
2.js的基本语法
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script>
// 数值类型 typeof 查看真实类型
var nums = 10; // number
var money = 100.99; // number
var name = 'jack'; // string
name2 = 'rose'; // string
var result = true; // false boolean
var num = null; // object
// console.log(number, money, name, result);
// console.log(typeof number,typeof money,typeof name,typeof result, typeof num);
var newName = name + name2;
// console.log(newName);
// 运算是从左往右, 任何类型遇到string都会被转为string
var str1 = 10 + 10 + '10' + '10'; // 201010
var str2 = '10' + '10' + 10 + 10; // 101010
var str3 = (10 + 10) + '10' + '10';// 201010
var str4 = 10 + 10 + '10' + 10; // 201010
console.log(str2);
//数组 数组中可以放任何类型的数据
var numbers = [nums, 10, 'hhh', result, num, ['rrr', 10]];
//
// console.log(numbers[5]);
// for(var i=0; i< numbers.length; i++){
// console.log(numbers[i]);
// }
// console.log(typeof numbers);
// 函数
// 加法运算
function sum(num1, num2){
// return num1 + num2;
console.log(num1 + num2)
}
var result = sum(10, 20);
console.log(result);
sum(10, 40);
// 万能的加法函数
function sum(numbers){
var count = 0;
for(var i=0; i<numbers.length; i++){
count = count + numbers[i];
}
return count;
}
var arr = [10, 20, 30, 40, 'jjjj'];
var result = sum(arr);
console.log(result);
// 加强版 arguments
function sum(){
var count = 0;
for(var i=0; i<arguments.length; i++){
count = count + arguments[i];
}
return count;
}
// var result = sum(10, 20, 30, 40);
// console.log(result);
// 匿名函数
var result = function(){
console.log('--------') ;
}
// 调用匿名函数 变量名();
result();
</script>
</body>
</html>
3.js的对象
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script>
//对象
// this 代表所在当前的对象
var dog = {
name : 'wangcai',
height : 1.55,
age : 15,
friends : ['lulu', 'xixi'],
run : function(){
console.log(this.name + '-----在操场上跑步');
},
eat : function(meat){
console.log(this.name + '-----吃'+ meat);
}
}
// for(var pname in dog){
// console.log(pname, dog[pname]);
// }
// console.log(dog.age+'------');
// console.log(dog.friends[0]);
dog.run();
dog.eat('五花肉');
</script>
</body>
</html>
4.批量产生对象
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script>
function Dog(){
console.log('---------');
}
console.log(typeof Dog());
// 普通函数调用
// Dog();
// 构造函数
var dog1 = new Dog(); // [[Dog alloc] init];
// console.log(typeof dog1);
</script>
</body>
</html>
5.批量生产对象2
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script>
//构造函数 不带参数
var Dog = function(){
this.name = null;
this.height = null;
this.age = null;
this.eat = function(meat){
console.log(this.name + '------吃'+ meat);
};
this.run = function(){
console.log(this.name + '------跑');
}
};
// 批量产生对象
var dog1 = new Dog();
dog1.name = 'wangcai';
dog1.height = 1.55;
dog1.eat('五花肉');
var dog2 = new Dog();
dog2.name = 'lulu';
dog2.eat('骨头');
dog2.height = 1.00;
console.log(dog1, dog2);
//构造函数 带参数
// var Dog = function(name, height, age){
// this.name = name;
// this.height = height;
// this.age = age;
// this.eat = function(meat){
// console.log(this.name + '------吃'+ meat);
// };
// this.run = function(){
// console.log(this.name + '------跑');
// }
// };
//
// var dog1 = new Dog('wangcai', 1.44, 10);
// var dog2 = new Dog('ahuang', 0.11);
//
// console.log(dog1, dog2);
</script>
</body>
</html>
6.松散的语法
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script>
// && ||
var name1 = 'name1';
var name2 = 'name2';
var name3 = 'name3';
var name4 = 'name4';
var newName = null;
if(name1){
newName = name1;
}else if(name2){
newName = name2;
}else if(name3){
newName = name3;
}else{
newName = name4;
}
// console.log(newName);
// ||
newName = name1 || name2 || name3 || name4;
// console.log(newName);
var age = 21;
// if(age > 20){
// console.log('可以结婚了');
// }
(age > 20) && console.log('可以结婚了');
</script>
</body>
</html>
