值传递、引用传递、对象、数据渲染、严格模式

01.值传递引用传递

基本数据类型:string、number、boolean、null、undefined；

引用类型（复合类型)：object对象！

基本数据类型：存储在栈

引用类型：堆

1.值传递：

值传递：传递的是基本数据类型的数据（数据不会发生改变）

原理：因为常量不可改变

2.引用类型：

引用传递：传递的对象（数组、对象）

原理：对象存储在堆空间中，自身可以发生改变

3.如果想copy整个数组：（有两种方法）

1：for循环

2：slice();

1.值传递：
var a = 10;
var b = a;
var b = 20;
console.log(a,b);    //10 20
2.引用类型（数组）：
var arr1 = [1,2,3,4,5];
var arr2 = arr1;
arr2[0] = 2;
console.log(arr1);  //(5) [2,2,3,4,5] (对象存储在堆空间中，自身可以发生改变）
//第一种copy数组的方法（for循环）
for(var i = 0 ; i < arr1.length ; i++){
    arr2.push(arr1[i]);
}
arr2[0] = 2222;
console.log(arr2);    //(5) [2222, 2, 3, 4, 5]
console.log(arr1);    //(5) [1, 2, 3, 4, 5]

//第二种copy数组的方法（slice()，截取数据， start和end都不写，返回整个数组arr，常用来快速复制到数组.)
var arr2 = arr1.slice();
arr2[0] = 22;
console.log(arr2);   //(5) [22, 2, 3, 4, 5]
console.log(arr1);    //(5) [1, 2, 3, 4, 5]

02.对象

1.对象

js里面的一个数据类型，引用类型

引用类型是一种数据结构，用于将数据和功能组织在一起

2.对象 ——> 属性和方法

属性就相当于对象内部的私有变量

3.创建对象的方法

(1)构造函数：

var people = new Object();

(2)字面量：

var obj = {};

4.给对象添加属性和方法

people.name = 'xiaoming';
people.age = '20',
people.sex = 'nan',
people.play = function(){
    console.log("玩耍");
}

5.删除属性和方法：

delete obj.name;

6.JSON

JSON是一种轻量级的数据存储格式！键值对 json规定属性和属性值必须放在引号里面

{
    'name' : 'wang',
    'sex' : 'nan',
    'age' : 20
}

注：如果一个对象的属性是一个变量的情况下，怎么添加属性？？？

obj[变量名称] = 值

怎么遍历对象？？？ for in 循环

for(var key in obj){

}
简单操作：
//json格式
var xiaodingdang = {
    age : 20,
    sex : "nan",
    height : 180,
    weight : 100,
    play : function(){
        console.log("玩耍");
    }
}
//console.log(xiaodingdang);
xiaodingdang.play();

//对象遍历，i为键
for(i in xiaodingdang){
    console.log(xiaodingdang[i]);
}

03.数据渲染

把数据渲染在页面上

循环遍历整个数组

根据数组的下标获取的是某个对象，然后从里面获取对应的属性值

<style>
    *{
    margin : 0; 
    padding : 0;
}
    .goodBox{
        margin:10px auto;
        width:1200px;
        overflow:hidden;  /*防止高度塌陷*/
    }
.goods{
    width:200px;
    height:350px;
    border:1px solid red;
    margin:10px;
    float:left;
}
.goods a{
    width: 190px;
    height:250px;
    display:block;
    margin:4px auto;
}
.goods a img{
    display:block;
    width:100%;
    height:100%;
}
.goods h2{
    font-size:20px;
    color:red;
    text-align:center;
}
.goods p{
    padding:5px;
    font-size:12px;
    color:#ccc;
    line-height:20px;
}
</style>

<section class="goodBox" id="box">
    <!-- <div class="goods">
            <a href="#"><img src="" alt=""></a>
            <h2>price</h2>
            <p></p>
        </div> -->
</section>
<script>
                //模拟数据 
                var goods = [
                    {
                        id : 01,
                        price : '1000',
                        imgSrc : 'http://img13.360buyimg.com/n7/jfs/t1/26123/4/9617/119461/5c8082e6Eb533f3fc/f53c4b1b39676fa9.jpg',
                        title : '【特步正品官方】满199立减10，满299立减20，满399立减30，火爆开启，点击查看热卖尖货！'
                    },
                    {
                        id : 02,
                        price : '200',
                        imgSrc : 'http://img10.360buyimg.com/n7/jfs/t1/58638/8/6570/143338/5d4658d3Eeb186fc7/c979efb1c3cdc95a.jpg',
                        title : '范华尼 短袖t恤男2019夏季新款潮流修身半袖体恤男士休闲上衣打底衫POLO衫男 深灰 XL！'
                    },
                    {
                        id : 03,
                        price : '5000',
                        imgSrc : 'http://img10.360buyimg.com/n7/jfs/t1/41293/26/9137/126467/5d29665fEad149728/f5cb00de507f609f.jpg',